X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/2e847cf21b8ab9d15fa167b315ca5b2fa92638fc..530ef4b6c5b943cfa68b779d11cf7de29aa878bf:/examples/history/history.js?ds=inline diff --git a/examples/history/history.js b/examples/history/history.js index ce45c34e..a53ec3e9 100644 --- a/examples/history/history.js +++ b/examples/history/history.js @@ -1,91 +1,91 @@ /*! - * Ext JS Library 3.1.1 - * Copyright(c) 2006-2010 Ext JS, LLC + * Ext JS Library 3.2.1 + * Copyright(c) 2006-2010 Ext JS, Inc. * licensing@extjs.com * http://www.extjs.com/license */ - -Ext.onReady(function() { - - // The only requirement for this to work is that you must have a hidden field and - // an iframe available in the page with ids corresponding to Ext.History.fieldId - // and Ext.History.iframeId. See history.html for an example. - Ext.History.init(); - - // Needed if you want to handle history for multiple components in the same page. - // Should be something that won't be in component ids. - var tokenDelimiter = ':'; - - var tp = new Ext.TabPanel({ - renderTo: Ext.getBody(), - id: 'main-tabs', - height: 300, - width: 600, - activeTab: 0, - - items: [{ - xtype: 'tabpanel', - title: 'Tab 1', - id: 'tab1', - activeTab: 0, - tabPosition: 'bottom', - - items: [{ - title: 'Sub-tab 1', - id: 'subtab1' - },{ - title: 'Sub-tab 2', - id: 'subtab2' - },{ - title: 'Sub-tab 3', - id: 'subtab3' - }], - - listeners: { - 'tabchange': function(tabPanel, tab){ - Ext.History.add(tabPanel.id + tokenDelimiter + tab.id); - } - } - },{ - title: 'Tab 2', - id: 'tab2' - },{ - title: 'Tab 3', - id: 'tab3' - },{ - title: 'Tab 4', - id: 'tab4' - },{ - title: 'Tab 5', - id: 'tab5' - }], - - listeners: { - 'tabchange': function(tabPanel, tab){ - // Ignore tab1 since it is a separate tab panel and we're managing history for it also. - // We'll use its handler instead in that case so we don't get duplicate nav events for sub tabs. - if(tab.id != 'tab1'){ - Ext.History.add(tabPanel.id + tokenDelimiter + tab.id); - } - } - } - }); - - // Handle this change event in order to restore the UI to the appropriate history state - Ext.History.on('change', function(token){ - if(token){ - var parts = token.split(tokenDelimiter); - var tabPanel = Ext.getCmp(parts[0]); - var tabId = parts[1]; - - tabPanel.show(); - tabPanel.setActiveTab(tabId); - }else{ - // This is the initial default state. Necessary if you navigate starting from the - // page without any existing history token params and go back to the start state. - tp.setActiveTab(0); - tp.getItem(0).setActiveTab(0); - } - }); - + +Ext.onReady(function() { + + // The only requirement for this to work is that you must have a hidden field and + // an iframe available in the page with ids corresponding to Ext.History.fieldId + // and Ext.History.iframeId. See history.html for an example. + Ext.History.init(); + + // Needed if you want to handle history for multiple components in the same page. + // Should be something that won't be in component ids. + var tokenDelimiter = ':'; + + var tp = new Ext.TabPanel({ + renderTo: Ext.getBody(), + id: 'main-tabs', + height: 300, + width: 600, + activeTab: 0, + + items: [{ + xtype: 'tabpanel', + title: 'Tab 1', + id: 'tab1', + activeTab: 0, + tabPosition: 'bottom', + + items: [{ + title: 'Sub-tab 1', + id: 'subtab1' + },{ + title: 'Sub-tab 2', + id: 'subtab2' + },{ + title: 'Sub-tab 3', + id: 'subtab3' + }], + + listeners: { + 'tabchange': function(tabPanel, tab){ + Ext.History.add(tabPanel.id + tokenDelimiter + tab.id); + } + } + },{ + title: 'Tab 2', + id: 'tab2' + },{ + title: 'Tab 3', + id: 'tab3' + },{ + title: 'Tab 4', + id: 'tab4' + },{ + title: 'Tab 5', + id: 'tab5' + }], + + listeners: { + 'tabchange': function(tabPanel, tab){ + // Ignore tab1 since it is a separate tab panel and we're managing history for it also. + // We'll use its handler instead in that case so we don't get duplicate nav events for sub tabs. + if(tab.id != 'tab1'){ + Ext.History.add(tabPanel.id + tokenDelimiter + tab.id); + } + } + } + }); + + // Handle this change event in order to restore the UI to the appropriate history state + Ext.History.on('change', function(token){ + if(token){ + var parts = token.split(tokenDelimiter); + var tabPanel = Ext.getCmp(parts[0]); + var tabId = parts[1]; + + tabPanel.show(); + tabPanel.setActiveTab(tabId); + }else{ + // This is the initial default state. Necessary if you navigate starting from the + // page without any existing history token params and go back to the start state. + tp.setActiveTab(0); + tp.getItem(0).setActiveTab(0); + } + }); + }); \ No newline at end of file