[extjs.git] / extjs / packages / core / src / class / Class.js

/**\r
 * @class Ext.Class\r
 *\r
 * This is a low level factory that is used by {@link Ext#define Ext.define} and should not be used\r
 * directly in application code.\r
 * \r
 * The configs of this class are intended to be used in `Ext.define` calls to describe the class you\r
 * are declaring. For example:\r
 * \r
 *     Ext.define('App.util.Thing', {\r
 *         extend: 'App.util.Other',\r
 * \r
 *         alias: 'util.thing',\r
 * \r
 *         config: {\r
 *             foo: 42\r
 *         }\r
 *     });\r
 *\r
 * Ext.Class is the factory and **not** the superclass of everything. For the base class that **all**\r
 * classes inherit from, see {@link Ext.Base}.\r
 */\r
(function() {\r
// @tag class\r
// @define Ext.Class\r
// @require Ext.Base\r
// @require Ext.Util\r
// @require Ext.util.Cache\r
    var ExtClass,\r
        Base = Ext.Base,\r
        baseStaticMembers = Base.$staticMembers,\r
        ruleKeySortFn = function (a, b) {\r
            // longest to shortest, by text if names are equal\r
            return (a.length - b.length) || ((a < b) ? -1 : ((a > b) ? 1 : 0));\r
        };\r
\r
    // Creates a constructor that has nothing extra in its scope chain.\r
    function makeCtor (className) {\r
        function constructor () {\r
            // Opera has some problems returning from a constructor when Dragonfly isn't running. The || null seems to\r
            // be sufficient to stop it misbehaving. Known to be required against 10.53, 11.51 and 11.61.\r
            return this.constructor.apply(this, arguments) || null;\r
        }\r
        //<debug>\r
        if (className) {\r
            constructor.name = className;\r
        }\r
        //</debug>\r
        return constructor;\r
    }\r
\r
    /**\r
     * @method constructor\r
     * Create a new anonymous class.\r
     *\r
     * @param {Object} data An object represent the properties of this class\r
     * @param {Function} onCreated Optional, the callback function to be executed when this class is fully created.\r
     * Note that the creation process can be asynchronous depending on the pre-processors used.\r
     *\r
     * @return {Ext.Base} The newly created class\r
     */\r
    Ext.Class = ExtClass = function(Class, data, onCreated) {\r
        if (typeof Class != 'function') {\r
            onCreated = data;\r
            data = Class;\r
            Class = null;\r
        }\r
\r
        if (!data) {\r
            data = {};\r
        }\r
\r
        Class = ExtClass.create(Class, data);\r
\r
        ExtClass.process(Class, data, onCreated);\r
\r
        return Class;\r
    };\r
\r
    Ext.apply(ExtClass, {\r
        \r
        makeCtor: makeCtor,\r
        \r
        /**\r
         * @private\r
         */\r
        onBeforeCreated: function(Class, data, hooks) {\r
            //<debug>\r
            Ext.classSystemMonitor && Ext.classSystemMonitor(Class, '>> Ext.Class#onBeforeCreated', arguments);\r
            //</debug>\r
        \r
            Class.addMembers(data);\r
\r
            hooks.onCreated.call(Class, Class);\r
\r
            //<debug>\r
            Ext.classSystemMonitor && Ext.classSystemMonitor(Class, '<< Ext.Class#onBeforeCreated', arguments);\r
            //</debug>\r
        },\r
\r
        /**\r
         * @private\r
         */\r
        create: function (Class, data) {\r
            var i = baseStaticMembers.length,\r
                name;\r
\r
            if (!Class) {\r
                Class = makeCtor(\r
                    //<debug>\r
                    data.$className\r
                    //</debug>\r
                );\r
            }\r
\r
            while (i--) {\r
                name = baseStaticMembers[i];\r
                Class[name] = Base[name];\r
            }\r
\r
            return Class;\r
        },\r
\r
        /**\r
         * @private\r
         */\r
        process: function(Class, data, onCreated) {\r
            var preprocessorStack = data.preprocessors || ExtClass.defaultPreprocessors,\r
                registeredPreprocessors = this.preprocessors,\r
                hooks = {\r
                    onBeforeCreated: this.onBeforeCreated\r
                },\r
                preprocessors = [],\r
                preprocessor, preprocessorsProperties,\r
                i, ln, j, subLn, preprocessorProperty;\r
\r
            delete data.preprocessors;\r
            Class._classHooks = hooks;\r
\r
            for (i = 0,ln = preprocessorStack.length; i < ln; i++) {\r
                preprocessor = preprocessorStack[i];\r
\r
                if (typeof preprocessor == 'string') {\r
                    preprocessor = registeredPreprocessors[preprocessor];\r
                    preprocessorsProperties = preprocessor.properties;\r
\r
                    if (preprocessorsProperties === true) {\r
                        preprocessors.push(preprocessor.fn);\r
                    }\r
                    else if (preprocessorsProperties) {\r
                        for (j = 0,subLn = preprocessorsProperties.length; j < subLn; j++) {\r
                            preprocessorProperty = preprocessorsProperties[j];\r
\r
                            if (data.hasOwnProperty(preprocessorProperty)) {\r
                                preprocessors.push(preprocessor.fn);\r
                                break;\r
                            }\r
                        }\r
                    }\r
                }\r
                else {\r
                    preprocessors.push(preprocessor);\r
                }\r
            }\r
\r
            hooks.onCreated = onCreated ? onCreated : Ext.emptyFn;\r
            hooks.preprocessors = preprocessors;\r
\r
            this.doProcess(Class, data, hooks);\r
        },\r
        \r
        doProcess: function(Class, data, hooks) {\r
            var me = this,\r
                preprocessors = hooks.preprocessors,\r
                preprocessor = preprocessors.shift(),\r
                doProcess = me.doProcess;\r
\r
            for ( ; preprocessor ; preprocessor = preprocessors.shift()) {\r
                // Returning false signifies an asynchronous preprocessor - it will call doProcess when we can continue\r
                if (preprocessor.call(me, Class, data, hooks, doProcess) === false) {\r
                    return;\r
                }\r
            }\r
            hooks.onBeforeCreated.apply(me, arguments);\r
        },\r
\r
        /**\r
         * @private\r
         * */\r
        preprocessors: {},\r
\r
        /**\r
         * Register a new pre-processor to be used during the class creation process\r
         *\r
         * @param {String} name The pre-processor's name\r
         * @param {Function} fn The callback function to be executed. Typical format:\r
         *\r
         *     function(cls, data, fn) {\r
         *         // Your code here\r
         *\r
         *         // Execute this when the processing is finished.\r
         *         // Asynchronous processing is perfectly ok\r
         *         if (fn) {\r
         *             fn.call(this, cls, data);\r
         *         }\r
         *     });\r
         *\r
         * @param {Function} fn.cls The created class\r
         * @param {Object} fn.data The set of properties passed in {@link Ext.Class} constructor\r
         * @param {Function} fn.fn The callback function that **must** to be executed when this\r
         * pre-processor finishes, regardless of whether the processing is synchronous or asynchronous.\r
         * @return {Ext.Class} this\r
         * @private\r
         * @static\r
         */\r
        registerPreprocessor: function(name, fn, properties, position, relativeTo) {\r
            if (!position) {\r
                position = 'last';\r
            }\r
\r
            if (!properties) {\r
                properties = [name];\r
            }\r
\r
            this.preprocessors[name] = {\r
                name: name,\r
                properties: properties || false,\r
                fn: fn\r
            };\r
\r
            this.setDefaultPreprocessorPosition(name, position, relativeTo);\r
\r
            return this;\r
        },\r
\r
        /**\r
         * Retrieve a pre-processor callback function by its name, which has been registered before\r
         *\r
         * @param {String} name\r
         * @return {Function} preprocessor\r
         * @private\r
         * @static\r
         */\r
        getPreprocessor: function(name) {\r
            return this.preprocessors[name];\r
        },\r
\r
        /**\r
         * @private\r
         */\r
        getPreprocessors: function() {\r
            return this.preprocessors;\r
        },\r
\r
        /**\r
         * @private\r
         */\r
        defaultPreprocessors: [],\r
\r
        /**\r
         * Retrieve the array stack of default pre-processors\r
         * @return {Function[]} defaultPreprocessors\r
         * @private\r
         * @static\r
         */\r
        getDefaultPreprocessors: function() {\r
            return this.defaultPreprocessors;\r
        },\r
\r
        /**\r
         * Set the default array stack of default pre-processors\r
         *\r
         * @private\r
         * @param {Array} preprocessors\r
         * @return {Ext.Class} this\r
         * @static\r
         */\r
        setDefaultPreprocessors: function(preprocessors) {\r
            this.defaultPreprocessors = Ext.Array.from(preprocessors);\r
\r
            return this;\r
        },\r
\r
        /**\r
         * Insert this pre-processor at a specific position in the stack, optionally relative to\r
         * any existing pre-processor. For example:\r
         *\r
         *     Ext.Class.registerPreprocessor('debug', function(cls, data, fn) {\r
         *         // Your code here\r
         *\r
         *         if (fn) {\r
         *             fn.call(this, cls, data);\r
         *         }\r
         *     }).setDefaultPreprocessorPosition('debug', 'last');\r
         *\r
         * @private\r
         * @param {String} name The pre-processor name. Note that it needs to be registered with\r
         * {@link Ext.Class#registerPreprocessor registerPreprocessor} before this\r
         * @param {String} offset The insertion position. Four possible values are:\r
         * 'first', 'last', or: 'before', 'after' (relative to the name provided in the third argument)\r
         * @param {String} relativeName\r
         * @return {Ext.Class} this\r
         * @static\r
         */\r
        setDefaultPreprocessorPosition: function(name, offset, relativeName) {\r
            var defaultPreprocessors = this.defaultPreprocessors,\r
                index;\r
\r
            if (typeof offset == 'string') {\r
                if (offset === 'first') {\r
                    defaultPreprocessors.unshift(name);\r
\r
                    return this;\r
                }\r
                else if (offset === 'last') {\r
                    defaultPreprocessors.push(name);\r
\r
                    return this;\r
                }\r
\r
                offset = (offset === 'after') ? 1 : -1;\r
            }\r
\r
            index = Ext.Array.indexOf(defaultPreprocessors, relativeName);\r
\r
            if (index !== -1) {\r
                Ext.Array.splice(defaultPreprocessors, Math.max(0, index + offset), 0, name);\r
            }\r
\r
            return this;\r
        }\r
    });\r
\r
    /**\r
     * @cfg {String} extend\r
     * The parent class that this class extends. For example:\r
     *\r
     *     Ext.define('Person', {\r
     *         say: function(text) { alert(text); }\r
     *     });\r
     *\r
     *     Ext.define('Developer', {\r
     *         extend: 'Person',\r
     *         say: function(text) { this.callParent(["print "+text]); }\r
     *     });\r
     */\r
    ExtClass.registerPreprocessor('extend', function(Class, data, hooks) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#extendPreProcessor', arguments);\r
        //</debug>\r
        \r
        var Base = Ext.Base,\r
            basePrototype = Base.prototype,\r
            extend = data.extend,\r
            Parent, parentPrototype, i;\r
\r
        delete data.extend;\r
\r
        if (extend && extend !== Object) {\r
            Parent = extend;\r
        }\r
        else {\r
            Parent = Base;\r
        }\r
\r
        parentPrototype = Parent.prototype;\r
\r
        if (!Parent.$isClass) {\r
            for (i in basePrototype) {\r
                if (!parentPrototype[i]) {\r
                    parentPrototype[i] = basePrototype[i];\r
                }\r
            }\r
        }\r
\r
        Class.extend(Parent);\r
\r
        Class.triggerExtended.apply(Class, arguments);\r
\r
        if (data.onClassExtended) {\r
            Class.onExtended(data.onClassExtended, Class);\r
            delete data.onClassExtended;\r
        }\r
\r
    }, true); // true to always run this preprocessor even w/o "extend" keyword\r
\r
    /**\r
     * @cfg {Object} privates\r
     * The `privates` config is a list of methods intended to be used internally by the \r
     * framework.  Methods are placed in a `privates` block to prevent developers from \r
     * accidentally overriding framework methods in custom classes.\r
     *\r
     *     Ext.define('Computer', {\r
     *         privates: {\r
     *             runFactory: function(brand) {\r
     *                 // internal only processing of brand passed to factory\r
     *                 this.factory(brand);\r
     *             }\r
     *         },\r
     *     \r
     *         factory: function (brand) {}\r
     *     });\r
     * \r
     * In order to override a method from a `privates` block, the overridden method must \r
     * also be placed in a `privates` block within the override class.\r
     * \r
     *     Ext.define('Override.Computer', {\r
     *         override: 'Computer',\r
     *         privates: {\r
     *             runFactory: function() {\r
     *                 // overriding logic\r
     *             }\r
     *         }\r
     *     });\r
     */\r
    ExtClass.registerPreprocessor('privates', function(Class, data) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#privatePreprocessor', arguments);\r
        //</debug>\r
\r
        var privates = data.privates,\r
            statics = privates.statics,\r
            privacy = privates.privacy || true;\r
\r
        delete data.privates;\r
        delete privates.statics;\r
\r
        // We have to add this preprocessor so that private getters/setters are picked up\r
        // by the config system. This also catches duplication in the public part of the\r
        // class since it is an error to override a private method with a public one.\r
        Class.addMembers(privates, false, privacy);\r
        if (statics) {\r
            Class.addMembers(statics, true, privacy);\r
        }\r
    });\r
