extjs-rails 4.1.0.alpha1

data/app/assets/javascripts/extjs-rails/src/form/RadioManager.js

@@ -0,0 +1,26 @@
+/**
+ * @private
+ * Private utility class for managing all {@link Ext.form.field.Radio} fields grouped by name.
+ */
+Ext.define('Ext.form.RadioManager', {
+    extend: 'Ext.util.MixedCollection',
+    singleton: true,
+
+    getByName: function(name, formId) {
+        return this.filterBy(function(item) {
+            return item.name == name && item.getFormId() == formId;
+        });
+    },
+
+    getWithValue: function(name, value, formId) {
+        return this.filterBy(function(item) {
+            return item.name == name && item.inputValue == value && item.getFormId() == formId;
+        });
+    },
+
+    getChecked: function(name, formId) {
+        return this.findBy(function(item) {
+            return item.name == name && item.checked && item.getFormId() == formId;
+        });
+    }
+});

data/app/assets/javascripts/extjs-rails/src/form/action/Action.js

@@ -0,0 +1,307 @@
+/**
+ * The subclasses of this class provide actions to perform upon {@link Ext.form.Basic Form}s.
+ *
+ * Instances of this class are only created by a {@link Ext.form.Basic Form} when the Form needs to perform an action
+ * such as submit or load. The Configuration options listed for this class are set through the Form's action methods:
+ * {@link Ext.form.Basic#submit submit}, {@link Ext.form.Basic#load load} and {@link Ext.form.Basic#doAction doAction}
+ *
+ * The instance of Action which performed the action is passed to the success and failure callbacks of the Form's action
+ * methods ({@link Ext.form.Basic#submit submit}, {@link Ext.form.Basic#load load} and
+ * {@link Ext.form.Basic#doAction doAction}), and to the {@link Ext.form.Basic#actioncomplete actioncomplete} and
+ * {@link Ext.form.Basic#actionfailed actionfailed} event handlers.
+ */
+Ext.define('Ext.form.action.Action', {
+    alternateClassName: 'Ext.form.Action',
+
+    /**
+     * @cfg {Ext.form.Basic} form
+     * The {@link Ext.form.Basic BasicForm} instance that is invoking this Action. Required.
+     */
+
+    /**
+     * @cfg {String} url
+     * The URL that the Action is to invoke. Will default to the {@link Ext.form.Basic#url url} configured on the
+     * {@link #form}.
+     */
+
+    /**
+     * @cfg {Boolean} reset
+     * When set to **true**, causes the Form to be {@link Ext.form.Basic#reset reset} on Action success. If specified,
+     * this happens before the {@link #success} callback is called and before the Form's
+     * {@link Ext.form.Basic#actioncomplete actioncomplete} event fires.
+     */
+
+    /**
+     * @cfg {String} method
+     * The HTTP method to use to access the requested URL.
+     * Defaults to the {@link Ext.form.Basic#method BasicForm's method}, or 'POST' if not specified.
+     */
+
+    /**
+     * @cfg {Object/String} params
+     * Extra parameter values to pass. These are added to the Form's {@link Ext.form.Basic#baseParams} and passed to the
+     * specified URL along with the Form's input fields.
+     *
+     * Parameters are encoded as standard HTTP parameters using {@link Ext#urlEncode Ext.Object.toQueryString}.
+     */
+
+    /**
+     * @cfg {Object} headers
+     * Extra headers to be sent in the AJAX request for submit and load actions.
+     * See {@link Ext.data.proxy.Ajax#headers}.
+     */
+
+    /**
+     * @cfg {Number} timeout
+     * The number of seconds to wait for a server response before failing with the {@link #failureType} as
+     * {@link Ext.form.action.Action#CONNECT_FAILURE}. If not specified, defaults to the configured
+     * {@link Ext.form.Basic#timeout timeout} of the {@link #form}.
+     */
+
+    /**
+     * @cfg {Function} success
+     * The function to call when a valid success return packet is received.
+     * @cfg {Ext.form.Basic} success.form The form that requested the action
+     * @cfg {Ext.form.action.Action} success.action The Action class. The {@link #result} property of this object may
+     * be examined to perform custom postprocessing.
+     */
+
+    /**
+     * @cfg {Function} failure
+     * The function to call when a failure packet was received, or when an error ocurred in the Ajax communication.
+     * @cfg {Ext.form.Basic} failure.form The form that requested the action
+     * @cfg {Ext.form.action.Action} failure.action The Action class. If an Ajax error ocurred, the failure type will
+     * be in {@link #failureType}. The {@link #result} property of this object may be examined to perform custom
+     * postprocessing.
+     */
+
+    /**
+     * @cfg {Object} scope
+     * The scope in which to call the configured #success and #failure callback functions
+     * (the `this` reference for the callback functions).
+     */
+
+    /**
+     * @cfg {String} waitMsg
+     * The message to be displayed by a call to {@link Ext.window.MessageBox#wait} during the time the action is being
+     * processed.
+     */
+
+    /**
+     * @cfg {String} waitTitle
+     * The title to be displayed by a call to {@link Ext.window.MessageBox#wait} during the time the action is being
+     * processed.
+     */
+
+    /**
+     * @cfg {Boolean} submitEmptyText
+     * If set to true, the emptyText value will be sent with the form when it is submitted.
+     */
+    submitEmptyText : true,
+
+    /**
+     * @property {String} type
+     * The type of action this Action instance performs. Currently only "submit" and "load" are supported.
+     */
+
+    /**
+     * @property {String} failureType
+     * The type of failure detected will be one of these:
+     * {@link #CLIENT_INVALID}, {@link #SERVER_INVALID}, {@link #CONNECT_FAILURE}, or {@link #LOAD_FAILURE}.
+     *
+     * Usage:
+     *
+     *     var fp = new Ext.form.Panel({
+     *     ...
+     *     buttons: [{
+     *         text: 'Save',
+     *         formBind: true,
+     *         handler: function(){
+     *             if(fp.getForm().isValid()){
+     *                 fp.getForm().submit({
+     *                     url: 'form-submit.php',
+     *                     waitMsg: 'Submitting your data...',
+     *                     success: function(form, action){
+     *                         // server responded with success = true
+     *                         var result = action.{@link #result};
+     *                     },
+     *                     failure: function(form, action){
+     *                         if (action.{@link #failureType} === Ext.form.action.Action.CONNECT_FAILURE) {
+     *                             Ext.Msg.alert('Error',
+     *                                 'Status:'+action.{@link #response}.status+': '+
+     *                                 action.{@link #response}.statusText);
+     *                         }
+     *                         if (action.failureType === Ext.form.action.Action.SERVER_INVALID){
+     *                             // server responded with success = false
+     *                             Ext.Msg.alert('Invalid', action.{@link #result}.errormsg);
+     *                         }
+     *                     }
+     *                 });
+     *             }
+     *         }
+     *     },{
+     *         text: 'Reset',
+     *         handler: function(){
+     *             fp.getForm().reset();
+     *         }
+     *     }]
+     */
+
+    /**
+     * @property {Object} response
+     * The raw XMLHttpRequest object used to perform the action.
+     */
+
+    /**
+     * @property {Object} result
+     * The decoded response object containing a boolean `success` property and other, action-specific properties.
+     */
+
+    /**
+     * Creates new Action.
+     * @param {Object} [config] Config object.
+     */
+    constructor: function(config) {
+        if (config) {
+            Ext.apply(this, config);
+        }
+
+        // Normalize the params option to an Object
+        var params = config.params;
+        if (Ext.isString(params)) {
+            this.params = Ext.Object.fromQueryString(params);
+        }
+    },
+
+    /**
+     * @method
+     * Invokes this action using the current configuration.
+     */
+    run: Ext.emptyFn,
+
+    /**
+     * @private
+     * @method onSuccess
+     * Callback method that gets invoked when the action completes successfully. Must be implemented by subclasses.
+     * @param {Object} response
+     */
+
+    /**
+     * @private
+     * @method handleResponse
+     * Handles the raw response and builds a result object from it. Must be implemented by subclasses.
+     * @param {Object} response
+     */
+
+    /**
+     * @private
+     * Handles a failure response.
+     * @param {Object} response
+     */
+    onFailure : function(response){
+        this.response = response;
+        this.failureType = Ext.form.action.Action.CONNECT_FAILURE;
+        this.form.afterAction(this, false);
+    },
+
+    /**
+     * @private
+     * Validates that a response contains either responseText or responseXML and invokes
+     * {@link #handleResponse} to build the result object.
+     * @param {Object} response The raw response object.
+     * @return {Object/Boolean} The result object as built by handleResponse, or `true` if
+     * the response had empty responseText and responseXML.
+     */
+    processResponse : function(response){
+        this.response = response;
+        if (!response.responseText && !response.responseXML) {
+            return true;
+        }
+        return (this.result = this.handleResponse(response));
+    },
+
+    /**
+     * @private
+     * Build the URL for the AJAX request. Used by the standard AJAX submit and load actions.
+     * @return {String} The URL.
+     */
+    getUrl: function() {
+        return this.url || this.form.url;
+    },
+
+    /**
+     * @private
+     * Determine the HTTP method to be used for the request.
+     * @return {String} The HTTP method
+     */
+    getMethod: function() {
+        return (this.method || this.form.method || 'POST').toUpperCase();
+    },
+
+    /**
+     * @private
+     * Get the set of parameters specified in the BasicForm's baseParams and/or the params option.
+     * Items in params override items of the same name in baseParams.
+     * @return {Object} the full set of parameters
+     */
+    getParams: function() {
+        return Ext.apply({}, this.params, this.form.baseParams);
+    },
+
+    /**
+     * @private
+     * Creates a callback object.
+     */
+    createCallback: function() {
+        var me = this,
+            undef,
+            form = me.form;
+        return {
+            success: me.onSuccess,
+            failure: me.onFailure,
+            scope: me,
+            timeout: (this.timeout * 1000) || (form.timeout * 1000),
+            upload: form.fileUpload ? me.onSuccess : undef
+        };
+    },
+
+    statics: {
+        /**
+         * @property
+         * Failure type returned when client side validation of the Form fails thus aborting a submit action. Client
+         * side validation is performed unless {@link Ext.form.action.Submit#clientValidation} is explicitly set to
+         * false.
+         * @static
+         */
+        CLIENT_INVALID: 'client',
+
+        /**
+         * @property
+         * Failure type returned when server side processing fails and the {@link #result}'s `success` property is set to
+         * false.
+         *
+         * In the case of a form submission, field-specific error messages may be returned in the {@link #result}'s
+         * errors property.
+         * @static
+         */
+        SERVER_INVALID: 'server',
+
+        /**
+         * @property
+         * Failure type returned when a communication error happens when attempting to send a request to the remote
+         * server. The {@link #response} may be examined to provide further information.
+         * @static
+         */
+        CONNECT_FAILURE: 'connect',
+
+        /**
+         * @property
+         * Failure type returned when the response's `success` property is set to false, or no field values are returned
+         * in the response's data property.
+         * @static
+         */
+        LOAD_FAILURE: 'load'
+
+
+    }
+});

