docs/source/Manager4.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   5   <title>The source code</title>
   6   <link href="../prettify/prettify.css" type="text/css" rel="stylesheet" />
   7   <script type="text/javascript" src="../prettify/prettify.js"></script>
   8   <style type="text/css">
   9     .highlight { display: block; background-color: #ddd; }
  10   </style>
  11   <script type="text/javascript">
  12     function highlight() {
  13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
  14     }
  15   </script>
  16 </head>
  17 <body onload="prettyPrint(); highlight();">
  18   <pre class="prettyprint lang-js"><span id='Ext-direct-Manager'>/**
  19 </span> * @class Ext.direct.Manager
  20  * &lt;p&gt;&lt;b&gt;&lt;u&gt;Overview&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
  21  *
  22  * &lt;p&gt;Ext.Direct aims to streamline communication between the client and server
  23  * by providing a single interface that reduces the amount of common code
  24  * typically required to validate data and handle returned data packets
  25  * (reading data, error conditions, etc).&lt;/p&gt;
  26  *
  27  * &lt;p&gt;The Ext.direct namespace includes several classes for a closer integration
  28  * with the server-side. The Ext.data namespace also includes classes for working
  29  * with Ext.data.Stores which are backed by data from an Ext.Direct method.&lt;/p&gt;
  30  *
  31  * &lt;p&gt;&lt;b&gt;&lt;u&gt;Specification&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
  32  *
  33  * &lt;p&gt;For additional information consult the
  34  * &lt;a href=&quot;http://sencha.com/products/extjs/extdirect&quot;&gt;Ext.Direct Specification&lt;/a&gt;.&lt;/p&gt;
  35  *
  36  * &lt;p&gt;&lt;b&gt;&lt;u&gt;Providers&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
  37  *
  38  * &lt;p&gt;Ext.Direct uses a provider architecture, where one or more providers are
  39  * used to transport data to and from the server. There are several providers
  40  * that exist in the core at the moment:&lt;/p&gt;&lt;div class=&quot;mdetail-params&quot;&gt;&lt;ul&gt;
  41  *
  42  * &lt;li&gt;{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations&lt;/li&gt;
  43  * &lt;li&gt;{@link Ext.direct.PollingProvider PollingProvider} for repeated requests&lt;/li&gt;
  44  * &lt;li&gt;{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side
  45  * on the client.&lt;/li&gt;
  46  * &lt;/ul&gt;&lt;/div&gt;
  47  *
  48  * &lt;p&gt;A provider does not need to be invoked directly, providers are added via
  49  * {@link Ext.direct.Manager}.{@link Ext.direct.Manager#addProvider addProvider}.&lt;/p&gt;
  50  *
  51  * &lt;p&gt;&lt;b&gt;&lt;u&gt;Router&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
  52  *
  53  * &lt;p&gt;Ext.Direct utilizes a &quot;router&quot; on the server to direct requests from the client
  54  * to the appropriate server-side method. Because the Ext.Direct API is completely
  55  * platform-agnostic, you could completely swap out a Java based server solution
  56  * and replace it with one that uses C# without changing the client side JavaScript
  57  * at all.&lt;/p&gt;
  58  *
  59  * &lt;p&gt;&lt;b&gt;&lt;u&gt;Server side events&lt;/u&gt;&lt;/b&gt;&lt;/p&gt;
  60  *
  61  * &lt;p&gt;Custom events from the server may be handled by the client by adding
  62  * listeners, for example:&lt;/p&gt;
  63  * &lt;pre&gt;&lt;code&gt;
  64 {&quot;type&quot;:&quot;event&quot;,&quot;name&quot;:&quot;message&quot;,&quot;data&quot;:&quot;Successfully polled at: 11:19:30 am&quot;}
  65
  66 // add a handler for a 'message' event sent by the server
  67 Ext.direct.Manager.on('message', function(e){
  68     out.append(String.format('&amp;lt;p&gt;&amp;lt;i&gt;{0}&amp;lt;/i&gt;&amp;lt;/p&gt;', e.data));
  69             out.el.scrollTo('t', 100000, true);
  70 });
  71  * &lt;/code&gt;&lt;/pre&gt;
  72  * @singleton
  73  */
  74
  75 Ext.define('Ext.direct.Manager', {
  76
  77     /* Begin Definitions */
  78     singleton: true,
  79
  80     mixins: {
  81         observable: 'Ext.util.Observable'
  82     },
  83
  84     requires: ['Ext.util.MixedCollection'],
  85
  86     statics: {
  87         exceptions: {
  88             TRANSPORT: 'xhr',
  89             PARSE: 'parse',
  90             LOGIN: 'login',
  91             SERVER: 'exception'
  92         }
  93     },
  94
  95     /* End Definitions */
  96
  97     constructor: function(){
  98         var me = this;
  99
 100         me.addEvents(
 101 <span id='Ext-direct-Manager-event-event'>            /**
 102 </span>             * @event event
 103              * Fires after an event.
 104              * @param {event} e The Ext.direct.Event type that occurred.
 105              * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
 106              */
 107             'event',
 108 <span id='Ext-direct-Manager-event-exception'>            /**
 109 </span>             * @event exception
 110              * Fires after an event exception.
 111              * @param {event} e The Ext.direct.Event type that occurred.
 112              */
 113             'exception'
 114         );
 115         me.transactions = Ext.create('Ext.util.MixedCollection');
 116         me.providers = Ext.create('Ext.util.MixedCollection');
 117
 118         me.mixins.observable.constructor.call(me);
 119     },
 120
 121 <span id='Ext-direct-Manager-method-addProvider'>    /**
 122 </span>     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.
 123      * If the provider is not already connected, it will auto-connect.
 124      * &lt;pre&gt;&lt;code&gt;
 125 var pollProv = new Ext.direct.PollingProvider({
 126     url: 'php/poll2.php'
 127 });
 128
 129 Ext.direct.Manager.addProvider({
 130     &quot;type&quot;:&quot;remoting&quot;,       // create a {@link Ext.direct.RemotingProvider}
 131     &quot;url&quot;:&quot;php\/router.php&quot;, // url to connect to the Ext.Direct server-side router.
 132     &quot;actions&quot;:{              // each property within the actions object represents a Class
 133         &quot;TestAction&quot;:[       // array of methods within each server side Class
 134         {
 135             &quot;name&quot;:&quot;doEcho&quot;, // name of method
 136             &quot;len&quot;:1
 137         },{
 138             &quot;name&quot;:&quot;multiply&quot;,
 139             &quot;len&quot;:1
 140         },{
 141             &quot;name&quot;:&quot;doForm&quot;,
 142             &quot;formHandler&quot;:true, // handle form on server with Ext.Direct.Transaction
 143             &quot;len&quot;:1
 144         }]
 145     },
 146     &quot;namespace&quot;:&quot;myApplication&quot;,// namespace to create the Remoting Provider in
 147 },{
 148     type: 'polling', // create a {@link Ext.direct.PollingProvider}
 149     url:  'php/poll.php'
 150 }, pollProv); // reference to previously created instance
 151      * &lt;/code&gt;&lt;/pre&gt;
 152      * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance
 153      * or config object for a Provider) or any number of Provider descriptions as arguments.  Each
 154      * Provider description instructs Ext.Direct how to create client-side stub methods.
 155      */
 156     addProvider : function(provider){
 157         var me = this,
 158             args = arguments,
 159             i = 0,
 160             len;
 161
 162         if (args.length &gt; 1) {
 163             for (len = args.length; i &lt; len; ++i) {
 164                 me.addProvider(args[i]);
 165             }
 166             return;
 167         }
 168
 169         // if provider has not already been instantiated
 170         if (!provider.isProvider) {
 171             provider = Ext.create('direct.' + provider.type + 'provider', provider);
 172         }
 173         me.providers.add(provider);
 174         provider.on('data', me.onProviderData, me);
 175
 176
 177         if (!provider.isConnected()) {
 178             provider.connect();
 179         }
 180
 181         return provider;
 182     },
 183
 184 <span id='Ext-direct-Manager-method-getProvider'>    /**
 185 </span>     * Retrieve a {@link Ext.direct.Provider provider} by the
 186      * &lt;b&gt;&lt;tt&gt;{@link Ext.direct.Provider#id id}&lt;/tt&gt;&lt;/b&gt; specified when the provider is
 187      * {@link #addProvider added}.
 188      * @param {String/Ext.data.Provider} id The id of the provider, or the provider instance.
 189      */
 190     getProvider : function(id){
 191         return id.isProvider ? id : this.providers.get(id);
 192     },
 193
 194 <span id='Ext-direct-Manager-method-removeProvider'>    /**
 195 </span>     * Removes the provider.
 196      * @param {String/Ext.direct.Provider} provider The provider instance or the id of the provider.
 197      * @return {Ext.direct.Provider} The provider, null if not found.
 198      */
 199     removeProvider : function(provider){
 200         var me = this,
 201             providers = me.providers,
 202             provider = provider.isProvider ? provider : providers.get(provider);
 203
 204         if (provider) {
 205             provider.un('data', me.onProviderData, me);
 206             providers.remove(provider);
 207             return provider;
 208         }
 209         return null;
 210     },
 211
 212 <span id='Ext-direct-Manager-method-addTransaction'>    /**
 213 </span>     * Add a transaction to the manager.
 214      * @private
 215      * @param {Ext.direct.Transaction} transaction The transaction to add
 216      * @return {Ext.direct.Transaction} transaction
 217      */
 218     addTransaction: function(transaction){
 219         this.transactions.add(transaction);
 220         return transaction;
 221     },
 222
 223 <span id='Ext-direct-Manager-method-removeTransaction'>    /**
 224 </span>     * Remove a transaction from the manager.
 225      * @private
 226      * @param {String/Ext.direct.Transaction} transaction The transaction/id of transaction to remove
 227      * @return {Ext.direct.Transaction} transaction
 228      */
 229     removeTransaction: function(transaction){
 230         transaction = this.getTransaction(transaction);
 231         this.transactions.remove(transaction);
 232         return transaction;
 233     },
 234
 235 <span id='Ext-direct-Manager-method-getTransaction'>    /**
 236 </span>     * Gets a transaction
 237      * @private
 238      * @param {String/Ext.direct.Transaction} transaction The transaction/id of transaction to get
 239      * @return {Ext.direct.Transaction}
 240      */
 241     getTransaction: function(transaction){
 242         return transaction.isTransaction ? transaction : this.transactions.get(transaction);
 243     },
 244
 245     onProviderData : function(provider, event){
 246         var me = this,
 247             i = 0,
 248             len;
 249
 250         if (Ext.isArray(event)) {
 251             for (len = event.length; i &lt; len; ++i) {
 252                 me.onProviderData(provider, event[i]);
 253             }
 254             return;
 255         }
 256         if (event.name &amp;&amp; event.name != 'event' &amp;&amp; event.name != 'exception') {
 257             me.fireEvent(event.name, event);
 258         } else if (event.type == 'exception') {
 259             me.fireEvent('exception', event);
 260         }
 261         me.fireEvent('event', event, provider);
 262     }
 263 }, function(){
 264     // Backwards compatibility
 265     Ext.Direct = Ext.direct.Manager;
 266 });
 267 </pre>
 268 </body>
 269 </html>