\r
    //<feature classSystem.statics>\r
    /**\r
     * @cfg {Object} statics\r
     * List of static methods for this class. For example:\r
     *\r
     *     Ext.define('Computer', {\r
     *          statics: {\r
     *              factory: function(brand) {\r
     *                  // 'this' in static methods refer to the class itself\r
     *                  return new this(brand);\r
     *              }\r
     *          },\r
     *\r
     *          constructor: function() { ... }\r
     *     });\r
     *\r
     *     var dellComputer = Computer.factory('Dell');\r
     */\r
    ExtClass.registerPreprocessor('statics', function(Class, data) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#staticsPreprocessor', arguments);\r
        //</debug>\r
        \r
        Class.addStatics(data.statics);\r
\r
        delete data.statics;\r
    });\r
    //</feature>\r
\r
    //<feature classSystem.inheritableStatics>\r
    /**\r
     * @cfg {Object} inheritableStatics\r
     * List of inheritable static methods for this class.\r
     * Otherwise just like {@link #statics} but subclasses inherit these methods.\r
     */\r
    ExtClass.registerPreprocessor('inheritableStatics', function(Class, data) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#inheritableStaticsPreprocessor', arguments);\r
        //</debug>\r
        \r
        Class.addInheritableStatics(data.inheritableStatics);\r
\r
        delete data.inheritableStatics;\r
    });\r
    //</feature>\r
