Saludos amigos, Quisiera hacer una aplicacion que tuviera la cualidad de manejo de ventanas tal como se puede ver en este ejemplo de "Doug" [url]http://demos.theactivegroup.com/?demo=basex&script=flickr[/url] que es buenisimo por cierto, pero hay varias cosas en su codigo que no logro comprender. Podrian ustedes ayudarme a generar un viewport que maneje ventanas de esa manera, pero sin tanta complejidad??? adjunto mi codigo inicial:

Ext.ns('demo');
demo.MainViewer = {
	init: function(){
		
		Ext.QuickTips.init();
		
		mainHeaderPanel = new Ext.Panel({
			region: 'north',
			border: false,
			layout: 'anchor',
			height: 83,
			items: [
				{
					xtype: 'box',
					el: 'header',
					border: false,
					anchor: 'none'
				}
			]
		});
				
		mainLeftPanel = {
			region: 'west',
			id: 'left-panel',
			border: true,
			collapsible: true,
			collapseMode: 'mini',
			collapseFirst: true,
			animCollapse: false,
			animate: false,
			split: true,
			margins: '3 -4 4 5', 
                        cmargins: '3 -4 4 0',
			maxSize: 500,
			width: 200,
			minSize: 100,
			hideBorders: true
		};
		
		mainCenterPanel = {
			region: 'center',
			id: 'center-panel',
			layout: 'fit',
			margins: '3 4 4 4',
			hideBorders: true
		};
		
		mainViewport = new Ext.Viewport({
			layout:'border',
			items:[mainHeaderPanel, mainCenterPanel, mainLeftPanel]
		});
		
		mainViewport.doLayout();
		
		Ext.get('loading-mask').remove();
		Ext.get('loading').remove();
		
		console.debug('MainViewer.init ready!');
	},//end init
	
	createWindow: function(){
		desktopEl = Ext.get('center-panel');
		console.debug(desktopEl);
	
            // tabs for the center
            var tabs = new Ext.TabPanel({
            region: 'center',
            margins:'3 3 3 0', 
            activeTab: 0,
            defaults:{autoScroll:true},
            items:[{
                title: 'Bogus Tab',
                html: 'Hola mundo1'
            },{
                title: 'Another Tab',
                html: 'Hola mundo2'
            },{
                title: 'Closable Tab',
                html: 'Hola mundo3',
                closable:true
            }]
        });
        // Panel for the west
        var nav = new Ext.Panel({
            title: 'Navigation',
            region: 'west',
            split: true,
            width: 200,
            collapsible: true,
            margins:'3 0 3 3',
            cmargins:'3 3 3 3'
        });
        var win = new Ext.Window({
            title: 'Layout Window',
            closable:true,
            width:600,
            height:350,
            plain:true,
renderTo: 'center-panel',  // con desktopEl no funca :(
            layout: 'border',
            items: [nav, tabs]
        });
	
        win.show();
	}//end createWindow
}
Ext.onReady(demo.MainViewer.init, demo.MainViewer);