YUI Browser History Manager

April 7th, 2008

Pretty easy to get something working with YUI BHM (documentation). However I think Google’s manager – used by GWT is prettier. Yahoo’s support multiple modules, though.

The differences

If you have a GMail account you can see for yourself. Once you get into your inbox you’ll see the following on the URL:

/#inbox

Click on Drafts and you’ll notice it’s an ajax call. However the url changes to

/#drafts

Clicking on the back button will go back to /#inbox as expected. If you click Older you’ll notice the pagination parameter:

/#inbox/p2

Searching will also add its parameters:

/#search/MonoRail

Clicking on a message from a search results adds the message id:

/#search/MonoRail/11928f3d966eb997

You can then click Back three times to go back to your inbox.

With Yahoo’s implementation you’d register a module (just a key), a initial state and a callback function. Your initial url would be unchanged:

/something/

Once the user perform some action that changes the state, and you want him to be able to back to the original state, you’d call the function register passing the module name and the new state (string). Imagine a call like register(“mymodule”, “newstate”) would result in the following url:

/something/#mymodule=newstate

If you were to have more modules, it would generate:

/something/#mymodule=newstate&othermodule=otherstate

As you can see it’s not as nice as in the end it’s just a querystring. In my case, search criterias are going to state, so it end up like:

/something/#criteria=p%3D1%26psize%3D10%26f.Type%3DSome

Not as pretty as google’s, but works for now.

4 Responses to “YUI Browser History Manager”

Torkel Says:

What do you mean by a module in this context?

hammett Says:

module is just a group of parameters. In your code you’ll likely read and treat theses parameters in different classes.

ditoudi Says:

And what is the Google solution for module ?

hammett Says:

Not sure they have one. The problem is that their history manager seems to be only available to GWT.

Leave a Reply