Upgraded ExtJS library to 4.07

README.md

@@ -77,7 +77,10 @@ Usage for extended (default)
 
 	console.log(errors);
 
-(Hat-tip to Christoph Hagenbrock (@agebrock))
 
+License
+-------
+
+ExtJS is a fully licensed product for use in commercial projects or under GPL for open source projects. It is assumed that if you're using node-extjs that you will conform to the licensing requirements of Sencha (http://www.sencha.com/products/extjs/license/);
 
 

examples/test/server.js

@@ -11,8 +11,6 @@ Ext.Loader.setConfig({
       }
 });
 
-//Ext.require("Examples.models.User");
-
 var user = Ext.create("Examples.models.User", {
     name : 'Conan',
     age  : 24,

lib/extjs/src/AbstractComponent.js

@@ -196,10 +196,25 @@ Ext.define('Ext.AbstractComponent', {
      * internal structure.
      *
      * Upon rendering, any created child elements may be automatically imported into object properties using the
-     * {@link #renderSelectors} option.
+     * {@link #renderSelectors} and {@link #childEls} options.
      */
     renderTpl: null,
 
+    /**
+     * @cfg {Object} renderData
+     *
+     * The data used by {@link #renderTpl} in addition to the following property values of the component:
+     *
+     * - id
+     * - ui
+     * - uiCls
+     * - baseCls
+     * - componentCls
+     * - frame
+     *
+     * See {@link #renderSelectors} and {@link #childEls} for usage examples.
+     */
+
     /**
      * @cfg {Object} renderSelectors
      * An object containing properties specifying {@link Ext.DomQuery DomQuery} selectors which identify child elements
@@ -208,47 +223,68 @@ Ext.define('Ext.AbstractComponent', {
      * After the Component's internal structure is rendered according to the {@link #renderTpl}, this object is iterated through,
      * and the found Elements are added as properties to the Component using the `renderSelector` property name.
      *
-     * For example, a Component which rendered an image, and description into its element might use the following properties
-     * coded into its prototype:
-     *
-     *     renderTpl: '<img src="{imageUrl}" class="x-image-component-img"><div class="x-image-component-desc">{description}</div>',
+     * For example, a Component which renderes a title and description into its element:
      *
-     *     renderSelectors: {
-     *         image: 'img.x-image-component-img',
-     *         descEl: 'div.x-image-component-desc'
-     *     }
-     *
-     * After rendering, the Component would have a property `image` referencing its child `img` Element, and a property `descEl`
-     * referencing the `div` Element which contains the description.
+     *     Ext.create('Ext.Component', {
+     *         renderTo: Ext.getBody(),
+     *         renderTpl: [
+     *             '<h1 class="title">{title}</h1>',
+     *             '<p>{desc}</p>'
+     *         ],
+     *         renderData: {
+     *             title: "Error",
+     *             desc: "Something went wrong"
+     *         },
+     *         renderSelectors: {
+     *             titleEl: 'h1.title',
+     *             descEl: 'p'
+     *         },
+     *         listeners: {
+     *             afterrender: function(cmp){
+     *                 // After rendering the component will have a titleEl and descEl properties
+     *                 cmp.titleEl.setStyle({color: "red"});
+     *             }
+     *         }
+     *     });
      *
      * For a faster, but less flexible, alternative that achieves the same end result (properties for child elements on the
      * Component after render), see {@link #childEls} and {@link #addChildEls}.
      */
 
-     /**
-      * @cfg {Object[]} childEls
-      * An array describing the child elements of the Component. Each member of the array
-      * is an object with these properties:
-      *
-      * - `name` - The property name on the Component for the child element.
-      * - `itemId` - The id to combine with the Component's id that is the id of the child element.
-      * - `id` - The id of the child element.
-      *
-      * If the array member is a string, it is equivalent to `{ name: m, itemId: m }`.
-      *
-      * For example, a Component which renders two nested div's:
-      *
-      *     renderTpl: '<div id="{id}-foo"><div id="{id}-bar">{description}</div></div>',
-      *
-      *     childEls: [ 'foo', 'bar' ]
-      *
-      * After rendering, the Component will have `foo` and `bar` properties that refer to the
-      * child elements. The key is that the rendered elements have id's equal to this component's
-      * id and the given name (separated by a '-'). For example, "mycmp-foo" and "mycmp-bar"
-      * are the element id's given a component id of "mycmp".
-      *
-      * A more flexible, but somewhat slower, approach is {@link #renderSelectors}.
-      */
+    /**
+     * @cfg {Object[]} childEls
+     * An array describing the child elements of the Component. Each member of the array
+     * is an object with these properties:
+     *
+     * - `name` - The property name on the Component for the child element.
+     * - `itemId` - The id to combine with the Component's id that is the id of the child element.
+     * - `id` - The id of the child element.
+     *
+     * If the array member is a string, it is equivalent to `{ name: m, itemId: m }`.
+     *
+     * For example, a Component which renders a title and body text:
+     *
+     *     Ext.create('Ext.Component', {
+     *         renderTo: Ext.getBody(),
+     *         renderTpl: [
+     *             '<h1 id="{id}-title">{title}</h1>',
+     *             '<p>{msg}</p>',
+     *         ],
+     *         renderData: {
+     *             title: "Error",
+     *             msg: "Something went wrong"
+     *         },
+     *         childEls: ["title"],
+     *         listeners: {
+     *             afterrender: function(cmp){
+     *                 // After rendering the component will have a title property
+     *                 cmp.title.setStyle({color: "red"});
+     *             }
+     *         }
+     *     });
+     *
+     * A more flexible, but somewhat slower, approach is {@link #renderSelectors}.
+     */
 
     /**
      * @cfg {String/HTMLElement/Ext.Element} renderTo
@@ -598,9 +634,9 @@ Ext.define('Ext.AbstractComponent', {
 
     /**
      * @cfg {Boolean/String/HTMLElement/Ext.Element} autoRender
-     * This config is intended mainly for {@link #floating} Components which may or may not be shown. Instead of using
+     * This config is intended mainly for non-{@link #floating} Components which may or may not be shown. Instead of using
      * {@link #renderTo} in the configuration, and rendering upon construction, this allows a Component to render itself
-     * upon first _{@link #show}_.
+     * upon first _{@link #show}_. If {@link #floating} is true, the value of this config is omited as if it is `true`.
      *
      * Specify as `true` to have this Component render to the document body upon first show.
      *
@@ -3221,6 +3257,9 @@ Ext.define('Ext.AbstractComponent', {
                 }
             }
         }
+        delete me.rendered;
+        delete me.el;
+        delete me.frameBody;
     },
 
     /**

lib/extjs/src/AbstractManager.js

@@ -52,6 +52,14 @@ Ext.define('Ext.AbstractManager', {
      * @param {Object} item The item to register
      */
     register: function(item) {
+        //<debug>
+        var all = this.all,
+            key = all.getKey(item);
+
+        if (all.containsKey(key)) {
+            Ext.Error.raise('Registering duplicate id "' + key + '" with this manager');
+        }
+        //</debug>
         this.all.add(item);
     },
 
@@ -94,7 +102,7 @@ Ext.define('Ext.AbstractManager', {
             Constructor = this.types[type];
 
         //<debug>
-        if (Constructor == undefined) {
+        if (Constructor === undefined) {
             Ext.Error.raise("The '" + type + "' type has not been registered with this manager");
         }
         //</debug>