Ext.namespace('Kelda.Info'); 
Ext.namespace('Keldan.Premium');

Kelda.Info.Portal = Ext.extend(Ext.ux.Portal, {
    id:'main-portal',
    baseCls:'main-portal',
    autoScroll:true,
    stateful: true,
    boxMinWidth:960,
    initComponent: function() {
        this.items = [{columnWidth:.33},{columnWidth:.34},{columnWidth:.33}];
		//this.items = [{colspan:1},{colspan:1},{colspan:1}];
        Kelda.Info.Portal.superclass.initComponent.apply(this, arguments);
    }
});
Ext.reg('main-portal', Kelda.Info.Portal);

/*Kelda.Info.Main = Ext.extend(Ext.Panel, {
    id: 'main',
    layout:'border',
    title: 'Main',
    initComponent: function() {
        this.items = [{xtype: 'main-portal'}];
        Kelda.Info.Main.superclass.initComponent.apply(this, arguments);
    }
});
Ext.reg('main', Kelda.Info.Main);
*/

Kelda.Info.RequiredPortlet = Ext.extend(Ext.Panel, {
    plugins: Ext.ux.PortletPlugin,
    id: 'required-main-portlet',
    title:'Required Main Portlet',
    collapsible: false,
    closeable: false,
    settings: true,
    settingHandler: function(e, target, panel) {
        //here's a (slightly) more advanced example that shows what you can do with the settingHandler
        
    },
    layout: 'fit',
    //if you use the state of the portal to store state information (through initialConfig/ownerCt.ownerCt.saveState,
    //the state information is immediately available directly through the panel object itself (this), as early as
    //the initComponent function.  The primary purpose is to allow you to choose which is easier.  i.e. Most
    //components are easiest to save state by just giving them the right parameters to start with, while some
    //components save their own state (like grids).
    initComponent: function() {
        
        Kelda.Info.RequiredPortlet.superclass.initComponent.apply(this, arguments);
        
        this.on('render', this.refresh, this);
    },
    //if you use the state of the panel to store state information, then treat it like any other stateful
    //implementation, set stateful = true, and define getState and applyState (and possibly stateEvents).
    stateful: true,
    getState: function() { return {items : [new Ext.TabPanel({
        activeTab:0,
        items:[{title:'Tab1',html:'SimpleTab'},{title:'Tab2',html:'Another simple tab'}]
        })]} },
    applyState: function(state) {
        this.items = this.items ? this.items : [];
    },
    items : [new Ext.TabPanel({
             activeTab:0,
             items:[{title:'Tab1',html:'SimpleTab'},{title:'Tab2',html:'Another simple tab'}]
             })]
});
Ext.reg('requiredportlet', Kelda.Info.RequiredPortlet);