/*
 * Ext JS Library 2.2
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */

Ext.onReady(function(){

    // NOTE: This is an example showing simple state management. During development,
    // it is generally best to disable state management as dynamically-generated ids
    // can change across page loads, leading to unpredictable results.  The developer
    // should ensure that stable state ids are set for stateful components in real apps.
    Ext.state.Manager.setProvider(new Ext.state.CookieProvider());

    // create some portlet tools using built in Ext tool ids
    var tools = [{
        id:'gear',
        handler: function(){
            Ext.Msg.alert('Message', 'The Settings tool was clicked.');
        }
    },{
        id:'close',
        handler: function(e, target, panel){
            panel.ownerCt.remove(panel, true);
        }
    }];

    var viewport = new Ext.Viewport({
        layout:'border',
        items:[{
            xtype:'portal',
            region:'center',
            margins:'35 5 5 0',
            items:[{
                columnWidth:.33,
                style:'padding:10px 0 10px 10px',
                items:[{
                    title: 'Seksverhalen.biz',
                    layout:'fit',
                    tools: tools,
                    items: new SampleGrid([0, 2, 3])
                },{
                    title: 'Deze site',
                    tools: tools,
                    contentEl: 'panel-0_1'
                }]
            },{
                columnWidth:.33,
                style:'padding:10px 0 10px 10px',
                items:[{
                    title: 'Nieuws',
                    tools: tools,
                    html: 'Welkom op deze nieuwe seksverhalen portal.'
                },{
                    title: 'Nieuws',
                    tools: tools,
                    contentEl:'panel-1_1'
                }]
            },{
                columnWidth:.33,
                style:'padding:10px',
                items:[{
                    title: 'Nieuws',
                    tools: tools,
                    contentEl: 'panel-2_0'
                },{
                    title: 'Nieuws',
                    tools: tools,
					contentEl: 'panel-2_1'
                }]
            }]
        }]
    });
});