X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/ee06f37b0f6f6d94cd05a6ffae556660f7c4a2bc..c930e9176a5a85509c5b0230e2bff5c22a591432:/source/widgets/BoxComponent.js

diff --git a/source/widgets/BoxComponent.js b/source/widgets/BoxComponent.js
deleted file mode 100644
index 037579c7..00000000
--- a/source/widgets/BoxComponent.js
+++ /dev/null
@@ -1,361 +0,0 @@
-/*
- * Ext JS Library 2.2.1
- * Copyright(c) 2006-2009, Ext JS, LLC.
- * licensing@extjs.com
- * 
- * http://extjs.com/license
- */
-
-/**
- * @class Ext.BoxComponent
- * @extends Ext.Component
- * <p>Base class for any visual {@link Ext.Component} that uses a box container.  BoxComponent provides automatic box
- * model adjustments for sizing and positioning and will work correctly withnin the Component rendering model.  All
- * container classes should subclass BoxComponent so that they will work consistently when nested within other Ext
- * layout containers.</p>
- * <p>A BoxComponent may be created as a custom Component which encapsulates any HTML element, either a pre-existing
- * element, or one that is created to your specifications at render time. Usually, to participate in layouts,
- * a Component will need to be a <b>Box</b>Component in order to have its width and height managed.</p>
- * <p>To use a pre-existing element as a BoxComponent, configure it so that you preset the <b>el</b> property to the
- * element to reference:<pre><code>
-var pageHeader = new Ext.BoxComponent({
-    el: 'my-header-div'
-});</code></pre>
- * This may then be {@link Ext.Container#add added} to a {@link Ext.Container Container} as a child item.</p>
- * <p>To create a BoxComponent based around a HTML element to be created at render time, use the
- * {@link Ext.Component#autoEl autoEl} config option which takes the form of a
- * {@link Ext.DomHelper DomHelper} specification:<pre><code>
-var myImage = new Ext.BoxComponent({
-    autoEl: {
-        tag: 'img',
-        src: '/images/my-image.jpg'
-    }
-});</code></pre></p>
- * @constructor
- * @param {Ext.Element/String/Object} config The configuration options.
- */
-Ext.BoxComponent = Ext.extend(Ext.Component, {
-    /**
-     * @cfg {Number} x
-     * The local x (left) coordinate for this component if contained within a positioning container.
-     */
-    /**
-     * @cfg {Number} y
-     * The local y (top) coordinate for this component if contained within a positioning container.
-     */
-    /**
-     * @cfg {Number} pageX
-     * The page level x coordinate for this component if contained within a positioning container.
-     */
-    /**
-     * @cfg {Number} pageY
-     * The page level y coordinate for this component if contained within a positioning container.
-     */
-    /**
-     * @cfg {Number} height
-     * The height of this component in pixels (defaults to auto).
-     */
-    /**
-     * @cfg {Number} width
-     * The width of this component in pixels (defaults to auto).
-     */
-    /**
-     * @cfg {Boolean} autoHeight
-     * True to use height:'auto', false to use fixed height (defaults to false). <b>Note</b>: Although many components 
-     * inherit this config option, not all will function as expected with a height of 'auto'. Setting autoHeight:true 
-     * means that the browser will manage height based on the element's contents, and that Ext will not manage it at all.
-     */
-    /**
-     * @cfg {Boolean} autoWidth
-     * True to use width:'auto', false to use fixed width (defaults to false). <b>Note</b>: Although many components 
-     * inherit this config option, not all will function as expected with a width of 'auto'. Setting autoWidth:true 
-     * means that the browser will manage width based on the element's contents, and that Ext will not manage it at all.
-     */
-
-    /* // private internal config
-     * {Boolean} deferHeight
-     * True to defer height calculations to an external component, false to allow this component to set its own
-     * height (defaults to false).
-     */
-
-	// private
-    initComponent : function(){
-        Ext.BoxComponent.superclass.initComponent.call(this);
-        this.addEvents(
-            /**
-             * @event resize
-             * Fires after the component is resized.
-             * @param {Ext.Component} this
-             * @param {Number} adjWidth The box-adjusted width that was set
-             * @param {Number} adjHeight The box-adjusted height that was set
-             * @param {Number} rawWidth The width that was originally specified
-             * @param {Number} rawHeight The height that was originally specified
-             */
-            'resize',
-            /**
-             * @event move
-             * Fires after the component is moved.
-             * @param {Ext.Component} this
-             * @param {Number} x The new x position
-             * @param {Number} y The new y position
-             */
-            'move'
-        );
-    },
-
-    // private, set in afterRender to signify that the component has been rendered
-    boxReady : false,
-    // private, used to defer height settings to subclasses
-    deferHeight: false,
-
-    /**
-     * Sets the width and height of the component.  This method fires the {@link #resize} event.  This method can accept
-     * either width and height as separate numeric arguments, or you can pass a size object like {width:10, height:20}.
-     * @param {Number/Object} width The new width to set, or a size object in the format {width, height}
-     * @param {Number} height The new height to set (not required if a size object is passed as the first arg)
-     * @return {Ext.BoxComponent} this
-     */
-    setSize : function(w, h){
-        // support for standard size objects
-        if(typeof w == 'object'){
-            h = w.height;
-            w = w.width;
-        }
-        // not rendered
-        if(!this.boxReady){
-            this.width = w;
-            this.height = h;
-            return this;
-        }
-
-        // prevent recalcs when not needed
-        if(this.lastSize && this.lastSize.width == w && this.lastSize.height == h){
-            return this;
-        }
-        this.lastSize = {width: w, height: h};
-        var adj = this.adjustSize(w, h);
-        var aw = adj.width, ah = adj.height;
-        if(aw !== undefined || ah !== undefined){ // this code is nasty but performs better with floaters
-            var rz = this.getResizeEl();
-            if(!this.deferHeight && aw !== undefined && ah !== undefined){
-                rz.setSize(aw, ah);
-            }else if(!this.deferHeight && ah !== undefined){
-                rz.setHeight(ah);
-            }else if(aw !== undefined){
-                rz.setWidth(aw);
-            }
-            this.onResize(aw, ah, w, h);
-            this.fireEvent('resize', this, aw, ah, w, h);
-        }
-        return this;
-    },
-
-    /**
-     * Sets the width of the component.  This method fires the {@link #resize} event.
-     * @param {Number} width The new width to set
-     * @return {Ext.BoxComponent} this
-     */
-    setWidth : function(width){
-        return this.setSize(width);
-    },
-
-    /**
-     * Sets the height of the component.  This method fires the {@link #resize} event.
-     * @param {Number} height The new height to set
-     * @return {Ext.BoxComponent} this
-     */
-    setHeight : function(height){
-        return this.setSize(undefined, height);
-    },
-
-    /**
-     * Gets the current size of the component's underlying element.
-     * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
-     */
-    getSize : function(){
-        return this.el.getSize();
-    },
-
-    /**
-     * Gets the current XY position of the component's underlying element.
-     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
-     * @return {Array} The XY position of the element (e.g., [100, 200])
-     */
-    getPosition : function(local){
-        if(local === true){
-            return [this.el.getLeft(true), this.el.getTop(true)];
-        }
-        return this.xy || this.el.getXY();
-    },
-
-    /**
-     * Gets the current box measurements of the component's underlying element.
-     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page XY (defaults to false)
-     * @return {Object} box An object in the format {x, y, width, height}
-     */
-    getBox : function(local){
-        var s = this.el.getSize();
-        if(local === true){
-            s.x = this.el.getLeft(true);
-            s.y = this.el.getTop(true);
-        }else{
-            var xy = this.xy || this.el.getXY();
-            s.x = xy[0];
-            s.y = xy[1];
-        }
-        return s;
-    },
-
-    /**
-     * Sets the current box measurements of the component's underlying element.
-     * @param {Object} box An object in the format {x, y, width, height}
-     * @return {Ext.BoxComponent} this
-     */
-    updateBox : function(box){
-        this.setSize(box.width, box.height);
-        this.setPagePosition(box.x, box.y);
-        return this;
-    },
-
-    // protected
-    getResizeEl : function(){
-        return this.resizeEl || this.el;
-    },
-
-    // protected
-    getPositionEl : function(){
-        return this.positionEl || this.el;
-    },
-
-    /**
-     * Sets the left and top of the component.  To set the page XY position instead, use {@link #setPagePosition}.
-     * This method fires the {@link #move} event.
-     * @param {Number} left The new left
-     * @param {Number} top The new top
-     * @return {Ext.BoxComponent} this
-     */
-    setPosition : function(x, y){
-        if(x && typeof x[1] == 'number'){
-            y = x[1];
-            x = x[0];
-        }
-        this.x = x;
-        this.y = y;
-        if(!this.boxReady){
-            return this;
-        }
-        var adj = this.adjustPosition(x, y);
-        var ax = adj.x, ay = adj.y;
-
-        var el = this.getPositionEl();
-        if(ax !== undefined || ay !== undefined){
-            if(ax !== undefined && ay !== undefined){
-                el.setLeftTop(ax, ay);
-            }else if(ax !== undefined){
-                el.setLeft(ax);
-            }else if(ay !== undefined){
-                el.setTop(ay);
-            }
-            this.onPosition(ax, ay);
-            this.fireEvent('move', this, ax, ay);
-        }
-        return this;
-    },
-
-    /**
-     * Sets the page XY position of the component.  To set the left and top instead, use {@link #setPosition}.
-     * This method fires the {@link #move} event.
-     * @param {Number} x The new x position
-     * @param {Number} y The new y position
-     * @return {Ext.BoxComponent} this
-     */
-    setPagePosition : function(x, y){
-        if(x && typeof x[1] == 'number'){
-            y = x[1];
-            x = x[0];
-        }
-        this.pageX = x;
-        this.pageY = y;
-        if(!this.boxReady){
-            return;
-        }
-        if(x === undefined || y === undefined){ // cannot translate undefined points
-            return;
-        }
-        var p = this.el.translatePoints(x, y);
-        this.setPosition(p.left, p.top);
-        return this;
-    },
-
-    // private
-    onRender : function(ct, position){
-        Ext.BoxComponent.superclass.onRender.call(this, ct, position);
-        if(this.resizeEl){
-            this.resizeEl = Ext.get(this.resizeEl);
-        }
-        if(this.positionEl){
-            this.positionEl = Ext.get(this.positionEl);
-        }
-    },
-
-    // private
-    afterRender : function(){
-        Ext.BoxComponent.superclass.afterRender.call(this);
-        this.boxReady = true;
-        this.setSize(this.width, this.height);
-        if(this.x || this.y){
-            this.setPosition(this.x, this.y);
-        }else if(this.pageX || this.pageY){
-            this.setPagePosition(this.pageX, this.pageY);
-        }
-    },
-
-    /**
-     * Force the component's size to recalculate based on the underlying element's current height and width.
-     * @return {Ext.BoxComponent} this
-     */
-    syncSize : function(){
-        delete this.lastSize;
-        this.setSize(this.autoWidth ? undefined : this.el.getWidth(), this.autoHeight ? undefined : this.el.getHeight());
-        return this;
-    },
-
-    /* // protected
-     * Called after the component is resized, this method is empty by default but can be implemented by any
-     * subclass that needs to perform custom logic after a resize occurs.
-     * @param {Number} adjWidth The box-adjusted width that was set
-     * @param {Number} adjHeight The box-adjusted height that was set
-     * @param {Number} rawWidth The width that was originally specified
-     * @param {Number} rawHeight The height that was originally specified
-     */
-    onResize : function(adjWidth, adjHeight, rawWidth, rawHeight){
-
-    },
-
-    /* // protected
-     * Called after the component is moved, this method is empty by default but can be implemented by any
-     * subclass that needs to perform custom logic after a move occurs.
-     * @param {Number} x The new x position
-     * @param {Number} y The new y position
-     */
-    onPosition : function(x, y){
-
-    },
-
-    // private
-    adjustSize : function(w, h){
-        if(this.autoWidth){
-            w = 'auto';
-        }
-        if(this.autoHeight){
-            h = 'auto';
-        }
-        return {width : w, height: h};
-    },
-
-    // private
-    adjustPosition : function(x, y){
-        return {x : x, y: y};
-    }
-});
-Ext.reg('box', Ext.BoxComponent);
\ No newline at end of file