docs/source/RemotingProvider.html

   1 <html>\r
   2 <head>\r
   3   <title>The source code</title>\r
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   6 </head>\r
   7 <body  onload="prettyPrint();">\r
   8     <pre class="prettyprint lang-js"><div id="cls-Ext.direct.RemotingProvider"></div>/**\r
   9  * @class Ext.direct.RemotingProvider\r
  10  * @extends Ext.direct.JsonProvider\r
  11  * \r
  12  * <p>The {@link Ext.direct.RemotingProvider RemotingProvider} exposes access to\r
  13  * server side methods on the client (a remote procedure call (RPC) type of\r
  14  * connection where the client can initiate a procedure on the server).</p>\r
  15  * \r
  16  * <p>This allows for code to be organized in a fashion that is maintainable,\r
  17  * while providing a clear path between client and server, something that is\r
  18  * not always apparent when using URLs.</p>\r
  19  * \r
  20  * <p>To accomplish this the server-side needs to describe what classes and methods\r
  21  * are available on the client-side. This configuration will typically be\r
  22  * outputted by the server-side Ext.Direct stack when the API description is built.</p>\r
  23  */\r
  24 Ext.direct.RemotingProvider = Ext.extend(Ext.direct.JsonProvider, {       \r
  25     <div id="cfg-Ext.direct.RemotingProvider-actions"></div>/**\r
  26      * @cfg {Object} actions\r
  27      * Object literal defining the server side actions and methods. For example, if\r
  28      * the Provider is configured with:\r
  29      * <pre><code>\r
  30 "actions":{ // each property within the 'actions' object represents a server side Class \r
  31     "TestAction":[ // array of methods within each server side Class to be   \r
  32     {              // stubbed out on client\r
  33         "name":"doEcho", \r
  34         "len":1            \r
  35     },{\r
  36         "name":"multiply",// name of method\r
  37         "len":2           // The number of parameters that will be used to create an\r
  38                           // array of data to send to the server side function.\r
  39                           // Ensure the server sends back a Number, not a String. \r
  40     },{\r
  41         "name":"doForm",\r
  42         "formHandler":true, // direct the client to use specialized form handling method \r
  43         "len":1\r
  44     }]\r
  45 }\r
  46      * </code></pre>\r
  47      * <p>Note that a Store is not required, a server method can be called at any time.\r
  48      * In the following example a <b>client side</b> handler is used to call the\r
  49      * server side method "multiply" in the server-side "TestAction" Class:</p>\r
  50      * <pre><code>\r
  51 TestAction.multiply(\r
  52     2, 4, // pass two arguments to server, so specify len=2\r
  53     // callback function after the server is called\r
  54     // result: the result returned by the server\r
  55     //      e: Ext.Direct.RemotingEvent object\r
  56     function(result, e){\r
  57         var t = e.getTransaction();\r
  58         var action = t.action; // server side Class called\r
  59         var method = t.method; // server side method called\r
  60         if(e.status){\r
  61             var answer = Ext.encode(result); // 8\r
  62     \r
  63         }else{\r
  64             var msg = e.message; // failure message\r
  65         }\r
  66     }\r
  67 );\r
  68      * </code></pre>\r
  69      * In the example above, the server side "multiply" function will be passed two\r
  70      * arguments (2 and 4).  The "multiply" method should return the value 8 which will be\r
  71      * available as the <tt>result</tt> in the example above. \r
  72      */\r
  73     \r
  74     <div id="cfg-Ext.direct.RemotingProvider-namespace"></div>/**\r
  75      * @cfg {String/Object} namespace\r
  76      * Namespace for the Remoting Provider (defaults to the browser global scope of <i>window</i>).\r
  77      * Explicitly specify the namespace Object, or specify a String to have a\r
  78      * {@link Ext#namespace namespace created} implicitly.\r
  79      */\r
  80     \r
  81     <div id="cfg-Ext.direct.RemotingProvider-url"></div>/**\r
  82      * @cfg {String} url\r
  83      * <b>Required<b>. The url to connect to the {@link Ext.Direct} server-side router. \r
  84      */\r
  85     \r
  86     <div id="cfg-Ext.direct.RemotingProvider-enableUrlEncode"></div>/**\r
  87      * @cfg {String} enableUrlEncode\r
  88      * Specify which param will hold the arguments for the method.\r
  89      * Defaults to <tt>'data'</tt>.\r
  90      */\r
  91     \r
  92     <div id="cfg-Ext.direct.RemotingProvider-enableBuffer"></div>/**\r
  93      * @cfg {Number/Boolean} enableBuffer\r
  94      * <p><tt>true</tt> or <tt>false</tt> to enable or disable combining of method\r
  95      * calls. If a number is specified this is the amount of time in milliseconds\r
  96      * to wait before sending a batched request (defaults to <tt>10</tt>).</p>\r
  97      * <br><p>Calls which are received within the specified timeframe will be\r
  98      * concatenated together and sent in a single request, optimizing the\r
  99      * application by reducing the amount of round trips that have to be made\r
 100      * to the server.</p>\r
 101      */\r
 102     enableBuffer: 10,\r
 103     \r
 104     <div id="cfg-Ext.direct.RemotingProvider-maxRetries"></div>/**\r
 105      * @cfg {Number} maxRetries\r
 106      * Number of times to re-attempt delivery on failure of a call.\r
 107      */\r
 108     maxRetries: 1,\r
 109 \r
 110     constructor : function(config){\r
 111         Ext.direct.RemotingProvider.superclass.constructor.call(this, config);\r
 112         this.addEvents(\r
 113             <div id="event-Ext.direct.RemotingProvider-beforecall"></div>/**\r
 114              * @event beforecall\r
 115              * Fires immediately before the client-side sends off the RPC call.\r
 116              * By returning false from an event handler you can prevent the call from\r
 117              * executing.\r
 118              * @param {Ext.direct.RemotingProvider} provider\r
 119              * @param {Ext.Direct.Transaction} transaction\r
 120              */            \r
 121             'beforecall',\r
 122             <div id="event-Ext.direct.RemotingProvider-call"></div>/**\r
 123              * @event call\r
 124              * Fires immediately after the request to the server-side is sent. This does\r
 125              * NOT fire after the response has come back from the call.\r
 126              * @param {Ext.direct.RemotingProvider} provider\r
 127              * @param {Ext.Direct.Transaction} transaction\r
 128              */            \r
 129             'call'\r
 130         );\r
 131         this.namespace = (typeof this.namespace === 'string') ? Ext.ns(this.namespace) : this.namespace || window;\r
 132         this.transactions = {};\r
 133         this.callBuffer = [];\r
 134     },\r
 135 \r
 136     // private\r
 137     initAPI : function(){\r
 138         var o = this.actions;\r
 139         for(var c in o){\r
 140             var cls = this.namespace[c] || (this.namespace[c] = {});\r
 141             var ms = o[c];\r
 142             for(var i = 0, len = ms.length; i < len; i++){\r
 143                 var m = ms[i];\r
 144                 cls[m.name] = this.createMethod(c, m);\r
 145             }\r
 146         }\r
 147     },\r
 148 \r
 149     // inherited\r
 150     isConnected: function(){\r
 151         return !!this.connected;\r
 152     },\r
 153 \r
 154     connect: function(){\r
 155         if(this.url){\r
 156             this.initAPI();\r
 157             this.connected = true;\r
 158             this.fireEvent('connect', this);\r
 159         }else if(!this.url){\r
 160             throw 'Error initializing RemotingProvider, no url configured.';\r
 161         }\r
 162     },\r
 163 \r
 164     disconnect: function(){\r
 165         if(this.connected){\r
 166             this.connected = false;\r
 167             this.fireEvent('disconnect', this);\r
 168         }\r
 169     },\r
 170 \r
 171     onData: function(opt, success, xhr){\r
 172         if(success){\r
 173             var events = this.getEvents(xhr);\r
 174             for(var i = 0, len = events.length; i < len; i++){\r
 175                 var e = events[i];\r
 176                 var t = this.getTransaction(e);\r
 177                 this.fireEvent('data', this, e);\r
 178                 if(t){\r
 179                     this.doCallback(t, e, true);\r
 180                     Ext.Direct.removeTransaction(t);\r
 181                 }\r
 182             }\r
 183         }else{\r
 184             var ts = [].concat(opt.ts);\r
 185             for(var i = 0, len = ts.length; i < len; i++){\r
 186                 var t = this.getTransaction(ts[i]);\r
 187                 if(t && t.retryCount < this.maxRetries){\r
 188                     t.retry();\r
 189                 }else{\r
 190                     var e = new Ext.Direct.ExceptionEvent({\r
 191                         data: e,\r
 192                         transaction: t,\r
 193                         code: Ext.Direct.exceptions.TRANSPORT,\r
 194                         message: 'Unable to connect to the server.',\r
 195                         xhr: xhr\r
 196                     });\r
 197                     this.fireEvent('data', this, e);\r
 198                     if(t){\r
 199                         this.doCallback(t, e, false);\r
 200                         Ext.Direct.removeTransaction(t);\r
 201                     }\r
 202                 }\r
 203             }\r
 204         }\r
 205     },\r
 206 \r
 207     getCallData: function(t){\r
 208         return {\r
 209             action: t.action,\r
 210             method: t.method,\r
 211             data: t.data,\r
 212             type: 'rpc',\r
 213             tid: t.tid\r
 214         };\r
 215     },\r
 216 \r
 217     doSend : function(data){\r
 218         var o = {\r
 219             url: this.url,\r
 220             callback: this.onData,\r
 221             scope: this,\r
 222             ts: data\r
 223         };\r
 224 \r
 225         // send only needed data\r
 226         var callData;\r
 227         if(Ext.isArray(data)){\r
 228             callData = [];\r
 229             for(var i = 0, len = data.length; i < len; i++){\r
 230                 callData.push(this.getCallData(data[i]));\r
 231             }\r
 232         }else{\r
 233             callData = this.getCallData(data);\r
 234         }\r
 235 \r
 236         if(this.enableUrlEncode){\r
 237             var params = {};\r
 238             params[typeof this.enableUrlEncode == 'string' ? this.enableUrlEncode : 'data'] = Ext.encode(callData);\r
 239             o.params = params;\r
 240         }else{\r
 241             o.jsonData = callData;\r
 242         }\r
 243         Ext.Ajax.request(o);\r
 244     },\r
 245 \r
 246     combineAndSend : function(){\r
 247         var len = this.callBuffer.length;\r
 248         if(len > 0){\r
 249             this.doSend(len == 1 ? this.callBuffer[0] : this.callBuffer);\r
 250             this.callBuffer = [];\r
 251         }\r
 252     },\r
 253 \r
 254     queueTransaction: function(t){\r
 255         if(t.form){\r
 256             this.processForm(t);\r
 257             return;\r
 258         }\r
 259         this.callBuffer.push(t);\r
 260         if(this.enableBuffer){\r
 261             if(!this.callTask){\r
 262                 this.callTask = new Ext.util.DelayedTask(this.combineAndSend, this);\r
 263             }\r
 264             this.callTask.delay(typeof this.enableBuffer == 'number' ? this.enableBuffer : 10);\r
 265         }else{\r
 266             this.combineAndSend();\r
 267         }\r
 268     },\r
 269 \r
 270     doCall : function(c, m, args){\r
 271         var data = null, hs = args[m.len], scope = args[m.len+1];\r
 272 \r
 273         if(m.len !== 0){\r
 274             data = args.slice(0, m.len);\r
 275         }\r
 276 \r
 277         var t = new Ext.Direct.Transaction({\r
 278             provider: this,\r
 279             args: args,\r
 280             action: c,\r
 281             method: m.name,\r
 282             data: data,\r
 283             cb: scope && Ext.isFunction(hs) ? hs.createDelegate(scope) : hs\r
 284         });\r
 285 \r
 286         if(this.fireEvent('beforecall', this, t) !== false){\r
 287             Ext.Direct.addTransaction(t);\r
 288             this.queueTransaction(t);\r
 289             this.fireEvent('call', this, t);\r
 290         }\r
 291     },\r
 292 \r
 293     doForm : function(c, m, form, callback, scope){\r
 294         var t = new Ext.Direct.Transaction({\r
 295             provider: this,\r
 296             action: c,\r
 297             method: m.name,\r
 298             args:[form, callback, scope],\r
 299             cb: scope && Ext.isFunction(callback) ? callback.createDelegate(scope) : callback,\r
 300             isForm: true\r
 301         });\r
 302 \r
 303         if(this.fireEvent('beforecall', this, t) !== false){\r
 304             Ext.Direct.addTransaction(t);\r
 305             var isUpload = String(form.getAttribute("enctype")).toLowerCase() == 'multipart/form-data',\r
 306                 params = {\r
 307                     extTID: t.tid,\r
 308                     extAction: c,\r
 309                     extMethod: m.name,\r
 310                     extType: 'rpc',\r
 311                     extUpload: String(isUpload)\r
 312                 };\r
 313             \r
 314             // change made from typeof callback check to callback.params\r
 315             // to support addl param passing in DirectSubmit EAC 6/2\r
 316             Ext.apply(t, {\r
 317                 form: Ext.getDom(form),\r
 318                 isUpload: isUpload,\r
 319                 params: callback && Ext.isObject(callback.params) ? Ext.apply(params, callback.params) : params\r
 320             });\r
 321             this.fireEvent('call', this, t);\r
 322             this.processForm(t);\r
 323         }\r
 324     },\r
 325     \r
 326     processForm: function(t){\r
 327         Ext.Ajax.request({\r
 328             url: this.url,\r
 329             params: t.params,\r
 330             callback: this.onData,\r
 331             scope: this,\r
 332             form: t.form,\r
 333             isUpload: t.isUpload,\r
 334             ts: t\r
 335         });\r
 336     },\r
 337 \r
 338     createMethod : function(c, m){\r
 339         var f;\r
 340         if(!m.formHandler){\r
 341             f = function(){\r
 342                 this.doCall(c, m, Array.prototype.slice.call(arguments, 0));\r
 343             }.createDelegate(this);\r
 344         }else{\r
 345             f = function(form, callback, scope){\r
 346                 this.doForm(c, m, form, callback, scope);\r
 347             }.createDelegate(this);\r
 348         }\r
 349         f.directCfg = {\r
 350             action: c,\r
 351             method: m\r
 352         };\r
 353         return f;\r
 354     },\r
 355 \r
 356     getTransaction: function(opt){\r
 357         return opt && opt.tid ? Ext.Direct.getTransaction(opt.tid) : null;\r
 358     },\r
 359 \r
 360     doCallback: function(t, e){\r
 361         var fn = e.status ? 'success' : 'failure';\r
 362         if(t && t.cb){\r
 363             var hs = t.cb;\r
 364             var result = e.result || e.data;\r
 365             if(Ext.isFunction(hs)){\r
 366                 hs(result, e);\r
 367             } else{\r
 368                 Ext.callback(hs[fn], hs.scope, [result, e]);\r
 369                 Ext.callback(hs.callback, hs.scope, [result, e]);\r
 370             }\r
 371         }\r
 372     }\r
 373 });\r
 374 Ext.Direct.PROVIDERS['remoting'] = Ext.direct.RemotingProvider;</pre>    \r
 375 </body>\r
 376 </html>