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());

       var viewport = new Ext.Viewport({
            layout:'border',
            items:[
            
           new Ext.BoxComponent({
                region: 'north',
                height: 100, // give north and south regions a height
                autoEl: {
                    tag: 'div',
                    html:'<img src ="images/banner.png"'
                }
            }), new Ext.BoxComponent({
                region: 'south',
                height: 25, // give north and south regions a height
                autoEl: {
                    tag: 'div',
                    html:'<center><p><font color="white"><a href="mailto:newyorkstreetfood@gmail.com" style="color: white;">contact</a> - <a href="http://twitter.com/nystfood" target="_blank"  style="color: white;"> twitter</a> - <a href="http://www.facebook.com/pages/New-York-NY/New-York-Street-Food/108155492555798?ref=search&sid=16110258.668452885..1&v=wall#!" target="_blank"  style="color: white;"> facebook</a></font></center>'
                }
            }),
            
            
            
            {
                region:'west',
                id:'west-panel',
                title:'Click for More Info',
                split:true,
                width: 240,
                minSize: 175,
                maxSize: 400,
                collapsible: true,
                margins: '0 0 0 5',
                layout:'fit',
                items: [{
                    contentEl: 'side_bar',
                    title:'',
                    autoScroll:true,
                    border:false
                   
                }]
            },{
                region:'east',
                id:'east-panel',
                title:'Find Street Food',
                split:true,
                width: 240,
                minSize: 175,
                maxSize: 400,
                collapsible: true,
                margins: '0 5 0 0 ',
                layout:'fit',
                items: [{
                 
                    title:'',
                    contentEl: 'check',
                    autoScroll:true,
                    border:false
                    
                }
                ]
            },
            
            
            
            
            
            {
                region:'center',
                margins:'0 0 0 0',
                margins: '0 0 0 0',
                //layout:'fit',
                contentEl: 'map'
                
  
            }]
        });
    });