\r
    Ext.createRuleFn = function (code) {\r
        return new Function('$c', 'with($c) { return (' + code + '); }');\r
    };\r
    Ext.expressionCache = new Ext.util.Cache({\r
        miss: Ext.createRuleFn\r
    });\r
\r
    Ext.ruleKeySortFn = ruleKeySortFn;\r
    Ext.getPlatformConfigKeys = function (platformConfig) {\r
        var ret = [],\r
            platform, rule;\r
\r
        for (platform in platformConfig) {\r
            rule = Ext.expressionCache.get(platform);\r
            if (rule(Ext.platformTags)) {\r
                ret.push(platform);\r
            }\r
        }\r
\r
        ret.sort(ruleKeySortFn);\r
        return ret;\r
    };\r
\r
    //<feature classSystem.platformConfig>\r
    /**\r
     * @cfg {Object} platformConfig\r
     * Allows setting config values for a class based on specific platforms. The value\r
     * of this config is an object whose properties are "rules" and whose values are\r
     * objects containing config values.\r
     *\r
     * For example:\r
     *\r
     *      Ext.define('App.view.Foo', {\r
     *          extend: 'Ext.panel.Panel',\r
     *\r
     *          platformConfig: {\r
     *              desktop: {\r
     *                  title: 'Some Rather Descriptive Title'\r
     *              },\r
     *\r
     *              '!desktop': {\r
     *                  title: 'Short Title'\r
     *              }\r
     *          }\r
     *      });\r
     *\r
     * In the above, "desktop" and "!desktop" are (mutually exclusive) rules. Whichever\r
     * evaluates to `true` will have its configs applied to the class. In this case, only\r
     * the "title" property, but the object can contain any number of config properties.\r
     * In this case, the `platformConfig` is evaluated as part of the class and there is\r
     * not cost for each instance created.\r
     *\r
     * The rules are evaluated expressions in the context of the platform tags contained\r
     * in `{@link Ext#platformTags Ext.platformTags}`. Any properties of that object are\r
     * implicitly usable (as shown above).\r
     *\r
     * If a `platformConfig` specifies a config value, it will replace any values declared\r
     * on the class itself.\r
     *\r
     * Use of `platformConfig` on instances is handled by the config system when classes\r
     * call `{@link Ext.Base#initConfig initConfig}`. For example:\r
     *\r
     *      Ext.create({\r
     *          xtype: 'panel',\r
     *\r
     *          platformConfig: {\r
     *              desktop: {\r
     *                  title: 'Some Rather Descriptive Title'\r
     *              },\r
     *\r
     *              '!desktop': {\r
     *                  title: 'Short Title'\r
     *              }\r
     *          }\r
     *      });\r
     *\r
     * The following is equivalent to the above:\r
     *\r
     *      if (Ext.platformTags.desktop) {\r
     *          Ext.create({\r
     *              xtype: 'panel',\r
     *              title: 'Some Rather Descriptive Title'\r
     *          });\r
     *      } else {\r
     *          Ext.create({\r
     *              xtype: 'panel',\r
     *              title: 'Short Title'\r
     *          });\r
     *      }\r
     *\r
     * To adjust configs based on dynamic conditions, see `{@link Ext.mixin.Responsive}`.\r
     */\r
    ExtClass.registerPreprocessor('platformConfig', function(Class, data, hooks) {\r
        var platformConfigs = data.platformConfig,\r
            config = data.config,\r
            added, classConfigs, configs, configurator, hoisted, keys, name, value,\r
            i, ln;\r
\r
        delete data.platformConfig;\r
\r
        \r
        //<debug>\r
        if (platformConfigs instanceof Array) {\r
            throw new Error('platformConfigs must be specified as an object.');\r
        }\r
        //</debug>\r
\r
        configurator = Class.getConfigurator();\r
        classConfigs = configurator.configs;\r
\r
        // Get the keys shortest to longest (ish).\r
        keys = Ext.getPlatformConfigKeys(platformConfigs);\r
\r
        // To leverage the Configurator#add method, we want to generate potentially\r
        // two objects to pass in: "added" and "hoisted". For any properties in an\r
        // active platformConfig rule that set proper Configs in the base class, we\r
        // need to put them in "added". If instead of the proper Config coming from\r
        // a base class, it comes from this class's config block, we still need to\r
        // put that config in "added" but we also need move the class-level config\r
        // out of "config" and into "hoisted".\r
        //\r
        // This will ensure that the config defined at the class level is added to\r
        // the Configurator first.\r
        for (i = 0, ln = keys.length; i < ln; ++i) {\r
            configs = platformConfigs[keys[i]];\r
            hoisted = added = null;\r
\r
            for (name in configs) {\r
                value = configs[name];\r
\r
                // We have a few possibilities for each config name:\r
\r
                if (config && name in config) {\r
                    //  It is a proper Config defined by this class.\r
\r
                    (added || (added = {}))[name] = value;\r
                    (hoisted || (hoisted = {}))[name] = config[name];\r
                    delete config[name];\r
                } else if (name in classConfigs) {\r
                    //  It is a proper Config defined by a base class.\r
\r
                    (added || (added = {}))[name] = value;\r
                } else {\r
                    //  It is just a property to put on the prototype.\r
\r
                    data[name] = value;\r
                }\r
            }\r
\r
            if (hoisted) {\r
                configurator.add(hoisted);\r
            }\r
            if (added) {\r
                configurator.add(added);\r
            }\r
        }\r
    });\r
    //</feature>\r
