Jump to content
formmailer

Need help with Navigation tree issue

Recommended Posts

Hi!

 

I have a side menu, based on the renderNavTree function that comes with the default site template in PW:

/**
 * Given a group of pages, render a <ul> navigation tree
 *
 * This is here to demonstrate an example of a more intermediate level
 * shared function and usage is completely optional. This is very similar to
 * the renderNav() function above except that it can output more than one
 * level of navigation (recursively) and can include other fields in the output.
 *
 * @param array|PageArray $items
 * @param int $maxDepth How many levels of navigation below current should it go?
 * @param string $fieldNames Any extra field names to display (separate multiple fields with a space)
 * @param string $class CSS class name for containing <ul>
 * @return string
 *
 */
function renderNavTree($items, $maxDepth = 0) {

	// if we were given a single Page rather than a group of them, we'll pretend they
	// gave us a group of them (a group/array of 1)
	if($items instanceof Page) $items = array($items);

	// $out is where we store the markup we are creating in this function
	$out = '';

	// cycle through all the items
	foreach($items as $item) {



		// if there are extra field names specified, render markup for each one in a <div>
		// having a class name the same as the field name

/*		if($fieldNames) foreach(explode(' ', $fieldNames) as $fieldName) {
			$value = $item->get($fieldName);
			if($value) $out .= " <div class='$fieldName'>$value</div>";
		}
*/

		// if the item has children and we're allowed to output tree navigation (maxDepth)
		// then call this same function again for the item's children 
		if($item->hasChildren() && $maxDepth) {
			$out .= '<div class="w3-block w3-padding w3-white w3-left-align accordion">';
			$out .= $item->title;
			$out .= ' <i class="fa fa-caret-down"></i></div>';
			$out .= '<div class="w3-bar-block w3-hide w3-padding-large w3-medium">';
 			$out .= renderNavTree($item->children, $maxDepth-1);
 			$out .= '</div>';
		}
		else {
			// markup for the link
			$out .= "<a href='$item->url' class='w3-bar-item w3-button w3-opacity-min'>$item->title</a>";
		}

	}

	// if output was generated above, wrap it in a <ul>
	// if($out) $out = "<ul class='$class'>$out</ul>\n";
	

	// return the markup we generated above
	return $out;
}

The only problem is that all submenus are hidden by default (the w3-hide class).

Now I am looking for a way to find if the current page is somewhere in the tree, this part of the tree should be visible:

Eg. If I am on the page called "Complete rondreis “Arvid” met Buro Scanbrit", the menu shoul look like this:

 

image.png.68853d9cedc7f6d374623ae1e0c992a4.png

And when I am on the Page called "Buro Scanbrit", the menu should be like this:

image.png.2f71f3eeec90bf9de74552b98b2db739.png

How do I achieve this? I guess I need to check if $item is (grand)parent of the current page, but I can't really figure out how to do this. Any smart suggestions?

Thanks in advance!

//Jasper 

Share this post


Link to post
Share on other sites
		if($item->hasChildren() && $maxDepth) {
			$out .= '<div class="w3-block w3-padding w3-white w3-left-align accordion">';
			$out .= $item->title;
			$out .= ' <i class="fa fa-caret-down"></i></div>';
			if ( $item->id == wire('page')->id ) {
				$out .= '<div class="w3-bar-block w3-padding-large w3-medium">';
			} else {
				$out .= '<div class="w3-bar-block w3-hide w3-padding-large w3-medium">';
			}	
 			$out .= renderNavTree($item->children, $maxDepth-1);
 			$out .= '</div>';
		}
		else {
			// markup for the link
			$out .= "<a href='$item->url' class='w3-bar-item w3-button w3-opacity-min'>$item->title</a>";
		}

 

Quick & Dirty. Can you try this one?

  • Like 1

Share this post


Link to post
Share on other sites
1 hour ago, maxf5 said:

		if($item->hasChildren() && $maxDepth) {
			$out .= '<div class="w3-block w3-padding w3-white w3-left-align accordion">';
			$out .= $item->title;
			$out .= ' <i class="fa fa-caret-down"></i></div>';
			if ( $item->id == wire('page')->id ) {
				$out .= '<div class="w3-bar-block w3-padding-large w3-medium">';
			} else {
				$out .= '<div class="w3-bar-block w3-hide w3-padding-large w3-medium">';
			}	
 			$out .= renderNavTree($item->children, $maxDepth-1);
 			$out .= '</div>';
		}
		else {
			// markup for the link
			$out .= "<a href='$item->url' class='w3-bar-item w3-button w3-opacity-min'>$item->title</a>";
		}

 

Quick & Dirty. Can you try this one?

I just solved it using Bernhard's tips, so I didn't try this one.  But looking at it quickly, I don't think it would solve the whole problem, since the pages parents are still hidden.

But thank you for your reply, It's very much appreciated.

 

/Jasper

Edited by formmailer

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By awesomolocity
      Alright. So I'm converting a site I already have to Processwire (really enjoying it so far!). I wanted to convert the previous tables that I had data in to Processwire pages. But I'm wondering what the optimal way to structure pages would be.
       
      So basically, I have three main tables.
      Users (and all accompanying information)
      Items (and all accompanying information)
      Aquariums (each user only has 1 aquarium. Currently, user_id is a FK)
      Fish (type of item. Aquariums may have multiple fish)
      Aqua_settings (Things like lightness, temperature, etc)
       
      So in my current setup, there are a lot of Foreign Keys. I could accomplish essentially the same thing by using the Page Reference field.
      Alternatively, I could make fish and aqua_settings both be children of Aquarium. I could differentiate by doing $aquarium->children('template=aqua_settings'); or something.
       
      So my question is...should I be using the Page Reference field or structuring the pages as children? (Or are both equally fine depending on how I want to go about doing things)
    • By t0mD
      Hi,
      I'm wondering if anyone could give me a bit of help, i'm a php newbie, so you mkight need to be patient!
      I'm trying to build a navigation menu that's contextual depending on where you are in the site, let me try to explain.
      the site tree would be something like this 
      Root 
      - section
      -sub-section
      -article
      -article
      -article
      -sub-section
      -article
      -article
      -article
      -sub-section
      - section
      - section
      - section
          I need to find a way to get the -section level you are in which always has a different template from the rest (if that makes a difference)   I hope this makes some kind of sense.  I've been tying myself in knots trying to come up with different solutions!   Many thanks in advance for any help you can give me
    • By opalepatrick
      Hi, 
      I am trying to do this:
      if ($page->parents->has("by-usage")) { where I know the parent name exists and is called by-usage. Is this correct as I am not getting an error nor an expected result?
      Thanks for the help.
×
×
  • Create New...