Track tab change

[arnaud]

Hi all,

I wrote the following code to keep track of what tab is selected so the user will see it again when coming back to the page.

This solution works but is not very clean so i'd welcome comments :)


myobj.state = function () {
return {
saveTab: function (e) {
var activetab = this.getActiveTab();
if (activetab) {
var state = YAHOO.ext.state.Manager;
var id = this.el.id + '-tab-state';
state.set(id, activetab.id);
}
},

restoreTab: function (tabPanel) {
YAHOO.ext.state.Manager.setProvider(new YAHOO.ext.state.CookieProvider());
var state = YAHOO.ext.state.Manager;
var id = tabPanel.el.id + '-tab-state';
var activatetab = state.get(id);
if (activatetab) {
return activatetab;
}
return false;
},

setup: function (tabPanel, defaultTab) {
var restore_tab = myobj.state.restoreTab(tabPanel);

if (restore_tab) {
tabPanel.activate(restore_tab);
} else {
tabPanel.activate(defaultTab);
}

YAHOO.util.Event.addListener(tabPanel.el.id, 'click', myobj.state.saveTab, tabPanel, true);
}
}
}();


To use it I add the following code after setting up the tabPanel.


var tabs = new YAHOO.ext.TabPanel('tabpanel');
//tabs.add();
myobj.state.setup(tabs, 'defaultTab');