\r
    //<feature classSystem.config>\r
    /**\r
     * @cfg {Object} config\r
     *\r
     * List of configuration options with their default values.\r
     *\r
     * __Note:__ You need to make sure {@link Ext.Base#initConfig} is called from your constructor if you are defining\r
     * your own class or singleton, unless you are extending a Component. Otherwise the generated getter and setter\r
     * methods will not be initialized.\r
     *\r
     * Each config item will have its own setter and getter method automatically generated inside the class prototype\r
     * during class creation time, if the class does not have those methods explicitly defined.\r
     *\r
     * As an example, let's convert the name property of a Person class to be a config item, then add extra age and\r
     * gender items.\r
     *\r
     *     Ext.define('My.sample.Person', {\r
     *         config: {\r
     *             name: 'Mr. Unknown',\r
     *             age: 0,\r
     *             gender: 'Male'\r
     *         },\r
     *\r
     *         constructor: function(config) {\r
     *             this.initConfig(config);\r
     *\r
     *             return this;\r
     *         }\r
     *\r
     *         // ...\r
     *     });\r
     *\r
     * Within the class, this.name still has the default value of "Mr. Unknown". However, it's now publicly accessible\r
     * without sacrificing encapsulation, via setter and getter methods.\r
     *\r
     *     var jacky = new Person({\r
     *         name: "Jacky",\r
     *         age: 35\r
     *     });\r
     *\r
     *     alert(jacky.getAge());      // alerts 35\r
     *     alert(jacky.getGender());   // alerts "Male"\r
     *\r
     *     jacky.walk(10);             // alerts "Jacky is walking 10 steps"\r
     *\r
     *     jacky.setName("Mr. Nguyen");\r
     *     alert(jacky.getName());     // alerts "Mr. Nguyen"\r
     *\r
     *     jacky.walk(10);             // alerts "Mr. Nguyen is walking 10 steps"\r
     *\r
     * Notice that we changed the class constructor to invoke this.initConfig() and pass in the provided config object.\r
     * Two key things happened:\r
     *\r
     *  - The provided config object when the class is instantiated is recursively merged with the default config object.\r
     *  - All corresponding setter methods are called with the merged values.\r
     *\r
     * Beside storing the given values, throughout the frameworks, setters generally have two key responsibilities:\r
     *\r
     *  - Filtering / validation / transformation of the given value before it's actually stored within the instance.\r
     *  - Notification (such as firing events) / post-processing after the value has been set, or changed from a\r
     *    previous value.\r
     *\r
     * By standardize this common pattern, the default generated setters provide two extra template methods that you\r
     * can put your own custom logics into, i.e: an "applyFoo" and "updateFoo" method for a "foo" config item, which are\r
     * executed before and after the value is actually set, respectively. Back to the example class, let's validate that\r
     * age must be a valid positive number, and fire an 'agechange' if the value is modified.\r
     *\r
     *     Ext.define('My.sample.Person', {\r
     *         config: {\r
     *             // ...\r
     *         },\r
     *\r
     *         constructor: {\r
     *             // ...\r
     *         },\r
     *\r
     *         applyAge: function(age) {\r
     *             if (typeof age !== 'number' || age < 0) {\r
     *                 console.warn("Invalid age, must be a positive number");\r
     *                 return;\r
     *             }\r
     *\r
     *             return age;\r
     *         },\r
     *\r
     *         updateAge: function(newAge, oldAge) {\r
     *             // age has changed from "oldAge" to "newAge"\r
     *             this.fireEvent('agechange', this, newAge, oldAge);\r
     *         }\r
     *\r
     *         // ...\r
     *     });\r
     *\r
     *     var jacky = new Person({\r
     *         name: "Jacky",\r
     *         age: 'invalid'\r
     *     });\r
     *\r
     *     alert(jacky.getAge());      // alerts 0\r
     *\r
     *     alert(jacky.setAge(-100));  // alerts 0\r
     *     alert(jacky.getAge());      // alerts 0\r
     *\r
     *     alert(jacky.setAge(35));    // alerts 0\r
     *     alert(jacky.getAge());      // alerts 35\r
     *\r
     * In other words, when leveraging the config feature, you mostly never need to define setter and getter methods\r
     * explicitly. Instead, "apply*" and "update*" methods should be implemented where necessary. Your code will be\r
     * consistent throughout and only contain the minimal logic that you actually care about.\r
     *\r
     * When it comes to inheritance, the default config of the parent class is automatically, recursively merged with\r
     * the child's default config. The same applies for mixins.\r
     */\r
    ExtClass.registerPreprocessor('config', function(Class, data) {\r
        // Need to copy to the prototype here because that happens after preprocessors\r
        if (data.hasOwnProperty('$configPrefixed')) {\r
            Class.prototype.$configPrefixed = data.$configPrefixed;\r
        }\r
        Class.addConfig(data.config);\r
\r
        // We need to remove this or it will be applied by addMembers and smash the\r
        // "config" placed on the prototype by Configurator (which includes *all* configs\r
        // such as cachedConfigs).\r
        delete data.config;\r
    });\r
    //</feature>\r
    \r
    //<feature classSystem.cachedConfig>\r
    /**\r
     * @cfg {Object} cachedConfig\r
     * \r
     * This configuration works in a very similar manner to the {@link #config} option.\r
     * The difference is that the configurations are only ever processed when the first instance\r
     * of that class is created. The processed value is then stored on the class prototype and\r
     * will not be processed on subsequent instances of the class. Getters/setters will be generated\r
     * in exactly the same way as {@link #config}.\r
     * \r
     * This option is useful for expensive objects that can be shared across class instances. \r
     * The class itself ensures that the creation only occurs once.\r
     */\r
    ExtClass.registerPreprocessor('cachedConfig', function(Class, data) {\r
        // Need to copy to the prototype here because that happens after preprocessors\r
        if (data.hasOwnProperty('$configPrefixed')) {\r
            Class.prototype.$configPrefixed = data.$configPrefixed;\r
        }\r
        Class.addCachedConfig(data.cachedConfig);\r
\r
        // Remove this so it won't be placed on the prototype.\r
        delete data.cachedConfig;\r
    });\r
    //</feature>\r
