Menu sjabloon naar Navigatie sjabloon

[pasmaskas]

Beste CMSMS leden,

Iemand een idee hoe ik dit menu sjabloon:

Code: Select all

{if $count > 0}
{foreach from=$nodelist item=node}
{if $node->depth == 1}
<div id="{$node->alias}" class="content_back" data-type="background" data-speed="30"></div>
{else}
<div id="{$node->alias}" class="content_blocks"></div>
{/if}
{/foreach}
{/if}

omzet naar een Navigator sjabloon. krijg het neit voor elkaar om het deel {if $node->depth == 1} aan de praat te krijgen.

Ik heb dit geprobeert:

Code: Select all

{function name=Nav_pageshow depth=1}
{strip}

{foreach $data as $node}

<div id="{$node->alias}" class="content_back" data-type="background" data-speed="30"></div>


{if isset($node->children)}
<div id="{$node->alias}" class="content_blocks"></div>
{/if}

{/foreach}

{/strip}
{/function}

{if isset($nodes)}
{Nav_pageshow data=$nodes depth=0}
{/if}

en dit:

Code: Select all

{function name=Nav_pageshow depth=1}
{strip}

{foreach $data as $node}

{if $node->depth == 1}
<div id="{$node->alias}" class="content_back" data-type="background" data-speed="30"></div>
{else}
<div id="{$node->alias}" class="content_blocks"></div>
{/if}

{/foreach}

{/strip}
{/function}

{if isset($nodes)}
{Nav_pageshow data=$nodes depth=0}
{/if}

Maar niets werkt! Ik heb ook geen idee wat ik moet doen

Alvast bedantk gr Pascal

[velden]

Als je met Navigator werkt moet je anders gaan denken dan in Menu Manager.

$nodes is een tree. En als je dieper in de tree wilt moet je gebruik maken van recursie.

Recursie wil zeggen dat je van binnen de functie (Nav_pageshow in dit geval) diezelfde functie weer aan kunt roepen. Typisch kan dat gebruikt worden om een tree (boom) van data te doorlopen. Zoek maar eens op 'recursieve functies'.

Uitgebreid voorbeeld:

$nodes:

Code: Select all

|-A
|-B -+-B1
+-C  +-B2 -+B2a
           +B2b

Navigator template:

Code: Select all

{function name=Nav_pageshow depth=1}
  {foreach $data as $node}
    
	{if $depth == 1}
	  <div id="{$node->alias}" class="content_back" data-type="background" data-speed="30"></div>
	{else}
	  <div id="{$node->alias}" class="content_blocks"></div>
	{/if}

    {if isset($node->children)}
      {Nav_pageshow data=$node->children depth=$depth+1}
    {/if}
  {/foreach}
{/function}

{if isset($nodes)}
  {Nav_pageshow data=$nodes depth=0}
{/if}	

Wat gebeurt er nu als je bovenstaande voorbeeld $nodes in dat menu template gooit:

Initieel wordt de hele $nodes tree aan de functie gegeven als parameter voor 'data':

Code: Select all

{if isset($nodes)}
  {Nav_pageshow data=$nodes depth=0}  <== depth = 0
{/if}	

Dus in de functie[1] is $data:

Code: Select all

|-A
|-B -+-B1
+-C  +-B2 -+B2a
           +B2b

en $depth: 0

Merk op dat nu {foreach $data as $node} de items A,B en C zal doorlopen.

Dus begint bij A

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0

Depth == 0 dus: <div id="A" class="content_blocks"></div>
A heeft geen children dus de foreach loop gaat verder naar B

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0

Depth == 0 dus: <div id="B" class="content_blocks"></div>
B heeft WEL children dus (nu wordt het interessant) wordt dezelfde functie opnieuw aangeroepen [2]:

Code: Select all

 {if isset($node->children)}
      {Nav_pageshow data=$node->children depth=$depth+1}
 {/if}

Daarbij is $node->children de (sub)tree die onder B hangt:

Code: Select all

 |-B1
 +-B2 -+B2a
       +B2b

Bovendien wordt depth met 1 verhoogd (naar 1 dus in dit geval)

Merk op dat de eerste functie-aanroep die als het ware in de wacht staat (die 'weet' niet beter dan dat ie met item B bezig is).
De tweede functie aanroep weet ook niets van de eerste. Dat is het mooie van recursieve functies.

De foreach loop gaat nu item B1 en B2 doorlopen

Dus:

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0
 3| B1   | 1

$depth == 1 dus: <div id="B1" class="content_back" data-type="background" data-speed="30"></div>

