Ext.ns('Ext.ux');

Ext.ux.ScreenPanel = Ext.extend(Ext.Panel,{

    initComponent: function() {
        Ext.ux.ScreenPanel.superclass.initComponent.call(this);
    },

    initItems : function(){

        if(!this.items){
            this.items = new Ext.util.MixedCollection(false, this.getComponentId);
            this.getLayout(); // initialize the layout
        }
    },

    lookupComponent : function(comp){
        if(Ext.isString(comp)){
            return Ext.ComponentMgr.get(comp);
        }else if(!comp.events){
            return this.createComponent(comp);
        }
        return comp;
    },

    add : function(comp){

        this.initItems();
        var args = arguments.length > 1;
        if(args || Ext.isArray(comp)){
            var result = [];
            Ext.each(args ? arguments : comp, function(c, num){
                if(num == this.activeItem) {
                    this.items = false;
                    result.push(this.add(c));
                }
            }, this);
            return result;
        }
//console.log(this.items);

        var c = this.lookupComponent(this.applyDefaults(comp));
        var index = this.items.length;
        if(this.fireEvent('beforeadd', this, c, index) !== false && this.onBeforeAdd(c) !== false){
//console.log(this.items);

            this.items.add(c);
            // *onAdded
            c.onAdded(this, index);
            this.onAdd(c);
            this.fireEvent('add', this, c, index);
        }

        return c;
    }
});

Ext.reg('screen', Ext.ux.ScreenPanel);