\r
    //<feature classSystem.mixins>\r
    /**\r
     * @cfg {String[]/Object} mixins\r
     * List of classes to mix into this class. For example:\r
     *\r
     *     Ext.define('CanSing', {\r
     *          sing: function() {\r
     *              alert("For he's a jolly good fellow...")\r
     *          }\r
     *     });\r
     *\r
     *     Ext.define('Musician', {\r
     *          mixins: ['CanSing']\r
     *     })\r
     *\r
     * In this case the Musician class will get a `sing` method from CanSing mixin.\r
     *\r
     * But what if the Musician already has a `sing` method? Or you want to mix\r
     * in two classes, both of which define `sing`?  In such a cases it's good\r
     * to define mixins as an object, where you assign a name to each mixin:\r
     *\r
     *     Ext.define('Musician', {\r
     *          mixins: {\r
     *              canSing: 'CanSing'\r
     *          },\r
     * \r
     *          sing: function() {\r
     *              // delegate singing operation to mixin\r
     *              this.mixins.canSing.sing.call(this);\r
     *          }\r
     *     })\r
     *\r
     * In this case the `sing` method of Musician will overwrite the\r
     * mixed in `sing` method. But you can access the original mixed in method\r
     * through special `mixins` property.\r
     */\r
    ExtClass.registerPreprocessor('mixins', function(Class, data, hooks) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#mixinsPreprocessor', arguments);\r
        //</debug>\r
        \r
        var mixins = data.mixins,\r
            onCreated = hooks.onCreated;\r
\r
        delete data.mixins;\r
\r
        hooks.onCreated = function() {\r
            //<debug>\r
            Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#mixinsPreprocessor#beforeCreated', arguments);\r
            //</debug>\r
\r
            // Put back the original onCreated before processing mixins. This allows a\r
            // mixin to hook onCreated by access Class._classHooks.\r
            hooks.onCreated = onCreated;\r
\r
            Class.mixin(mixins);\r
\r
            // We must go back to hooks.onCreated here because it may have changed during\r
            // calls to onClassMixedIn.\r
            return hooks.onCreated.apply(this, arguments);\r
        };\r
    });\r
    //</feature>\r