data/app/assets/javascripts/extjs-rails/src/form/action/DirectLoad.js

@@ -0,0 +1,107 @@
+/**
+ * Provides {@link Ext.direct.Manager} support for loading form data.
+ *
+ * This example illustrates usage of Ext.direct.Direct to **load** a form through Ext.Direct.
+ *
+ *     var myFormPanel = new Ext.form.Panel({
+ *         // configs for FormPanel
+ *         title: 'Basic Information',
+ *         renderTo: document.body,
+ *         width: 300, height: 160,
+ *         padding: 10,
+ *
+ *         // configs apply to child items
+ *         defaults: {anchor: '100%'},
+ *         defaultType: 'textfield',
+ *         items: [{
+ *             fieldLabel: 'Name',
+ *             name: 'name'
+ *         },{
+ *             fieldLabel: 'Email',
+ *             name: 'email'
+ *         },{
+ *             fieldLabel: 'Company',
+ *             name: 'company'
+ *         }],
+ *
+ *         // configs for BasicForm
+ *         api: {
+ *             // The server-side method to call for load() requests
+ *             load: Profile.getBasicInfo,
+ *             // The server-side must mark the submit handler as a 'formHandler'
+ *             submit: Profile.updateBasicInfo
+ *         },
+ *         // specify the order for the passed params
+ *         paramOrder: ['uid', 'foo']
+ *     });
+ *
+ *     // load the form
+ *     myFormPanel.getForm().load({
+ *         // pass 2 arguments to server side getBasicInfo method (len=2)
+ *         params: {
+ *             foo: 'bar',
+ *             uid: 34
+ *         }
+ *     });
+ *
+ * The data packet sent to the server will resemble something like:
+ *
+ *     [
+ *         {
+ *             "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+ *             "data":[34,"bar"] // note the order of the params
+ *         }
+ *     ]
+ *
+ * The form will process a data packet returned by the server that is similar to the following format:
+ *
+ *     [
+ *         {
+ *             "action":"Profile","method":"getBasicInfo","type":"rpc","tid":2,
+ *             "result":{
+ *                 "success":true,
+ *                 "data":{
+ *                     "name":"Fred Flintstone",
+ *                     "company":"Slate Rock and Gravel",
+ *                     "email":"fred.flintstone@slaterg.com"
+ *                 }
+ *             }
+ *         }
+ *     ]
+ */
+Ext.define('Ext.form.action.DirectLoad', {
+    extend:'Ext.form.action.Load',
+    requires: ['Ext.direct.Manager'],
+    alternateClassName: 'Ext.form.Action.DirectLoad',
+    alias: 'formaction.directload',
+
+    type: 'directload',
+
+    run: function() {
+        var me = this,
+            form = me.form,
+            fn = form.api.load,
+            method = fn.directCfg.method,
+            args = method.getArgs(me.getParams(), form.paramOrder, form.paramsAsHash);
+            
+        args.push(me.onComplete, me);
+        fn.apply(window, args);
+    },
+
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse: function(result) {
+        return (this.result = result);
+    },
+
+    onComplete: function(data, response) {
+        if (data) {
+            this.onSuccess(data);
+        } else {
+            this.onFailure(null);
+        }
+    }
+});
+
+

