-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-util.History'>/**
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../prettify/prettify.js"></script>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-util-History'>/**
</span> * @class Ext.util.History
- * History management component that allows you to register arbitrary tokens that signify application
- * history state on navigation actions. You can then handle the history {@link #change} event in order
- * to reset your application UI to the appropriate state when the user navigates forward or backward through
- * the browser history stack.
+
+History management component that allows you to register arbitrary tokens that signify application
+history state on navigation actions. You can then handle the history {@link #change} event in order
+to reset your application UI to the appropriate state when the user navigates forward or backward through
+the browser history stack.
+
+__Initializing__
+The {@link #init} method of the History object must be called before using History. This sets up the internal
+state and must be the first thing called before using History.
+
+__Setup__
+The History objects requires elements on the page to keep track of the browser history. For older versions of IE,
+an IFrame is required to do the tracking. For other browsers, a hidden field can be used. The history objects expects
+these to be on the page before the {@link #init} method is called. The following markup is suggested in order
+to support all browsers:
+
+ <form id="history-form" class="x-hide-display">
+ <input type="hidden" id="x-history-field" />
+ <iframe id="x-history-frame"></iframe>
+ </form>
+
+ * @markdown
* @singleton
*/
Ext.define('Ext.util.History', {
},
-<span id='Ext-util.History-property-fieldId'> /**
+<span id='Ext-util-History-property-fieldId'> /**
</span> * The id of the hidden field required for storing the current history token.
* @type String
* @property
*/
fieldId: Ext.baseCSSPrefix + 'history-field',
-<span id='Ext-util.History-property-iframeId'> /**
+<span id='Ext-util-History-property-iframeId'> /**
</span> * The id of the iframe required by IE to manage the history stack.
* @type String
* @property
*/
iframeId: Ext.baseCSSPrefix + 'history-frame',
-<span id='Ext-util.History-method-init'> /**
+<span id='Ext-util-History-method-init'> /**
</span> * Initialize the global History instance.
* @param {Boolean} onReady (optional) A callback function that will be called once the history
* component is fully initialized.
}
me.addEvents(
-<span id='Ext-util.History-event-ready'> /**
+<span id='Ext-util-History-event-ready'> /**
</span> * @event ready
* Fires when the Ext.util.History singleton has been initialized and is ready for use.
* @param {Ext.util.History} The Ext.util.History singleton.
*/
'ready',
-<span id='Ext-util.History-event-change'> /**
+<span id='Ext-util-History-event-change'> /**
</span> * @event change
* Fires when navigation back or forwards within the local page's history occurs.
* @param {String} token An identifier associated with the page state at that point in its history.
me.startUp();
},
-<span id='Ext-util.History-method-add'> /**
+<span id='Ext-util-History-method-add'> /**
</span> * Add a new token to the history stack. This can be any arbitrary value, although it would
* commonly be the concatenation of a component id and another id marking the specifc history
* state of that component. Example usage:
}
},
-<span id='Ext-util.History-method-back'> /**
+<span id='Ext-util-History-method-back'> /**
</span> * Programmatically steps back one step in browser history (equivalent to the user pressing the Back button).
*/
back: function() {
window.history.go(-1);
},
-<span id='Ext-util.History-method-forward'> /**
+<span id='Ext-util-History-method-forward'> /**
</span> * Programmatically steps forward one step in browser history (equivalent to the user pressing the Forward button).
*/
forward: function(){
window.history.go(1);
},
-<span id='Ext-util.History-method-getToken'> /**
+<span id='Ext-util-History-method-getToken'> /**
</span> * Retrieves the currently-active history token.
* @return {String} The token
*/
getToken: function() {
return this.ready ? this.currentToken : this.getHash();
}
-});</pre></pre></body></html>
\ No newline at end of file
+});</pre>
+</body>
+</html>