PHP/JS: How to implement dynamic breadcrumbs? (multi-window/tab compatible)

Question

Hi,

I'm working on a site where we need "dynamic" breadcrumb generation.

Pages within this application are not specific children of the other, so when the user is browsing one of them, I can't simply retrace steps back up.

I could have the following breadcrumbs-like lists: (updated)
* inbox > message > user profile
* search results > user profile
* search results > user profile > new message

( FYI; there will be a few dedicated parent pages that will reset the whole stack. Also there will be a check that prevents recursion. )

So... To accomplish this, I have to remember where the user has been, and in what order. I reckon the most elegant and reliable way to do is, is write a mechanism that remembers the user's history in the session.

If I do that though, the whole thing will break when a user opens a new browser window or tab.

To fix that, I could store this data in the querystring. Though different browsers/proxies have different limits of data that can be transferred that way. So, one day, this will probably break as well.

Does anyone have an idea on how to implement this?

Or;

Does anyone know how to reliably identify different browsers windows?

(I'd rather not rely on javascript for this, unless it's my only workable option. I use dojo toolkit for the frontend)

thanks in advance!

Answer 1

On HTML5 compatible browsers I would save these on the local storage.

You can detect a new tab open like this:

• on page load set a cookie by javascript
• use the onbeforeunload event to clear the cookie

When the visitor will open your site, it will set a cookie eg session=1, if they click on a new link on your site, when they leave the site the cookie will be eg session=0 but as soon as they arrive again on your site it will be session=1. When the visitor will open a new tab, it will encounter a session=1 so probably will do that session=2. You got the point?

Answer 2

window.name survives a new document load. So you can write a history string to window.name and then read it back from the next page, or use a generated name as a key for storing window-specific cookies/sessions.

I don't think this is a good idea though. “Breadcrumbs” are traditionally a hierarchical navigation device, not a history list. The browser already provides a perfectly good history list on the back/forward buttons that it is not useful to reproduce on the page; presenting an on-page history list, especially in a format that is normally a hierarchical place marker, is more likely to confuse users than to be of any help.

Answer 3

I asked a similar question a few months ago. The top answer - which I will am planning to go with - suggested building a path, and parsing that using a combination of mod_rewrite and PHP:

www.mysite.com/inbox/message/user_profile/12345/new_message

Up to a certain point (the request URL should never grow larger than 1024 bytes), that can be quite a good solution. An additional advantage is that the breadcrumb path can even survive sessions, and works in links forwarded to others (if that is desirable in your scenario).

Another thing, looking at your examples, I can't really see the need to reset the history when the user opens a new page, or to take different browser windows into consideration at all. There is a logical hierarchy (not a history) and why should the system start changing then hierarchy just because I choose to open the new message editor in a new tab?