Module vue arbre : afficher sous la forme d'un arbre les hashtags de Joomla content

View Comments

Toujours dans l'exploitation et la mise en page des données issues de Joomla Content, aujourd'hui nous allons voir comment j'ai fait une vue sous la forme d'un arbre n-aire des hashtags décrits dans Joomla content.

J'entends déjà les puristes d'ici, alors je mets tout de suite mon alerte : oui, je suis absolument nul en javascript, je hais ce langage et je n'ai pas fait d'affichage d'un arbre avec ouverture et fermetures des branches pour ce module (manque de temps). En plus, même si j'avais su le faire, je ne l'aurais pas fait puisque l'idée est bien de proposer à l'utilisateur la possbilité de "naviguer" dans l'arbre des tags, et pour pouvoir intellectuellement naviguer dans cet arbre, il faut afficher toute l'organisation de l'arbre, des synonymes existant. L'unicité des synonymes étant effectuée par le chemin complet du hashtag.

Parenthèse faite, regardons le code. Le principe est de rechercher directement dans la base de données (puisque je n'ai pas trouvé d'objets Joomla avec les données qui m'interessaient, mais peut être y'en a-t-il !) l'ensemble des enregistrements pouvant reformer cet arbre. En analysant les données de cette table, je me suis rendu compte que la table contenait le champ path, champs de type chaine. C'est donc parfait pour faire un tri dessus au moment de la requête SQL, permettant aissi d'avoir un arbre trié.

Pour rappel, une base de données ne trie JAMAIS ses données (d'un point de vue théorique) même si certains moteurs de recherche le font par défaut. Donc la théorie veut que, si je fait 2 appels consécutifs "select * from matable", la théorie fait que les deux ensembles de données peuvent être ordonnés différement.

Un autre commentaire important : dans mon code vous verrez que je sauvegarde dans un fichier html le contenu de l'arbre récupéré. En fait je profite de le faire à chaque fois pour éventuellement l'envoyer à qui me le demande. En aucun cas, cet enregistrement n'est utile dans l'affichage de l'arbre. Mais je ne voulais pas réécrire un module quasi identique juste pour exporter mon arbre des tags en HTML.

index.php

<html>
<body>

</body>
</html>

helper.php

<?php	
	class mod_vuearbre{
		public static function getArbre(){
			$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off'|| $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
			$t= $protocol.$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"];
			$e = explode('index',$t);
			
			
			JLoader::register('mod_vuearbre',__DIR__.'/helper.php');
			
			$savligne="";
			$document = JFactory::getDocument()->addstylesheet("modules/mod_vuearbre/style.css");
			include("variables.php");
			echo '<div class="descriptif">'.$description.'</div>';
			echo '<div style="overflow:auto;height:500px;width:600px;">';
			
			$conf = JFactory::getConfig();
			$username 	= $conf->get('user');
			$password 	= $conf->get('password');
			$dbname    	= $conf->get('db'); 
			$servername = $conf->get('host');
			
			$conn = new mysqli($servername,$username,$password,$dbname);
			$sql = "select * from doc_tags where published=1 order by path";
			$result = $conn->query($sql);
			
			echo '<div style="background-color:yellow;width:100%;text-align:center;"></div>';
			$body = "<html>";
			$body .= "<head>";
			$body .= '<meta charset="utf-8" />';
			$body .= '<meta name="viewport" content="width=device-width, initial-scale=1.0" />';
			$body .= '<base href="http://localhost/doc/Joomla_3915-Stable-Full_Package_French_v1/index.php/page-accueil/test-tags" />';
			$body .= '<title>Affichage hiérarchisé des tags</title>';
			$body .= '</head>';
			$body .= '<body>';
			
			
			
			if ($result->num_rows>0)
			{
				while ($row=$result->fetch_assoc())
				{
					$t=array();
					$a = substr_count($row["path"],'/');
					for ($i=1;$i<$a;$i++)
					{
							echo "&emsp;";
					}
					$ligne = '<span style="color:red;">&#128193;</span>'.utf8_encode(ucfirst($row["title"])).'<br>';
					$ligne = '<span style="color:red;">&#128193;</span>'.preg_replace('/[\x00-\x0B\x0B\x0C\x0E-\x1F\x7F-\x9F]/u','',utf8_encode(ucfirst($row["title"]))).'<br>';
					echo '<a class="label-arbre_tag" href="/index.php/component/tags/tag/'.$row["path"].'"><span style="color:red;">&#128193;</span>'.utf8_encode(ucfirst($row["title"])).'</a><br>';
					$savligne .= $ligne;
					
				}
				$conn->close();
			}
			echo "</div>";
			
			$fin = "</body></html>";
			//On sauvegarde le fichier
			file_put_contents("AbredesTags.html",$body.$savligne.$fin);
			$ligne= '<div style="color:red;font-size:200%;padding:5px;"><a target="_blank" href="'.$e[0].'AbredesTags.html" download><img src="/images/download.png">Télécharger le fichier par clic droit</a><span style="font-size:10px;">Les images ne seront pas encodées</span></div>';
			return ($ligne);
		}
		
	}
?>

mod_vuearbre.php

Dans ce fichier, des donées liées au HTML dont en dur, n'hésitez pas à les personnaliser

<?php
	defined('_JEXEC') or die;
	require_once dirname(__FILE__).'/helper.php';
	$hello = mod_vuearbre::getArbre();
	require JmoduleHelper::getLayoutPath('mod_vuearbre');
	echo $hello;

mod_vuearbre.xml

<?xml version="1.0" encoding="utf-8" ?>
<extension type="module" version="1.0.0" client="site" method="upgerade">
<name>Vue en arbre des hashtags</name>
<author>Sébastien LHUILLIER</author>
<version>1.0.0</version>
<creationDate>Juillet 2021</creationDate>
<description>Ce module permet de voir en arbre les tags</description>
<files>
	<filename>mod_vuearbre.xml</filename>
	<filename module="mod_vuearbre">mod_vuearbre.php</filename>
	<filename></filename>
	<filename></filename>
	<filename></filename>
	<filename></filename>
</files>
</extension>

style.css

.descriptif{
	color:red;
	font-size:10px;
}

#explications-treeview{
  margin-left:70px;
  padding:10px;
  
}

variables.php

<?php
	$description = "Vous trouverez ici la liste de l'ensemble des hashtags classés. Défilement par molette de souris";
?>

tmpl/default.php

<?php
	defined('_JEXEC') or die;
?>

tmpl/index.html

<html>
<head>

</head>
<body>

</body>
</html>