« Istoriju pišu pobednici | Main | Izašao Netscape 8 »
May 15, 2005
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.
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. :)
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)) < 3600))
{
$fp = fopen($filename,"r");
$content = fread($fp,filesize($filename));
fclose($fp);
return $content;
}
else
{
$menu = new HTML_TreeMenu();
$query1 = "select id,ime from kategorije where parent_id = 0";
$r1 = mysql_query($query1);
if(!$r1)
{
echo "Greska1:".mysql_error();
exit();
}
while(list($cat_id,$ime) = mysql_fetch_row($r1))
{
$main_cat_node[$cat_id] = new HTML_TreeNode(array('text'=>$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. :)
Posted by dinke at May 15, 2005 12:46 PM