B1 heeft geen children dus de foreach loop gaat verder naar B2:

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0
 3| B1   | 1
 4| B2   | 1 

$depth == 1 dus: <div id="B2" class="content_back" data-type="background" data-speed="30"></div>

B2 heeft WEL children dus wordt dezelfde functie opnieuw aangeroepen [3]:

Code: Select all

 {if isset($node->children)}
      {Nav_pageshow data=$node->children depth=$depth+1}
 {/if}

Daarbij is $node->children de (sub)tree die onder B2 hangt:

Code: Select all

 |-B2a
 +-B2b

Bovendien wordt depth wederom met 1 verhoogd (naar 2 dus in dit geval)
Merk weer op dat de tweede functie aanroep[2] nu ook in de wacht staat (is nog bezig met B2)

De foreach loop gaat nu item B2a en B2b doorlopen:

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0
 3| B1   | 1
 4| B2   | 1 
 5| B2a  | 2  

Depth == 2 dus: <div id="B2a" class="content_blocks"></div>
B2a heeft geen children dus de foreach loop gaat verder naar B2b:

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0
 3| B1   | 1
 4| B2   | 1 
 5| B2a  | 2  
 6| B2b  | 2  

Depth == 2 dus: <div id="B2b" class="content_blocks"></div>
B2b heeft geen children dus de foreach loop gaat verder maar er is niets meer te doen (B2a en B2b zijn gedaan)

Deze foreach loop wordt afgerond en DEZE functie-aanroep[3] is daarmee klaar.

Functie-aanroep[2] stond in de wacht (was bezig met de foreach loop van B1 en B2, was bezig met B2).
Deze kan nu verder. Er is echter ook hier niets meer te doen want B2 was de laatste node voor deze functie[2].
Dus ook deze foreach loop wordt afgerond en DEZE functie-aanroep[2] is daarmee klaar.

Functie-aanroep[1] stond in de wacht (was bezig met de foreach loop van A,B en C, was bezig met B).
Deze kan nu verder. Er is nog één item te doen, namelijk C:
Bedenk verder dat de $depth van deze functie-aanroep[1] nul was, daar is niets aan veranderd.

Code: Select all

  | item | depth 
--+------+-------
 1| A    | 0
 2| B    | 0
 3| B1   | 1
 4| B2   | 1 
 5| B2a  | 2  
 6| B2b  | 2  
 7| C    | 0   

Depth == 0 dus: <div id="C" class="content_blocks"></div>
C heeft geen children dus de foreach loop gaat verder.
Maar er is niets meer te doen voor functie-aanroep[1].

Hiermee zijn alle items in de tree doorlopen en is de Navigatie compleet.

Mogelijk moet jij voor jouw doeleinden wat wijzigen in de check op $depth, maar dat zie je wel denk ik.

[pasmaskas]

Bedankt voor je reactie velden. Het voorbeeld wat je geplaatst hebt werkt! Moest inderdaad even wat wijzigen (niet veel moest het alleen even omdraaien)

Ik begrijp niet alles wat je beschrijft maar ga er eens rustig voor zitten en mij er in verdiepen. Vind het toch nog best lastig en kan soms de logica er niet in zien wat ik met html/css wel heb.

Gr Pascal

[velden]

Je moet er inderdaad de logica wel van inzien. Maar het valt misschien wel op dat de code veel 'zuiverder' is.

Geen ingewikkelde checks meer om uit te zoeken of je een <li> moet afsluiten en hoe vaak dan etc. etc. Elke functie-aanroep houdt zich namelijk maar met één level bezig. Kom je een nieuw level tegen, dan start je gewoon een nieuwe functie-aanroep, die dat weer voor zijn rekening neemt etc.

Eén ding is wel heel belangrijk bij recursie: je moet er zeker voor zorgen dat er een keer een einde aan komt

[(M)]

Helaas snap ik het niet helemaal, maar de voorbeeld code is erg bruikbaar bij het ombouwen van een {menu} naar {navigator}. Ik heb dit gebruikt om pagina's in één pagina te tonen voor een singelpage of one-page template.

Mijn probleem is nog dat tags als {news number='5'} uit een pagina precies zo getoond worden en in dit geval niet de nieuws items zelf.

@pasmaskas, misschien kun je de typo in de titel aanpassen

[velden]

Mijn probleem is nog dat tags als {news number='5'} uit een pagina precies zo getoond worden en in dit geval niet de nieuws items zelf.

Kijk naar de {eval ...} tag van Smarty

[(M)]

Bedankt voor de tip. Dat werkt.