Dynamic perforated breadcrumbs

Question

I would like to add a dynamic package to my web application using the Primefaces component. I created a model to click elements on the palette, so that after one of its links is respected, the final links are deleted. This works in most scenarios, but sometimes bradcrumb does not behave as I expect. Basically, to track the landing page, I added a preRenderView listener to each navigation page and implemented the logic for updating the model in a bean session.

  <f:event type="preRenderView" listener="#{bcb.onRenderView}" /> <f:attribute name="pageName" value="ThisPage" /> 

The listener receives the page name as an attribute and receives the full URL (including the query string) from the external context; this information, together with a unique identifier created using the UIViewRoot , is used to build the BreadCrumbItem , which is clicked on the model:

 public void onRenderView(ComponentSystemEvent evt) { UIViewRoot root = (UIViewRoot)evt.getSource(); final String reqUrl = FacesUtils.getFullRequestURL(); String pageName = (String) evt.getComponent().getAttributes().get("pageName"); if(pageName != null) { model.push(new BreadCrumbItem(root.createUniqueId(), pageName, reqUrl)); } else { model.reset(); } } 

The push() and reset() methods of the model are implemented as follows:

 /** * When a link is pushed on the bread crumb, the existing items are analyzed * and if one is found to be equal to the pushed one, the link is not added * and all the subsequent links are removed from the list. * * @param link * the link to be added to the bread crumb */ public void push(BreadCrumbItem link) { boolean found = removeTrailing(link); if(!found) { addMenuItem(link); } } /** * Reset the model to its initial state. Only the home link is retained. */ public void reset() { BreadCrumbItem home = new BreadCrumbItem(); removeTrailing(home); } 

How possible is this approach? Can you suggest a better way to track page navigation without having to use a lifecycle listener? Many thanks for your help.

Answer 1

I implemented my own for my web application, in my case I did not use the p:breadCrumb , because it is implemented using buttons.

Basically, I have an @SessionScoped bean that contains a stack (navigation stack) that stores the entire URL that you have in the palette, and the parameters for each of them. The view part (xhtml) consists of p:button elements that have the outcome stored stack URLs.

When you go to the URL, the corresponding bean f:event type="preRenderView" is called f:event type="preRenderView" (as you do), and the bean takes parameters from the URL, after which it sets itself onto the stack (and not the bean, call it @ViewScoped and will be destroyed, just url and params).

If you click the back button in breadcrum, you will send an additional parameter that indicates the index of the button. Based on this index, the target bean knows that you are trying to restore such a view, therefore, it asks for the navigation stack for these viewing parameters, and the navigation stack deletes the overlays that follow it.

It took me a while, but it is fully functional. Good luck.

Edit

Use caution when using the session area to maintain the current state of navigation. This will affect all open tabs, so this is probably not what you want, unless you expect your end user to be able to use your application on only one tab. In any case, in the general rules of usability, you should use categories, not navigation paths for your breadcrumbs ( HTTP has no status , but the history itself is stored in the browser). Thus, the dynamic wand no longer makes sense, at least if you use different URLs for your views.