Upgrade to ExtJS 3.2.1 - Released 04/27/2010
[extjs.git] / docs / source / Direct.html
index 807a4bb..4ff8d7c 100644 (file)
-<html>\r
-<head>\r
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
-  <title>The source code</title>\r
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body  onload="prettyPrint();">\r
-    <pre class="prettyprint lang-js"><div id="cls-Ext.Direct"></div>/**\r
- * @class Ext.Direct\r
- * @extends Ext.util.Observable\r
- * <p><b><u>Overview</u></b></p>\r
- * \r
- * <p>Ext.Direct aims to streamline communication between the client and server\r
- * by providing a single interface that reduces the amount of common code\r
- * typically required to validate data and handle returned data packets\r
- * (reading data, error conditions, etc).</p>\r
- *  \r
- * <p>The Ext.direct namespace includes several classes for a closer integration\r
- * with the server-side. The Ext.data namespace also includes classes for working\r
- * with Ext.data.Stores which are backed by data from an Ext.Direct method.</p>\r
- * \r
- * <p><b><u>Specification</u></b></p>\r
- * \r
- * <p>For additional information consult the \r
- * <a href="http://extjs.com/products/extjs/direct.php">Ext.Direct Specification</a>.</p>\r
- *   \r
- * <p><b><u>Providers</u></b></p>\r
- * \r
- * <p>Ext.Direct uses a provider architecture, where one or more providers are\r
- * used to transport data to and from the server. There are several providers\r
- * that exist in the core at the moment:</p><div class="mdetail-params"><ul>\r
- * \r
- * <li>{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations</li>\r
- * <li>{@link Ext.direct.PollingProvider PollingProvider} for repeated requests</li>\r
- * <li>{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side\r
- * on the client.</li>\r
- * </ul></div>\r
- * \r
- * <p>A provider does not need to be invoked directly, providers are added via\r
- * {@link Ext.Direct}.{@link Ext.Direct#add add}.</p>\r
- * \r
- * <p><b><u>Router</u></b></p>\r
- * \r
- * <p>Ext.Direct utilizes a "router" on the server to direct requests from the client\r
- * to the appropriate server-side method. Because the Ext.Direct API is completely\r
- * platform-agnostic, you could completely swap out a Java based server solution\r
- * and replace it with one that uses C# without changing the client side JavaScript\r
- * at all.</p>\r
- * \r
- * <p><b><u>Server side events</u></b></p>\r
- * \r
- * <p>Custom events from the server may be handled by the client by adding\r
- * listeners, for example:</p>\r
- * <pre><code>\r
-{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}\r
-\r
-// add a handler for a 'message' event sent by the server \r
-Ext.Direct.on('message', function(e){\r
-    out.append(String.format('&lt;p>&lt;i>{0}&lt;/i>&lt;/p>', e.data));\r
-            out.el.scrollTo('t', 100000, true);\r
-});\r
- * </code></pre>\r
- * @singleton\r
- */\r
-Ext.Direct = Ext.extend(Ext.util.Observable, {\r
-    <div id="prop-Ext.Direct-eventTypes"></div>/**\r
-     * Each event type implements a getData() method. The default event types are:\r
-     * <div class="mdetail-params"><ul>\r
-     * <li><b><tt>event</tt></b> : Ext.Direct.Event</li>\r
-     * <li><b><tt>exception</tt></b> : Ext.Direct.ExceptionEvent</li>\r
-     * <li><b><tt>rpc</tt></b> : Ext.Direct.RemotingEvent</li>\r
-     * </ul></div>\r
-     * @property eventTypes\r
-     * @type Object\r
-     */\r
-\r
-    <div id="prop-Ext.Direct-exceptions"></div>/**\r
-     * Four types of possible exceptions which can occur:\r
-     * <div class="mdetail-params"><ul>\r
-     * <li><b><tt>Ext.Direct.exceptions.TRANSPORT</tt></b> : 'xhr'</li>\r
-     * <li><b><tt>Ext.Direct.exceptions.PARSE</tt></b> : 'parse'</li>\r
-     * <li><b><tt>Ext.Direct.exceptions.LOGIN</tt></b> : 'login'</li>\r
-     * <li><b><tt>Ext.Direct.exceptions.SERVER</tt></b> : 'exception'</li>\r
-     * </ul></div>\r
-     * @property exceptions\r
-     * @type Object\r
-     */\r
-    exceptions: {\r
-        TRANSPORT: 'xhr',\r
-        PARSE: 'parse',\r
-        LOGIN: 'login',\r
-        SERVER: 'exception'\r
-    },\r
-    \r
-    // private\r
-    constructor: function(){\r
-        this.addEvents(\r
-            <div id="event-Ext.Direct-event"></div>/**\r
-             * @event event\r
-             * Fires after an event.\r
-             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.\r
-             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.\r
-             */\r
-            'event',\r
-            <div id="event-Ext.Direct-exception"></div>/**\r
-             * @event exception\r
-             * Fires after an event exception.\r
-             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.\r
-             */\r
-            'exception'\r
-        );\r
-        this.transactions = {};\r
-        this.providers = {};\r
-    },\r
-\r
-    <div id="method-Ext.Direct-addProvider"></div>/**\r
-     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.\r
-     * If the provider is not already connected, it will auto-connect.\r
-     * <pre><code>\r
-var pollProv = new Ext.direct.PollingProvider({\r
-    url: 'php/poll2.php'\r
-}); \r
-\r
-Ext.Direct.addProvider(\r
-    {\r
-        "type":"remoting",       // create a {@link Ext.direct.RemotingProvider} \r
-        "url":"php\/router.php", // url to connect to the Ext.Direct server-side router.\r
-        "actions":{              // each property within the actions object represents a Class \r
-            "TestAction":[       // array of methods within each server side Class   \r
-            {\r
-                "name":"doEcho", // name of method\r
-                "len":1\r
-            },{\r
-                "name":"multiply",\r
-                "len":1\r
-            },{\r
-                "name":"doForm",\r
-                "formHandler":true, // handle form on server with Ext.Direct.Transaction \r
-                "len":1\r
-            }]\r
-        },\r
-        "namespace":"myApplication",// namespace to create the Remoting Provider in\r
-    },{\r
-        type: 'polling', // create a {@link Ext.direct.PollingProvider} \r
-        url:  'php/poll.php'\r
-    },\r
-    pollProv // reference to previously created instance\r
-);\r
-     * </code></pre>\r
-     * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance\r
-     * or config object for a Provider) or any number of Provider descriptions as arguments.  Each\r
-     * Provider description instructs Ext.Direct how to create client-side stub methods.\r
-     */\r
-    addProvider : function(provider){        \r
-        var a = arguments;\r
-        if(a.length > 1){\r
-            for(var i = 0, len = a.length; i < len; i++){\r
-                this.addProvider(a[i]);\r
-            }\r
-            return;\r
-        }\r
-        \r
-        // if provider has not already been instantiated\r
-        if(!provider.events){\r
-            provider = new Ext.Direct.PROVIDERS[provider.type](provider);\r
-        }\r
-        provider.id = provider.id || Ext.id();\r
-        this.providers[provider.id] = provider;\r
-\r
-        provider.on('data', this.onProviderData, this);\r
-        provider.on('exception', this.onProviderException, this);\r
-\r
-\r
-        if(!provider.isConnected()){\r
-            provider.connect();\r
-        }\r
-\r
-        return provider;\r
-    },\r
-\r
-    <div id="method-Ext.Direct-getProvider"></div>/**\r
-     * Retrieve a {@link Ext.direct.Provider provider} by the\r
-     * <b><tt>{@link Ext.direct.Provider#id id}</tt></b> specified when the provider is\r
-     * {@link #addProvider added}.\r
-     * @param {String} id Unique identifier assigned to the provider when calling {@link #addProvider} \r
-     */\r
-    getProvider : function(id){\r
-        return this.providers[id];\r
-    },\r
-\r
-    removeProvider : function(id){\r
-        var provider = id.id ? id : this.providers[id.id];\r
-        provider.un('data', this.onProviderData, this);\r
-        provider.un('exception', this.onProviderException, this);\r
-        delete this.providers[provider.id];\r
-        return provider;\r
-    },\r
-\r
-    addTransaction: function(t){\r
-        this.transactions[t.tid] = t;\r
-        return t;\r
-    },\r
-\r
-    removeTransaction: function(t){\r
-        delete this.transactions[t.tid || t];\r
-        return t;\r
-    },\r
-\r
-    getTransaction: function(tid){\r
-        return this.transactions[tid.tid || tid];\r
-    },\r
-\r
-    onProviderData : function(provider, e){\r
-        if(Ext.isArray(e)){\r
-            for(var i = 0, len = e.length; i < len; i++){\r
-                this.onProviderData(provider, e[i]);\r
-            }\r
-            return;\r
-        }\r
-        if(e.name && e.name != 'event' && e.name != 'exception'){\r
-            this.fireEvent(e.name, e);\r
-        }else if(e.type == 'exception'){\r
-            this.fireEvent('exception', e);\r
-        }\r
-        this.fireEvent('event', e, provider);\r
-    },\r
-\r
-    createEvent : function(response, extraProps){\r
-        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));\r
-    }\r
-});\r
-// overwrite impl. with static instance\r
-Ext.Direct = new Ext.Direct();\r
-\r
-Ext.Direct.TID = 1;\r
-Ext.Direct.PROVIDERS = {};</pre>    \r
-</body>\r
+<html>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
+  <title>The source code</title>
+    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body  onload="prettyPrint();">
+    <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.2.1
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+<div id="cls-Ext.Direct"></div>/**
+ * @class Ext.Direct
+ * @extends Ext.util.Observable
+ * <p><b><u>Overview</u></b></p>
+ *
+ * <p>Ext.Direct aims to streamline communication between the client and server
+ * by providing a single interface that reduces the amount of common code
+ * typically required to validate data and handle returned data packets
+ * (reading data, error conditions, etc).</p>
+ *
+ * <p>The Ext.direct namespace includes several classes for a closer integration
+ * with the server-side. The Ext.data namespace also includes classes for working
+ * with Ext.data.Stores which are backed by data from an Ext.Direct method.</p>
+ *
+ * <p><b><u>Specification</u></b></p>
+ *
+ * <p>For additional information consult the
+ * <a href="http://extjs.com/products/extjs/direct.php">Ext.Direct Specification</a>.</p>
+ *
+ * <p><b><u>Providers</u></b></p>
+ *
+ * <p>Ext.Direct uses a provider architecture, where one or more providers are
+ * used to transport data to and from the server. There are several providers
+ * that exist in the core at the moment:</p><div class="mdetail-params"><ul>
+ *
+ * <li>{@link Ext.direct.JsonProvider JsonProvider} for simple JSON operations</li>
+ * <li>{@link Ext.direct.PollingProvider PollingProvider} for repeated requests</li>
+ * <li>{@link Ext.direct.RemotingProvider RemotingProvider} exposes server side
+ * on the client.</li>
+ * </ul></div>
+ *
+ * <p>A provider does not need to be invoked directly, providers are added via
+ * {@link Ext.Direct}.{@link Ext.Direct#add add}.</p>
+ *
+ * <p><b><u>Router</u></b></p>
+ *
+ * <p>Ext.Direct utilizes a "router" on the server to direct requests from the client
+ * to the appropriate server-side method. Because the Ext.Direct API is completely
+ * platform-agnostic, you could completely swap out a Java based server solution
+ * and replace it with one that uses C# without changing the client side JavaScript
+ * at all.</p>
+ *
+ * <p><b><u>Server side events</u></b></p>
+ *
+ * <p>Custom events from the server may be handled by the client by adding
+ * listeners, for example:</p>
+ * <pre><code>
+{"type":"event","name":"message","data":"Successfully polled at: 11:19:30 am"}
+
+// add a handler for a 'message' event sent by the server
+Ext.Direct.on('message', function(e){
+    out.append(String.format('&lt;p>&lt;i>{0}&lt;/i>&lt;/p>', e.data));
+            out.el.scrollTo('t', 100000, true);
+});
+ * </code></pre>
+ * @singleton
+ */
+Ext.Direct = Ext.extend(Ext.util.Observable, {
+    <div id="prop-Ext.Direct-eventTypes"></div>/**
+     * Each event type implements a getData() method. The default event types are:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>event</tt></b> : Ext.Direct.Event</li>
+     * <li><b><tt>exception</tt></b> : Ext.Direct.ExceptionEvent</li>
+     * <li><b><tt>rpc</tt></b> : Ext.Direct.RemotingEvent</li>
+     * </ul></div>
+     * @property eventTypes
+     * @type Object
+     */
+
+    <div id="prop-Ext.Direct-exceptions"></div>/**
+     * Four types of possible exceptions which can occur:
+     * <div class="mdetail-params"><ul>
+     * <li><b><tt>Ext.Direct.exceptions.TRANSPORT</tt></b> : 'xhr'</li>
+     * <li><b><tt>Ext.Direct.exceptions.PARSE</tt></b> : 'parse'</li>
+     * <li><b><tt>Ext.Direct.exceptions.LOGIN</tt></b> : 'login'</li>
+     * <li><b><tt>Ext.Direct.exceptions.SERVER</tt></b> : 'exception'</li>
+     * </ul></div>
+     * @property exceptions
+     * @type Object
+     */
+    exceptions: {
+        TRANSPORT: 'xhr',
+        PARSE: 'parse',
+        LOGIN: 'login',
+        SERVER: 'exception'
+    },
+
+    // private
+    constructor: function(){
+        this.addEvents(
+            <div id="event-Ext.Direct-event"></div>/**
+             * @event event
+             * Fires after an event.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             * @param {Ext.direct.Provider} provider The {@link Ext.direct.Provider Provider}.
+             */
+            'event',
+            <div id="event-Ext.Direct-exception"></div>/**
+             * @event exception
+             * Fires after an event exception.
+             * @param {event} e The {@link Ext.Direct#eventTypes Ext.Direct.Event type} that occurred.
+             */
+            'exception'
+        );
+        this.transactions = {};
+        this.providers = {};
+    },
+
+    <div id="method-Ext.Direct-addProvider"></div>/**
+     * Adds an Ext.Direct Provider and creates the proxy or stub methods to execute server-side methods.
+     * If the provider is not already connected, it will auto-connect.
+     * <pre><code>
+var pollProv = new Ext.direct.PollingProvider({
+    url: 'php/poll2.php'
+});
+
+Ext.Direct.addProvider(
+    {
+        "type":"remoting",       // create a {@link Ext.direct.RemotingProvider}
+        "url":"php\/router.php", // url to connect to the Ext.Direct server-side router.
+        "actions":{              // each property within the actions object represents a Class
+            "TestAction":[       // array of methods within each server side Class
+            {
+                "name":"doEcho", // name of method
+                "len":1
+            },{
+                "name":"multiply",
+                "len":1
+            },{
+                "name":"doForm",
+                "formHandler":true, // handle form on server with Ext.Direct.Transaction
+                "len":1
+            }]
+        },
+        "namespace":"myApplication",// namespace to create the Remoting Provider in
+    },{
+        type: 'polling', // create a {@link Ext.direct.PollingProvider}
+        url:  'php/poll.php'
+    },
+    pollProv // reference to previously created instance
+);
+     * </code></pre>
+     * @param {Object/Array} provider Accepts either an Array of Provider descriptions (an instance
+     * or config object for a Provider) or any number of Provider descriptions as arguments.  Each
+     * Provider description instructs Ext.Direct how to create client-side stub methods.
+     */
+    addProvider : function(provider){
+        var a = arguments;
+        if(a.length > 1){
+            for(var i = 0, len = a.length; i < len; i++){
+                this.addProvider(a[i]);
+            }
+            return;
+        }
+
+        // if provider has not already been instantiated
+        if(!provider.events){
+            provider = new Ext.Direct.PROVIDERS[provider.type](provider);
+        }
+        provider.id = provider.id || Ext.id();
+        this.providers[provider.id] = provider;
+
+        provider.on('data', this.onProviderData, this);
+        provider.on('exception', this.onProviderException, this);
+
+
+        if(!provider.isConnected()){
+            provider.connect();
+        }
+
+        return provider;
+    },
+
+    <div id="method-Ext.Direct-getProvider"></div>/**
+     * Retrieve a {@link Ext.direct.Provider provider} by the
+     * <b><tt>{@link Ext.direct.Provider#id id}</tt></b> specified when the provider is
+     * {@link #addProvider added}.
+     * @param {String} id Unique identifier assigned to the provider when calling {@link #addProvider}
+     */
+    getProvider : function(id){
+        return this.providers[id];
+    },
+
+    removeProvider : function(id){
+        var provider = id.id ? id : this.providers[id];
+        provider.un('data', this.onProviderData, this);
+        provider.un('exception', this.onProviderException, this);
+        delete this.providers[provider.id];
+        return provider;
+    },
+
+    addTransaction: function(t){
+        this.transactions[t.tid] = t;
+        return t;
+    },
+
+    removeTransaction: function(t){
+        delete this.transactions[t.tid || t];
+        return t;
+    },
+
+    getTransaction: function(tid){
+        return this.transactions[tid.tid || tid];
+    },
+
+    onProviderData : function(provider, e){
+        if(Ext.isArray(e)){
+            for(var i = 0, len = e.length; i < len; i++){
+                this.onProviderData(provider, e[i]);
+            }
+            return;
+        }
+        if(e.name && e.name != 'event' && e.name != 'exception'){
+            this.fireEvent(e.name, e);
+        }else if(e.type == 'exception'){
+            this.fireEvent('exception', e);
+        }
+        this.fireEvent('event', e, provider);
+    },
+
+    createEvent : function(response, extraProps){
+        return new Ext.Direct.eventTypes[response.type](Ext.apply(response, extraProps));
+    }
+});
+// overwrite impl. with static instance
+Ext.Direct = new Ext.Direct();
+
+Ext.Direct.TID = 1;
+Ext.Direct.PROVIDERS = {};</pre>    
+</body>
 </html>
\ No newline at end of file