Ext.onReady(function(){
    var menu = new Ext.menu.Menu({
        id: 'mainMenu',
        items: [
				{				
				icon: 'dependentfiles/images/icon/aboutme2.jpg',	
                text: 'About Me',
                menu: {        // <-- submenu by nested config object
                    items: [
	                       		// stick any markup in a menu
		                        '<b class="menu-title">Choose Any</b>',
        		               {text: 'OverView', handler: onItemClick},
                		       {icon: 'dependentfiles/images/icon/diary.jpg',text: 'Diary', handler: onItemClick},
    		                   {
            		           	icon: 'dependentfiles/images/icon/careers.jpg',
            		           	text: 'Careers', 
                    		   	menu:{
                       					items:[
                       							{icon: 'dependentfiles/images/icon/courses4.jpg',text: 'Courses', handler: onItemClick},
                       							{icon: 'dependentfiles/images/icon/resume.jpg',text: 'Resume', handler: onItemClick}
                       						]
                       				}
                       			}                       
                    		]
                		}
            	},
				{icon: 'dependentfiles/images/icon/project.jpg', text: 'Projects',handler: onItemClick},
            	{icon: 'dependentfiles/images/icon/notes4.jpg', text: 'Notes',handler: onItemClick},
            	{icon: 'dependentfiles/images/icon/tools.jpg', text: 'Tools',
		                menu: {        // <-- submenu by nested config object
		                    items: [
			    		               {icon: 'dependentfiles/images/icon/calc.jpg',text: 'Calc', handler: onItemClick},
		                		       {icon: 'dependentfiles/images/icon/calc2.jpg',text: 'EMI Calc', handler: onItemClick},
		                		       {icon: 'dependentfiles/images/icon/sqleditor.jpg',text: 'SQL Editor', handler: onItemClick},
		                		       {icon: 'dependentfiles/images/icon/Logo.png',text: 'HTML Color Code', handler: onItemClick}
		                    		]
		                		}
            	},
            	{icon: 'dependentfiles/images/icon/games3.jpg', text: 'Games',handler: onItemClick},
            	{icon: 'dependentfiles/images/icon/album4.jpg', text: 'Album',
		                menu: {        // <-- submenu by nested config object
		                    items: [
			    		               {icon: 'dependentfiles/images/icon/album.jpg',text: 'Personal', handler: onItemClick},
		                		       {icon: 'dependentfiles/images/icon/pencilsketch.jpg',text: 'Pencil Sketch', handler: onItemClick},
		                		       {icon: 'dependentfiles/images/icon/album3.jpg',text: 'WallPapers', handler: onItemClick}
		                    		]
		                		}
            	},
            	{icon: 'dependentfiles/images/icon/cdfolder2.jpg', text: 'CD Folder',handler: onItemClick}
        		]
    });

	 var htPageLinks = new Hashtable();
        htPageLinks.put("OverView","/aboutme/overview.php");
        htPageLinks.put("Diary","/aboutme/diary/diary.php");
        htPageLinks.put("Courses","/aboutme/careers/courses.php");
        htPageLinks.put("Resume","/aboutme/careers/resume.php");
        htPageLinks.put("Projects","/projects/projects.php");
		htPageLinks.put("Notes","/notes/notes2.php");
		htPageLinks.put("Calc","/tools/calc/scicalc.php");
		htPageLinks.put("EMI Calc","/tools/calc/emi.php");
		htPageLinks.put("SQL Editor","/tools/sqleditor.php");
		htPageLinks.put("HTML Color Code","/tools/htmlcolorcode.php");
		htPageLinks.put("Games","/games/chess.php");
		htPageLinks.put("Personal","/aboutme/album/personal.php");
		htPageLinks.put("Pencil Sketch","/aboutme/album/sketch.php");
		htPageLinks.put("WallPapers","/aboutme/album/sketch.php");
		htPageLinks.put("CD Folder","/software/cd/browsecd.php");
		
	   	var htSearchLinks = new Hashtable();
    	htSearchLinks.put("Google.com","http://www.google.com/search?q=");
    	htSearchLinks.put("Yahoo.com","http://search.yahoo.com/search?p=");
    	htSearchLinks.put("Dictionary.com","http://dictionary.reference.com/browse/");
    	htSearchLinks.put("m-w.com","http://www.m-w.com/dictionary/");
    	htSearchLinks.put("Esnips.com","http://esnips.com/_t_/");
    	htSearchLinks.put("isoHunt.com","http://www.isohunt.com/torrents/?ihq=");
    	htSearchLinks.put("piratebay.org","http://thepiratebay.org/search/");
	
		
    var tb = new Ext.Toolbar('toolbar');
    tb.add({
            cls: 'x-btn-text-icon blist', // icon and text class
            text:'Start',            
            menu: menu  // assign menu by instance
        	}
           );

    // items can easily be looked up
    menu.add({
        text: 'Comming Soon',
        id: 'disableMe'  // <-- Items can also have an id for easy lookup
        // disabled: true   <-- allowed but for sake of example we use long way below
    });
    // access items by id or index
    menu.items.get('disableMe').disable();
	tb.addSeparator();
	// add a combobox to the toolbar
    var searchEngine = new Ext.data.SimpleStore({
        fields: ['abbr', 'searchEngine'],
        data : Ext.exampledata.states 
    });
	var combo = new Ext.form.ComboBox({
        store: searchEngine,
        displayField:'searchEngine',
        typeAhead: true,
        mode: 'local',
        triggerAction: 'all',
        emptyText:'S e a r c h  E n g i n e',
        selectOnFocus:true,
        width:135
    });
    tb.addField(combo);
    
    var inputSearchTxt = new Ext.form.TextField({
    							emptyText:'S e a r c h  T e x t . . .',
    							selectOnFocus:true
    						});
	tb.addField(inputSearchTxt);  	
	tb.add({            
            text:'Go',
            handler: onButtonClick
        	}
           );
     tb.addSeparator();      

            var page = window.location.href.split('#')[1];
            if(!page){
                page = '/pages/php/aboutme/overview.php';
            }
            loadDoc(page);
            // safari and opera have iframe sizing issue, relayout fixes it
			if(Ext.isSafari || Ext.isOpera){
				layout.layout();
			}
			
    // functions to display feedback
    function onButtonClick(btn){
        //Ext.example.msg('Button Click','You clicked the "{0}" button.', btn.text);        
        searchURL ="";
        if(btn.text=="Go" && combo.value && inputSearchTxt.getValue())
        {
        	searchURL = htSearchLinks.get(combo.value)+ inputSearchTxt.getValue();        
        }
        
        if(!searchURL || searchURL=="undefined"){
                searchURL = '/pages/php/aboutme/overview.php';
            }
        loadDoc(searchURL);
    }

    function onItemClick(item){
        //Ext.example.msg('Menu Click', 'You clicked the "{0}" menu item.', item.text);        
        pageLink = htPageLinks.get(item.text);
        if(!pageLink){
             pageLink = '/aboutme/overview.php';
        }        
        changeBanner('/template/banner'+ pageLink)
        loadDoc('/pages/php'+ pageLink); 
               
    }

    function onItemCheck(item, checked){
        Ext.example.msg('Item Check', 'You {1} the "{0}" menu item.', item.text, checked ? 'checked' : 'unchecked');
    }

    function onItemToggle(item, pressed){
        Ext.example.msg('Button Toggled', 'Button "{0}" was toggled to {1}.', item.text, pressed);
    }
    
    function loadDoc(url){
            Ext.get('bodyDiv').dom.src = url;
        }
			
});