History.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:6k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ /**
  2.  * @class Ext.History
  3.  * @extends Ext.util.Observable
  4.  * History management component that allows you to register arbitrary tokens that signify application
  5.  * history state on navigation actions.  You can then handle the history {@link #change} event in order
  6.  * to reset your application UI to the appropriate state when the user navigates forward or backward through
  7.  * the browser history stack.
  8.  * @singleton
  9.  */
  10. Ext.History = (function () {
  11.     var iframe, hiddenField;
  12.     var ready = false;
  13.     var currentToken;
  14.     function getHash() {
  15.         var href = top.location.href, i = href.indexOf("#");
  16.         return i >= 0 ? href.substr(i + 1) : null;
  17.     }
  18.     function doSave() {
  19.         hiddenField.value = currentToken;
  20.     }
  21.     function handleStateChange(token) {
  22.         currentToken = token;
  23.         Ext.History.fireEvent('change', token);
  24.     }
  25.     function updateIFrame (token) {
  26.         var html = ['<html><body><div id="state">',token,'</div></body></html>'].join('');
  27.         try {
  28.             var doc = iframe.contentWindow.document;
  29.             doc.open();
  30.             doc.write(html);
  31.             doc.close();
  32.             return true;
  33.         } catch (e) {
  34.             return false;
  35.         }
  36.     }
  37.     function checkIFrame() {
  38.         if (!iframe.contentWindow || !iframe.contentWindow.document) {
  39.             setTimeout(checkIFrame, 10);
  40.             return;
  41.         }
  42.         var doc = iframe.contentWindow.document;
  43.         var elem = doc.getElementById("state");
  44.         var token = elem ? elem.innerText : null;
  45.         var hash = getHash();
  46.         setInterval(function () {
  47.             doc = iframe.contentWindow.document;
  48.             elem = doc.getElementById("state");
  49.             var newtoken = elem ? elem.innerText : null;
  50.             var newHash = getHash();
  51.             if (newtoken !== token) {
  52.                 token = newtoken;
  53.                 handleStateChange(token);
  54.                 top.location.hash = token;
  55.                 hash = token;
  56.                 doSave();
  57.             } else if (newHash !== hash) {
  58.                 hash = newHash;
  59.                 updateIFrame(newHash);
  60.             }
  61.         }, 50);
  62.         ready = true;
  63.         Ext.History.fireEvent('ready', Ext.History);
  64.     }
  65.     function startUp() {
  66.         currentToken = hiddenField.value ? hiddenField.value : getHash();
  67.         if (Ext.isIE) {
  68.             checkIFrame();
  69.         } else {
  70.             var hash = getHash();
  71.             setInterval(function () {
  72.                 var newHash = getHash();
  73.                 if (newHash !== hash) {
  74.                     hash = newHash;
  75.                     handleStateChange(hash);
  76.                     doSave();
  77.                 }
  78.             }, 50);
  79.             ready = true;
  80.             Ext.History.fireEvent('ready', Ext.History);
  81.         }
  82.     }
  83.     return {
  84.         /**
  85.          * The id of the hidden field required for storing the current history token.
  86.          * @type String
  87.          * @property
  88.          */
  89.         fieldId: 'x-history-field',
  90.         /**
  91.          * The id of the iframe required by IE to manage the history stack.
  92.          * @type String
  93.          * @property
  94.          */
  95.         iframeId: 'x-history-frame',
  96.         
  97.         events:{},
  98.         /**
  99.          * Initialize the global History instance.
  100.          * @param {Boolean} onReady (optional) A callback function that will be called once the history
  101.          * component is fully initialized.
  102.          * @param {Object} scope (optional) The callback scope
  103.          */
  104.         init: function (onReady, scope) {
  105.             if(ready) {
  106.                 Ext.callback(onReady, scope, [this]);
  107.                 return;
  108.             }
  109.             if(!Ext.isReady){
  110.                 Ext.onReady(function(){
  111.                     Ext.History.init(onReady, scope);
  112.                 });
  113.                 return;
  114.             }
  115.             hiddenField = Ext.getDom(Ext.History.fieldId);
  116.             if (Ext.isIE) {
  117.                 iframe = Ext.getDom(Ext.History.iframeId);
  118.             }
  119.             this.addEvents('ready', 'change');
  120.             if(onReady){
  121.                 this.on('ready', onReady, scope, {single:true});
  122.             }
  123.             startUp();
  124.         },
  125.         /**
  126.          * Add a new token to the history stack. This can be any arbitrary value, although it would
  127.          * commonly be the concatenation of a component id and another id marking the specifc history
  128.          * state of that component.  Example usage:
  129.          * <pre><code>
  130. // Handle tab changes on a TabPanel
  131. tabPanel.on('tabchange', function(tabPanel, tab){
  132.     Ext.History.add(tabPanel.id + ':' + tab.id);
  133. });
  134. </code></pre>
  135.          * @param {String} token The value that defines a particular application-specific history state
  136.          * @param {Boolean} preventDuplicates When true, if the passed token matches the current token
  137.          * it will not save a new history step. Set to false if the same state can be saved more than once
  138.          * at the same history stack location (defaults to true).
  139.          */
  140.         add: function (token, preventDup) {
  141.             if(preventDup !== false){
  142.                 if(this.getToken() == token){
  143.                     return true;
  144.                 }
  145.             }
  146.             if (Ext.isIE) {
  147.                 return updateIFrame(token);
  148.             } else {
  149.                 top.location.hash = token;
  150.                 return true;
  151.             }
  152.         },
  153.         /**
  154.          * Programmatically steps back one step in browser history (equivalent to the user pressing the Back button).
  155.          */
  156.         back: function(){
  157.             history.go(-1);
  158.         },
  159.         /**
  160.          * Programmatically steps forward one step in browser history (equivalent to the user pressing the Forward button).
  161.          */
  162.         forward: function(){
  163.             history.go(1);
  164.         },
  165.         /**
  166.          * Retrieves the currently-active history token.
  167.          * @return {String} The token
  168.          */
  169.         getToken: function() {
  170.             return ready ? currentToken : getHash();
  171.         }
  172.     };
  173. })();
  174. Ext.apply(Ext.History, new Ext.util.Observable());