\r
\r
    //<feature classSystem.backwardsCompatible>\r
    // Backwards compatible\r
    Ext.extend = function(Class, Parent, members) {\r
        //<debug>\r
        Ext.classSystemMonitor && Ext.classSystemMonitor(Class, 'Ext.Class#extend-backwards-compatible', arguments);\r
        //</debug>\r
            \r
        if (arguments.length === 2 && Ext.isObject(Parent)) {\r
            members = Parent;\r
            Parent = Class;\r
            Class = null;\r
        }\r
\r
        var cls;\r
\r
        if (!Parent) {\r
            throw new Error("[Ext.extend] Attempting to extend from a class which has not been loaded on the page.");\r
        }\r
\r
        members.extend = Parent;\r
        members.preprocessors = [\r
            'extend'\r
            //<feature classSystem.statics>\r
            ,'statics'\r
            //</feature>\r
            //<feature classSystem.inheritableStatics>\r
            ,'inheritableStatics'\r
            //</feature>\r
            //<feature classSystem.mixins>\r
            ,'mixins'\r
            //</feature>\r
            //<feature classSystem.platformConfig>\r
            ,'platformConfig'\r
            //</feature>\r
            //<feature classSystem.config>\r
            ,'config'\r
            //</feature>\r
        ];\r
\r
        if (Class) {\r
            cls = new ExtClass(Class, members);\r
            // The 'constructor' is given as 'Class' but also needs to be on prototype\r
            cls.prototype.constructor = Class;\r
        } else {\r
            cls = new ExtClass(members);\r
        }\r
\r
        cls.prototype.override = function(o) {\r
            for (var m in o) {\r
                if (o.hasOwnProperty(m)) {\r
                    this[m] = o[m];\r
                }\r
            }\r
        };\r
\r
        return cls;\r
    };\r
    //</feature>\r