data/app/assets/javascripts/extjs-rails/src/form/action/DirectSubmit.js

@@ -0,0 +1,119 @@
+/**
+ * Provides Ext.direct support for submitting form data.
+ *
+ * This example illustrates usage of Ext.direct.Direct to **submit** a form through Ext.Direct.
+ *
+ *     var myFormPanel = new Ext.form.Panel({
+ *         // configs for FormPanel
+ *         title: 'Basic Information',
+ *         renderTo: document.body,
+ *         width: 300, height: 160,
+ *         padding: 10,
+ *         buttons:[{
+ *             text: 'Submit',
+ *             handler: function(){
+ *                 myFormPanel.getForm().submit({
+ *                     params: {
+ *                         foo: 'bar',
+ *                         uid: 34
+ *                     }
+ *                 });
+ *             }
+ *         }],
+ *
+ *         // configs apply to child items
+ *         defaults: {anchor: '100%'},
+ *         defaultType: 'textfield',
+ *         items: [{
+ *             fieldLabel: 'Name',
+ *             name: 'name'
+ *         },{
+ *             fieldLabel: 'Email',
+ *             name: 'email'
+ *         },{
+ *             fieldLabel: 'Company',
+ *             name: 'company'
+ *         }],
+ *
+ *         // configs for BasicForm
+ *         api: {
+ *             // The server-side method to call for load() requests
+ *             load: Profile.getBasicInfo,
+ *             // The server-side must mark the submit handler as a 'formHandler'
+ *             submit: Profile.updateBasicInfo
+ *         },
+ *         // specify the order for the passed params
+ *         paramOrder: ['uid', 'foo']
+ *     });
+ *
+ * The data packet sent to the server will resemble something like:
+ *
+ *     {
+ *         "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+ *         "result":{
+ *             "success":true,
+ *             "id":{
+ *                 "extAction":"Profile","extMethod":"updateBasicInfo",
+ *                 "extType":"rpc","extTID":"6","extUpload":"false",
+ *                 "name":"Aaron Conran","email":"aaron@sencha.com","company":"Sencha Inc."
+ *             }
+ *         }
+ *     }
+ *
+ * The form will process a data packet returned by the server that is similar to the following:
+ *
+ *     // sample success packet (batched requests)
+ *     [
+ *         {
+ *             "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":3,
+ *             "result":{
+ *                 "success":true
+ *             }
+ *         }
+ *     ]
+ *
+ *     // sample failure packet (one request)
+ *     {
+ *             "action":"Profile","method":"updateBasicInfo","type":"rpc","tid":"6",
+ *             "result":{
+ *                 "errors":{
+ *                     "email":"already taken"
+ *                 },
+ *                 "success":false,
+ *                 "foo":"bar"
+ *             }
+ *     }
+ *
+ * Also see the discussion in {@link Ext.form.action.DirectLoad}.
+ */
+Ext.define('Ext.form.action.DirectSubmit', {
+    extend:'Ext.form.action.Submit',
+    requires: ['Ext.direct.Manager'],
+    alternateClassName: 'Ext.form.Action.DirectSubmit',
+    alias: 'formaction.directsubmit',
+
+    type: 'directsubmit',
+
+    doSubmit: function() {
+        var me = this,
+            callback = Ext.Function.bind(me.onComplete, me),
+            formEl = me.buildForm();
+        me.form.api.submit(formEl, callback, me);
+        Ext.removeNode(formEl);
+    },
+
+    // Direct actions have already been processed and therefore
+    // we can directly set the result; Direct Actions do not have
+    // a this.response property.
+    processResponse: function(result) {
+        return (this.result = result);
+    },
+    
+    onComplete: function(data, response){
+        if (data) {
+            this.onSuccess(data);
+        } else {
+            this.onFailure(null);
+        }
+    }
+});