Ext.BLANK_IMAGE_URL = 'resources/images/default/s.gif';  // Ext 2.0
Ext.onReady(function(){
	var toggleTheme = function(){
		Ext.get(document.body, true).toggleClass('xtheme-WTS');
	};
	
	Ext.QuickTips.init();
	
	var GetZoneTip = function(e, inID){
		inID = inID.toString();
		imgMapZoneID = e.getTarget().id;
		iID = imgMapZoneID.substr(10);
		elMapZoneID = Ext.get(imgMapZoneID);
		if (!WTStip) {
			var WTStip = new Ext.ToolTip({
				target: elMapZoneID,
				width: 300,
				autoLoad: {
					url: 'zone.asp?type=Tip&id=' + iID
				},
				//                autoShow: true,
				dismissDelay: 15000 // auto hide after 15 seconds
			});
		}
	}
	
	var tpl = new Ext.XTemplate('<tpl for=".">', '<div class="ZoneDiv">{ZoneID}: {Zone}', '</div>', '</tpl>');
	
	var winList = new Ext.Panel({
		title: 'Select a Zone:',
		id: 'ListOfZones',
		//        layout: 'fit',
		animateTarget: 'layout-win-list',
		renderTo: 'layout-win-list',
		width: 230,
		//		autoHeight: true,
		height: 1000,
		minimizable: false,
		closable: false,
		border: false,
		plain: true,
		autoScroll: true,
		items: new Ext.DataView({
			id: 'dataView1',
			store: new Ext.data.Store({
				proxy: new Ext.data.HttpProxy({
					url: 'zone.asp',
					method: 'GET'
				}),
				baseParams: {
					type: 'ListJSON'
				},
				reader: new Ext.data.JsonReader({
					root: 'Zones',
					fields: ['ZoneID', 'Zone']
				})
			}),
			tpl: tpl,
			autoHeight: true,
			singleSelect: true,
			cls: 'ListOfZones',
			overClass: 'ListOfZones-Over',
			itemSelector: 'div.ZoneDiv'
		})
	});
	Ext.getCmp('dataView1').store.load();
	winList.on('minimize', function(){
		winList.toggleCollapse();
	});
	winList.show();
	var aPos = winList.getPosition(true);
	winList.setPosition(aPos[0], aPos[1] + 375);
	
	
	var GetZone = function(e, inID, inZone){
		inID = inID.toString();
		if (inID.indexOf("http") != -1) { //handle image map
			imgMapZoneID = e.getTarget().id;
			iID = imgMapZoneID.substr(10);
			elMapZoneID = Ext.get(imgMapZoneID);
			sZoneTitle = elMapZoneID.dom.title;
			//sZoneAlt = elMapZoneID.dom.alt;
			//iRegion = sZoneAlt.substr(5);        
		} else {
			iID = inID;
			sZoneTitle = inZone;
		}
		
		
		if (!win) {
			var sHostname = window.location.href;
      /*if (sHostname.indexOf("journeynamibia") != -1) {
        var Site = "JNa";
				var tabs=new Ext.TabPanel({region:'center',id:'thetabs',margins:'3 3 3 0',enableTabScroll:true,defaults:{autoScroll:true},activeTab:0,items:[{title:'Famous for ...',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Famous"},renderer:Ext.Updater.jsonRenderer}},{title:'Accommodation ',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Accommodation"},renderer:Ext.Updater.jsonRenderer}},{title:'Activities',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Activities"},renderer:Ext.Updater.jsonRenderer}},{title:'Services',id:'Services',tbar:['To view services in this zone ',' ',new Ext.form.ComboBox({id:'SubCatDrop'+iID,labelWidth:200,typeAhead:true,fieldLabel:'',labelSeparator:'',emptyText:'Select Service Category . . .',displayField:'SubCat',mode:'local',triggerAction:'all',store:new Ext.data.Store({proxy:new Ext.data.HttpProxy({url:'zone.asp',method:'GET'}),baseParams:{ID:iID,type:'Services',Data:'SubCatDrop'},reader:new Ext.data.JsonReader({root:'SubCats',fields:['SubCatID','SubCat']})})})]}]});
      }else{
        var Site = "WSt";
				var tabs=new Ext.TabPanel({region:'center',id:'thetabs',margins:'3 3 3 0',enableTabScroll:true,defaults:{autoScroll:true},activeTab:0,items:[{title:'Famous for ...',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Famous"},renderer:Ext.Updater.jsonRenderer}},{title:'Accommodation ',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Accommodation"},renderer:Ext.Updater.jsonRenderer}},{title:'Activities',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Activities"},renderer:Ext.Updater.jsonRenderer}},{title:'Services',id:'Services',tbar:['To view services in this zone ',' ',new Ext.form.ComboBox({id:'SubCatDrop'+iID,labelWidth:200,typeAhead:true,fieldLabel:'',labelSeparator:'',emptyText:'Select Service Category . . .',displayField:'SubCat',mode:'local',triggerAction:'all',store:new Ext.data.Store({proxy:new Ext.data.HttpProxy({url:'zone.asp',method:'GET'}),baseParams:{ID:iID,type:'Services',Data:'SubCatDrop'},reader:new Ext.data.JsonReader({root:'SubCats',fields:['SubCatID','SubCat']})})})]},{title:'Distances',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Distances"},renderer:Ext.Updater.jsonRenderer}}]});
			}*/
			var tabs=new Ext.TabPanel({region:'center',id:'thetabs',margins:'3 3 3 0',enableTabScroll:true,defaults:{autoScroll:true},activeTab:0,items:[{title:'Famous for ...',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Famous"},renderer:Ext.Updater.jsonRenderer}},{title:'Accommodation ',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Accommodation"},renderer:Ext.Updater.jsonRenderer}},{title:'Activities',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Activities"},renderer:Ext.Updater.jsonRenderer}},{title:'Services',id:'Services',tbar:['To view services in this zone ',' ',new Ext.form.ComboBox({id:'SubCatDrop'+iID,labelWidth:200,typeAhead:true,fieldLabel:'',labelSeparator:'',emptyText:'Select Service Category . . .',displayField:'SubCat',mode:'local',triggerAction:'all',store:new Ext.data.Store({proxy:new Ext.data.HttpProxy({url:'zone.asp',method:'GET'}),baseParams:{ID:iID,type:'Services',Data:'SubCatDrop'},reader:new Ext.data.JsonReader({root:'SubCats',fields:['SubCatID','SubCat']})})})]},{title:'Distances',autoLoad:{url:"zone.asp",method:'GET',params:{id:iID,type:"Distances"},renderer:Ext.Updater.jsonRenderer}}]});
			
			
			Ext.getCmp('SubCatDrop' + iID).store.load();
			
			var win = new Ext.Window({
				title: 'Zone ' + sZoneTitle,
				closable: false,
				width: 500,
				height: 470,
				minimizable: true,
				border: false,
				plain: true,
				layout: 'border',
				defaults: { //                    bodyStyle: 'padding:2px;'
}				,
				buttons: [{
					text: 'View Interactive Map',
					handler: function(){
						var sHostname = window.location.hostname;
						if (sHostname.indexOf("192.168.0.2") != -1) {
							var sLiveURL = "http://192.168.0.2/wheretostay/";
						} else 
							if (sHostname.indexOf("wadns.net") != -1) {
								var sLiveURL = "http://wheretostay.na.wadns.net/";
							} else {
								var sLiveURL = "";
							}
						window.location = sLiveURL + "default.asp?region=26&subcategory=0&p=searchAccom&mapautoload=1";
					}
				}, {
					text: 'Close',
					handler: function(){
						win.hide();
					}
				}],
				items: [tabs]
			});
			win.on('minimize', function(){
				win.toggleCollapse();
			});
			win.show();
		};
		var _SubCatDrop = Ext.getCmp('SubCatDrop' + iID);
		//        if (_SubCatDrop) {
		_SubCatDrop.on('select', function(o, record, index){
			var iSubCatID = record.get('SubCatID');
			Ext.getCmp('Services').load({
				url: "zone.asp",
				method: 'GET',
				params: {
					ID: iID,
					SubCatID: iSubCatID,
					type: "Services"
				},
				discardUrl: true,
				nocache: true,
				text: "Loading...",
				timeout: 60,
				scripts: false // Save time by avoiding RegExp execution.
			});
		});
		//      }
	};
	
	var imgMapZone1 = Ext.select("map[name='Zones1']");
	imgMapZone1.on('click', GetZone);
	//    imgMapZone1.on('mouseover', GetZoneTip);
	
	dataView1 = Ext.getCmp('dataView1');
	dataView1.on('click', function(dview, index, node, event){
		var record = dview.store.getAt(index);
		iZoneID = record.get('ZoneID');
		sZone = record.get('Zone');
		GetZone(0, iZoneID, sZone);
	});
});

function addTab(tabTitle, targetUrl){
	Ext.getCmp('thetabs').add({
		title: tabTitle,
		iconCls: "tabs",
		autoLoad: {
			url: targetUrl
		},
		closable: true
	}).show();
}