Tree menu bez JavaScripta

Na raznim sajtovima viđali ste takozvani “tree menu” – stablo u stilu Windows Explorera. Oduvek ste želeli tako nešto i na svom sajtu, ali nedovoljno poznavanje JavaScripta kao i problematična kompatibilnost istog među browserima sprečila vas je da tako nešto implementirate.

Zahvaljujući PEAR::HTML_TreeMenu za ovakvo nešto biće vam dovoljno poznavanje PHP-a. U nastavku sledi kratko upustvo sa nadam se korisnim primerima.

Dakle, za početak neophodno je da skinete HTML_TreeMenu fajlove. Ako ste već podesili PEAR dovoljno je da u komandnoj liniji otkucate:
pear install HTML_TreeMenu
što će downloadovati i instalirati potrebne fajlove. Ovo naravno možete odraditi i ručno tako što ćete na http://pear.php.net/get/HTML_TreeMenu-1.2.0.tgz skinuti potrebne fajlove, a zatim ih raspakovati u odgovarajući dir. Spisak fajlova (za verziju 1.2.0) treba da bude isti kao na http://cvs.php.net/cvs.php/pear/HTML_TreeMenu.

Instalacija
Iskopirajte fajlove:
images/
TreeMenu.php
TreeMenu.js
u neki direktorijum (folder) unutar vaseg Web servera. Recimo u /webserverroot/HTML_Tree_Menu/

Jednostavan primer
Iskopirajte fajl example iz docs dira HTML_TreeMenu paketa u HTML_Tree_Menu dir koji ste gore kreirali. Ukucajte u browser http://localhost/HTML_Tree_Menu/example.php (zamenite putanju sa odgovarajućom na vašem kompjuteru). Trebalo bi da dobijete prikaz koji izgleda ovako:

Real life example
Ovo je dosta pojednostavljen primer f-je koja kreira stablo sa proizvodima na boox sajtu. F-ja u primeru izvlači proizvode direktno iz baze. Radi uštede resursa, i smanjenja vremena potrebnog za kreiranje dhtml stabla, js fajl koji f-ja kreira se kešira. Napominjem da je na live sajtu koji sam linkovao gore korišćena pear soap biblioteka (podaci se preko soap klijenta izvlače iz Java servera), koja u kombinaciji sa HTML_TreeMenu pokazuje svu moć PHP-a.

Evo primera sa mysql-om.

require_once("HTML/TreeMenu.php");

function get_dhtml_menu($filename = "cache/.dhtml_menu")
{
	if(file_exists($filename) && ((time() - filemtime($filename)) $ime,'icon' => 'folder.gif','expandedIcon' => 'folder-expanded.gif'));

			$query2 = "select id,ime from kategorije where parent_id = $cat_id";
			$r2 = mysql_query($query2);
			if(!$r2)
			{
				echo "Greska2:".mysql_error();
				exit();
			}
	
			while(list($subcat_id,$subime) = mysql_fetch_row($r2))	
			{
				$sub_cat_node[$subcat_id] = new HTML_TreeNode(array('text'=>$subime,'icon' => 'folder.gif','expandedIcon' => 'folder-expanded.gif','link'=>$_SERVER['PHP_SELF']."?kid=$subcat_id"));
		
				$query3 = "select distinct proizvodjaci.id,proizvodjaci.ime 
							from komponente,proizvodjaci 
							where proizvodjaci.id=komponente.pro_id
							and komponente.kat_id = $subcat_id
							order by proizvodjaci.ime";
				$r3 = mysql_query($query3);
				if(!$r3)
				{
					echo "Greska3:".mysql_error();
					exit();
				}
		
				while(list($proizvodjaci_id,$proizvodjaci_ime) = mysql_fetch_row($r3))	
				{
					$pro_node[$proizvodjaci_id] = &new HTML_TreeNode(array('text'=>$proizvodjaci_ime,'link'=>$_SERVER['PHP_SELF']."?pid=$proizvodjaci_id&kid=$subcat_id"));
					$sub_cat_node[$subcat_id]->addItem($pro_node[$proizvodjaci_id]);
				}
				$main_cat_node[$cat_id]->addItem($sub_cat_node[$subcat_id]);
			}
			$menu->addItem($main_cat_node[$cat_id]);
		}
		$tree = new HTML_TreeMenu_DHTML($menu);
		$html = $tree->toHTML();
		
		$fp = fopen($filename,"w");
		fputs($fp,$html);
		fclose($fp);
		
		return $html;		
	}
}

Resursi
Kakva takva dokumentacija nalazi se unutar docs dira HTML_TreeMenu paketa, a dostupna je i online. Pored ovoga fini primeri postoje i na http://www.phpguru.org/static/treemenu.html, a verujem da se googlanjem može iskopati dosta korisnog, što prepuštam vama. 🙂