Lister dossier avec un arbre / tree en php / javascript
Soyez le premier à donner votre avis sur cette source.
Vue 20 069 fois - Téléchargée 1 835 fois
Description
Code complet permettant de lister sous forme de menu l'arborescence d'un dossier FTP.
Chaque dossier peut être ouvert ou fermé grâce à des boutons [+] et [-]. Si le dossier est vide, il n'affiche ni le [+], ni le [-] mais une ligne verticale.
Chaque titre de dossier est un lien passant en paramètre le chemin du dossier en question, ainsi, le dossier passé en paramètre est directement ouvert au chargement de la page.
Le path est sécurisé, on ne peut remonter les dossier en faisant ../
Le seul bémol est qu'il y a un éspace entre chaque ligne , ce qui sépare les petites images (pointillés).
ben, amusez-vous bien ! ;-)
Chaque dossier peut être ouvert ou fermé grâce à des boutons [+] et [-]. Si le dossier est vide, il n'affiche ni le [+], ni le [-] mais une ligne verticale.
Chaque titre de dossier est un lien passant en paramètre le chemin du dossier en question, ainsi, le dossier passé en paramètre est directement ouvert au chargement de la page.
Le path est sécurisé, on ne peut remonter les dossier en faisant ../
Le seul bémol est qu'il y a un éspace entre chaque ligne , ce qui sépare les petites images (pointillés).
Source / Exemple :
<style type="text/css">
.lien:hover
{
cursor: pointer;
}
</style>
<script language="javascript">
function toggle(id, img, fin)
{
var elmt = document.getElementById(id);
if(fin == 1)
{
if(elmt.style.display == "none")
{
elmt.style.display = "";
img.setAttribute("src", "./images/moinspetit.png");
}
else
{
elmt.style.display = "none";
img.setAttribute("src", "./images/pluspetit.png");
}
}
else
{
if(elmt.style.display == "none")
{
elmt.style.display = "";
img.setAttribute("src", "./images/moins.png");
}
else
{
elmt.style.display = "none";
img.setAttribute("src", "./images/plus.png");
}
}
}
</script>
<?php
$path = $_GET['path'];
$path = preg_replace('#((\.+\/+)*)#', '', $path); // on enleve les ./ ../ ..// .../ ...// .../// etc
//$path = preg_replace('#(\.+)#', '', $path); //on vire les . .. ... ..... etc
$path = preg_replace('#(\/*)$#', '/', $path); //on remplace / // /// /// (à la fin ) etc ... par /
$path = preg_replace('#(\/+)#', '/', $path); //on remplace / // /// /// etc ... par /
$path = preg_replace('#^(\/)#', '', $path); // on supprimer le / du début
$path = preg_replace('#^(\.+\/+)#', '', $path); //on supprimer les ./ ../ etc du début
$path = preg_replace('#(\.+)$#', '', $path); //on vire les . .. ... ..... etc de la fin
$path = preg_replace('#^(\.+)#', '', $path); //on vire les . .. ... ..... etc du début
$path = './'.$path;
$folders = explode("/", $path);
$i = '-1';
$hierar = '0';
$texte = '';
$vide = '';
function compte($chemin)
{
$i = '0';
$dir = opendir($chemin) or die("erreur");
while ($f = readdir($dir))
{
if($f != '.' && $f != '..')
if(is_dir($chemin.$f))
$i++;
}
return $i;
}
function parcour($chemin, $videok)
{
$nombre = 0;
global $folders;
global $hierar;
global $vide;
$hierar++;
global $texte;
global $i;
$dir = opendir($chemin) or die("erreur");
while ($f = readdir($dir))
{
if($f != '.' && $f != '..')
{
if(is_dir($chemin.$f))
{
$nombre++;
$nombrefolder = compte($chemin.'/');
$nombresusfolder = compte($chemin.$f.'/');
if($nombrefolder == $nombre)
$vide[$hierar] = 1;
else
$vide[$hierar] = 0;
$i++;
if($hierar > '1')
{
for($nb=1; $nb < $hierar; $nb++)
if($videok[$nb] == '1')
$texte .= '<img src="./images/vide.png" alt="" />';
else
$texte .= '<img src="./images/verti.png" alt="" />';
}
if($nombresusfolder == '0')
{
if($nombrefolder == $nombre)
$texte .= '<img src="./images/simplepetit.png" />';
else
$texte .= '<img src="./images/simple.png" />';
}
else
{
$texte .= '<img class="lien" onclick="javascript:toggle(\'dossier'.$i.'\', this, '.$vide[$hierar].');"';
if($nombrefolder == $nombre)
{
if($folders[$hierar] != $f)
$texte .= ' src="./images/pluspetit.png" alt="[+]" />';
else
$texte .= ' src="./images/moinspetit.png" alt="[-]" />';
}
else
{
if($folders[$hierar] != $f)
$texte .= ' src="./images/plus.png" alt="[+]" />';
else
$texte .= ' src="./images/moins.png" alt="[-]" />';
}
}
//AFFICHAGE DE LA LIGNE
$texte .= ' <img src="./images/mini_folder.png" /> <a href="./tree.php?path='.$chemin.$f.'">'.$f.'</a><br />';
//FIN AFFICHAGE DE LA LIGNE
$texte .= '<div id="dossier'.$i.'"';
if($folders[$hierar] != $f)
$texte .= ' style="display: none;"';
else
$texte .= ' alt="[+]" ';
$texte .= ' />';
parcour($chemin.$f.'/', $vide);
$texte .= '</div>';
}
}
}
closedir($dir);
$hierar--;
return $texte;
}
echo parcour("./", $vide);
?>
Conclusion :
ben, amusez-vous bien ! ;-)
Codes Sources
A voir également
- Javascript tree
- Tree php - Meilleures réponses
- Php tree - Meilleures réponses
- Javascript : Treeview tafeltree - CodeS SourceS - Guide
- Fir tree c - Guide
- Récupérer données json (javascript) - Conseils pratiques - Javascript
- Javascript base de données - Conseils pratiques - Javascript
- Calculatrice javascript - Guide
Merci :-)
- Messages postés
-
2483
- Date d'inscription
- jeudi 30 novembre 2006
- Statut
- Membre
- Dernière intervention
- 14 janvier 2011
18Le seul truc, c'est que j'ai pas à faire ma pub sur les sources des autres, en prétendant que ce que j'ai fait est mieux : c'est pas dans mes habitudes d'être prétentieux à ce point. Mes publications sont librements consultables (encore faut-il faire l'effort d'aller les chercher), libre à chacun d'aller les voir (ou pas).
Sinon, tu dis : "ben propose un truc nikel"
Je critiquais la manière de faire, j'ai aussi indiqué comment il faut faire pour bien le faire. Pour ce qui est des explications (pourquoi c'est mieux comme ça), il suffit de lire la doc. Mais comme de nombreuses personnes ne lisent même pas la doc...
- Messages postés
-
2483
- Date d'inscription
- jeudi 30 novembre 2006
- Statut
- Membre
- Dernière intervention
- 14 janvier 2011
18Je vais juste ajouter ce que je dis à chaque fois sur une source de ce genre :
"Vous en avez pas marre d'utiliser opendir() et readdir() ?"
Sérieusement, TOUTES les sources qui font ce genre de choses le font de la même manière. En plus, toi, tu ne le fais même pas correctement :
while ($f = readdir($dir))
La bonne manière de faire est :while (false !($file readdir($handle))) {
C'est dans la doc PHP de la fonction readdir, exemple #1.
Désolé, mais les sources d'affichage de fichiers sont toutes quasiment les mêmes, et c'est pénible à force de voir toujours la même chose.
et les feuilles seraient quoi ?
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.