var Viewer = function(){
    // a bunch of private variables accessible by member function
    var layout,innerNorth,innerCenter;
    var bodyPanel,eastPanel;
    var northPanel,centerPanel,southPanel;
    return {
        init : function(){
            // initialize state manager, we will use cookies
            Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
            // create the main layout
            layout = new Ext.BorderLayout(document.body, {
                north: {
                    split:false,
                    initialSize: 70,
                    titlebar: false
                },
                center: {
                    titlebar: false,
                    autoScroll:false,
                    resizeTabs: true
                },
                south: {
                    split:false,
                    initialSize: 25,
                    titlebar: false,
                    collapsible: false,
                    animate: false
                }
            });
            // tell the layout not to perform layouts until we're done adding everything
            
            innerNorth = new Ext.BorderLayout('topDiv', {
                center: {
                    split:false,
                    initialSize: 45,
                    titlebar: false
                },
                south: {
                    split:false,
                    initialSize: 26,
                    titlebar: false
                }
            });                      
           	innerNorth.beginUpdate();
	            	innerNorth.add('center',new Ext.ContentPanel('bannerDiv'));
    	        	innerNorth.add('south',new Ext.ContentPanel('menuDiv'));            	
            	innerNorth.restoreState();
	            innerNorth.endUpdate(true);
            
            
            innerCenter = new Ext.BorderLayout('mainDiv', {
                center: {
                    autoScroll:true,
                    titlebar:false                    
                },
                east: {
                    split:false,
                    initialSize: 175,
                    minSize: 175,
                    maxSize: 175,
                    titlebar: true,
                    collapsible: true,
                    animate: true,
                    autoScroll:false,
                    useShim:true,
                    collapsed:true,
                    cmargins: {top:0,bottom:2,right:0,left:0}
                }
            });
            bodyPanel = new Ext.ContentPanel('bodyDiv',{fitToFrame:true});
            eastPanel = new Ext.ContentPanel('rightDiv', {title: 'DOCK', fitToFrame:true});
            innerCenter.beginUpdate();
            	innerCenter.add('center', bodyPanel);         
            	innerCenter.add('east', eastPanel);         
            innerCenter.restoreState();
            innerCenter.endUpdate(true);
		            // restore any state information
			northPanel = new Ext.NestedLayoutPanel(innerNorth);		            
			centerPanel = new Ext.NestedLayoutPanel(innerCenter);           
   	        southPanel  = new Ext.ContentPanel("footerDiv");           
   	        
            layout.beginUpdate();           		           		
           		layout.add('north', northPanel);           	
            	layout.add('center', centerPanel);            		            
   	        	layout.add('south', southPanel);
            layout.restoreState();
            layout.endUpdate();
        }
    };
}();
Ext.onReady(Viewer.init, Viewer);