Christoph Polus
|
Monday 27 June 2005 9:11:20 am
Hello I've got some problems understanding the TreeMenu function. I have a navigation that looks like this:
Page 1
- Sub1.1
- Sub1.2
Page 2
- Sub2.1 - Sub2.2 What I would like to achieve now is an output like this:
<a href="URL" id="ID">LINKTEXT(Page1)</a>
<a href="URL" id="ID">LINKTEXT(Page2)</a>
<br/>
[somewhere else in the site]
<div id="PARENT_ID(ID of Page1)
<a href="URL" id="ID">LINKTEXT(Page1.1)</a>
<a href="URL" id="ID">LINKTEXT(Page1.2)</a>
</div>
<div id="PARENT_ID(ID of Page2)
<a href="URL" id="ID">LINKTEXT(Page2.1)</a>
<a href="URL" id="ID">LINKTEXT(Page2.2)</a>
</div>
The divs are set to visible on mouseover the pages on top level. So when I hover with my mouse on Page 1, the DIV with the children of page 1 should appear. Now this works statically. But I'd like to implement this into the TreeMenu. Now I don't know how I can loop through all the level 2 objects, sort them by parent and priority and get their parent id once to put it into the encapsulating DIV as reference. Does anybody have an idea?
Thanks Chris
|
Christoph Polus
|
Tuesday 28 June 2005 7:50:02 am
Hi I'm almost there. This is what I have for now:
{let topMenus=treemenu($module_result.path, 2, true() , 0, 0)}
<div id="leftNavigation">
{section name=topMenu loop=$topMenus max=3}
{section show=$topMenu:item.is_selected}
<a id="navItem{$topMenu:item.id}" onmouseover="clearTimeout(timer); showDiv('navItem{$topMenu:item.id}', 'subNavLayer{$topMenu:item.id}');" onmouseout="timer=setTimeout('hideDiv({$topMenu:item.id})', pause);" href={$topMenu:item.url_alias|ezurl}>{$topMenu:item.text}</a>
{section-else}
<a id="navItem{$topMenu:item.id}" onmouseover="clearTimeout(timer); showDiv('navItem{$topMenu:item.id}', 'subNavLayer{$topMenu:item.id}');" onmouseout="timer=setTimeout('hideDiv({$topMenu:item.id})', pause);" href={$topMenu:item.url_alias|ezurl}>{$topMenu:item.text}</a>
{/section}
{/section}
</div>
{section name=topMenu loop=$topMenus max=3}
<div style="left: 502px; top: 226px; visibility: hidden;" id="subNavLayer{$topMenu:item.id}">
[What to put here?]
</div>
{/section}
{/let}
Now I only need to find out how I can iterate through all the children objects to output the subobjects.
Thanks for any help. Chris
|
Christoph Polus
|
Tuesday 15 November 2005 2:18:46 am
Hey, I did this a long time ago but wanted to share my findings with other people who need assistance in understanding the TreeMenu for the first time. Here you are.
{let topMenus=treemenu($module_result.path, 2, true() , 0, 0)}
<div id="leftNavigation">
{section name=topMenu loop=$topMenus max=3}
{section show=eq( $module_result.path[1].node_id, $topMenu:item.id )}
<a id="navItem{$topMenu:number}" onmouseover="clearTimeout(timer); showDiv('navItem{$topMenu:number}', 'subNavLayer{$topMenu:number}');" onmouseout="timer=setTimeout('hideDiv({$topMenu:number})', pause);" href={$topMenu:item.url_alias|ezurl}>{$topMenu:item.text}</a>
{section-else}
<a id="navItem{$topMenu:number}" onmouseover="clearTimeout(timer); showDiv('navItem{$topMenu:number}', 'subNavLayer{$topMenu:number}');" onmouseout="timer=setTimeout('hideDiv({$topMenu:number})', pause);" href={$topMenu:item.url_alias|ezurl}>{$topMenu:item.text}</a>
{/section}
{/section}
</div>
{section name=topMenu loop=$topMenus max=2}
<div id="subNavLayer{$topMenu:number}" class="subNavLayer" style="left: 502px; top: 226px; visibility: hidden;" onmouseover="clearTimeout(timer);" onmouseout="timer=setTimeout('hideAllDiv()', pause);">
{def $dhtmlMenus=fetch( 'content', 'list', hash('parent_node_id', $topMenu:item.id, 'sort_by', array( array( 'priority' ) ) ) )}
{foreach $dhtmlMenus as $dhtmlMenu}
<a class="subNav" href={$dhtmlMenu.url_alias|ezurl}>{$dhtmlMenu.name}</a>
{delimiter}<div class="subNavLine"> </div>{/delimiter}
{/foreach}
</div>
{/section}
{/let}
|