Ext.onReady(function () {
     
     var contentPanel = {   
                        id: 'content-panel',                    
                        region: 'center', // this is what makes this panel into a region within the containing layout   
                        border: true,
                        autoScroll: true,
                        bodyCls : 'infoWindow',
                        bodyStyle: 'padding:15px 15px 15px 15px;',            
                        loader : {
                                         url : 'help/' + 'ABC',
                                         loadMask : false,
                                         autoLoad : true // important                     
                                 }                     
                     };   
                     
    var store = Ext.create('Ext.data.TreeStore', {
                    root: {
                        expanded: true
                    },                    
                    proxy: {
                        type: 'ajax',
                        url: 'help/content.json'
                    }
                });  

  
     var treePanel = Ext.create('Ext.tree.Panel', {
                    id: 'tree-panel',
                    title: 'Inside the AMDA',
                    region:'west',
                    split: true,  
                    width: 250,      
                    minSize: 150,
                    rootVisible: false,
                    autoScroll: true,
                    store: store
                });
     
     // Assign loader to be called on tree node click.
                treePanel.getSelectionModel().on('select', function(selModel, record) {
                    if (record.get('leaf')) {                  
                        Ext.getCmp('content-panel').loader.url = 'help/' + record.getId();
                        Ext.getCmp('content-panel').loader.load();                         
                    }
                });                

    var win = Ext.create('Ext.window.Window', {
        width: 800,
        height: 500,
        autoScroll : true,
        minimizable: true,                     
        hidden: false,
        shadow: false,
        maximizable: true,
        title: 'Help: While Demo Tour Is Not Ready ...',
        autoShow: true,
        layout: 'border',
        items: [
                treePanel, 
                contentPanel
                ]
    });
    
    
});