\r
    /**\r
     * This object contains properties that describe the current device or platform. These\r
     * values can be used in `{@link Ext.Class#platformConfig platformConfig}` as well as\r
     * `{@link Ext.mixin.Responsive#responsiveConfig responsiveConfig}` statements.\r
     *\r
     * This object can be modified to include tags that are useful for the application. To\r
     * add custom properties, it is advisable to use a sub-object. For example:\r
     *\r
     *      Ext.platformTags.app = {\r
     *          mobile: true\r
     *      };\r
     *\r
     * @property {Object} platformTags\r
     * @property {Boolean} platformTags.phone\r
     * @property {Boolean} platformTags.tablet\r
     * @property {Boolean} platformTags.desktop\r
     * @property {Boolean} platformTags.touch Indicates touch inputs are available.\r
     * @property {Boolean} platformTags.safari\r
     * @property {Boolean} platformTags.chrome\r
     * @property {Boolean} platformTags.windows\r
     * @property {Boolean} platformTags.firefox\r
     * @property {Boolean} platformTags.ios True for iPad, iPhone and iPod.\r
     * @property {Boolean} platformTags.android\r
     * @property {Boolean} platformTags.blackberry\r
     * @property {Boolean} platformTags.tizen\r
     * @member Ext\r
     */\r
}());\r