// JavaScript Document
function selectToursTab() {
	var deststab = document.getElementById('destinationstab');
	deststab.style.backgroundColor = "#818181";
	deststab.style.backgroundImage = 'none';
	deststab.onclick = selectDestinationsTab;
	deststab.style.cursor = "pointer";
	deststab.style.color = "#FFF";
	
	var tourstab = document.getElementById('tourstab');
	tourstab.style.backgroundColor = 'transparent';
	tourstab.style.backgroundImage = 'url(imgs/mappattern.png)';
	tourstab.style.cursor = "default";
	tourstab.style.color = "#4D4D4D";
	
	document.getElementById('midtabsimg').src = 'imgs/tourdestcorners.png';	
	document.getElementById('tourcornerimg').src = "imgs/tourcorner.png";
	document.getElementById('destscornerimg').src = "imgs/destcorner.png";
	
	changeMapTo('tours');
	
	document.getElementById('advancedSearch').innerHTML = '<a href="javascript:toggleAdvancedSearch();">advanced search</a>&nbsp;';
	document.getElementById('tourssearchform').action = "searchTours.php";
}

function selectDestinationsTab() {
	var tourstab = document.getElementById('tourstab');
	tourstab.style.backgroundColor = "#818181";
	tourstab.style.backgroundImage = 'none';
	tourstab.onclick = selectToursTab;
	tourstab.style.cursor = "pointer";
	tourstab.style.color = "#FFF";
	
	var deststab = document.getElementById('destinationstab');
	deststab.style.backgroundColor = 'transparent';
	deststab.style.backgroundImage = 'url(imgs/mappattern.png)';
	deststab.style.backgroundPosition = 'left -5px';
	deststab.style.cursor = "default";
	deststab.style.color = "#4D4D4D";
	
	document.getElementById('midtabsimg').src = 'imgs/tourdestcorners2.png';	
	document.getElementById('tourcornerimg').src = "imgs/tourcorner2.png";
	document.getElementById('destscornerimg').src = "imgs/destcorner2.png";
	
	changeMapTo('destinations');
	
	document.getElementById('advancedSearch').innerHTML = '';
	document.getElementById('tourssearchform').action = "searchSite.php";
}

function changeMapTo(s) {
	var map = null;
	 if (navigator.appName.indexOf("Microsoft") != -1) {
		 map = window['interactiveMap'];
	 } else {
		 map = document['interactiveMap'];
	 }
	 if (map != null && map.changeMapTo != null) {
		 map.changeMapTo(s);
	 }  	
}

function mapElementOver(e) {
	var sideInfo = document.getElementById('mapSideInfo');
	var map = document.getElementById('map');
	
	if (!sideInfo) {
		sideInfo = document.createElement('div');
		sideInfo.id = "mapSideInfo";
		sideInfo.style.visibility = "hidden";
		
		sideInfoTitle = document.createElement('div');
		sideInfoTitle.id = "mapSideInfoTitle";
		sideInfo.appendChild(sideInfoTitle);
		
		sideInfoContent = document.createElement('div');
		sideInfoContent.id = "mapSideInfoContent";
		sideInfo.appendChild(sideInfoContent);
		
		map.appendChild(sideInfo);
	} else {
		sideInfoTitle = document.getElementById('mapSideInfoTitle');
		sideInfoContent = document.getElementById('mapSideInfoContent');
	}
	
	var title = new Array();
	title['norte'] = 'Porto & North';
	title['beira'] = 'Central Portugal';
	title['lisboa'] = 'Lisbon Region';
	title['alentejo'] = 'Alentejo';
	title['algarve'] = 'Algarve';
	title['norteBtn'] = 'Porto & North';
	title['centerBtn'] = 'Central Portugal';
	title['lisbonBtn'] = 'Lisbon Region';
	title['alentejoBtn'] = 'Alentejo';
	title['algarveBtn'] = 'Algarve';
	title['portugal'] = 'All Portugal';
	title['historico'] = 'History & Heritage';
	title['passeio'] = 'Active Holidays';
	title['natural'] = 'Natural Beauty';
	title['praia'] = 'Beach Quest';
	title['diversao'] = 'Time for Ourselves';
	title['gastro'] = 'Gastronomy & Wines';
	title['senior'] = 'Senior';
	title['familia'] = 'Family & Kids';
	title['religiao'] = 'Religion';
	title['pousadas'] = 'Pousadas de Portugal&trade;';
	title['golf'] = 'Golf';
	
	var imgs = new Array();
	imgs['norte'] = 'imgs/mapNorth.jpg';
	imgs['beira'] = 'imgs/mapCenter.jpg';
	imgs['lisboa'] = 'imgs/mapLisbon.jpg';
	imgs['alentejo'] = 'imgs/mapAlentejo.jpg';
	imgs['algarve'] = 'imgs/mapAlgarve.jpg';
	imgs['norteBtn'] = 'imgs/mapNorth.jpg';
	imgs['centerBtn'] = 'imgs/mapCenter.jpg';
	imgs['lisbonBtn'] = 'imgs/mapLisbon.jpg';
	imgs['alentejoBtn'] = 'imgs/mapAlentejo.jpg';
	imgs['algarveBtn'] = 'imgs/mapAlgarve.jpg';
	imgs['portugal'] = 'imgs/mapAllPortugal.jpg';
	imgs['historico'] = 'imgs/mapHistory&Heritage.jpg';
	imgs['passeio'] = 'imgs/mapActiveHolidays.jpg';
	imgs['natural'] = 'imgs/mapNaturalBeauty.jpg';
	imgs['praia'] = 'imgs/mapBeachQuest.jpg';
	imgs['diversao'] = 'imgs/mapTimeForOurselves.jpg';
	imgs['gastro'] = 'imgs/mapGastronomy&Wines.jpg';
	imgs['senior'] = 'imgs/mapNone.jpg';
	imgs['familia'] = 'imgs/mapFamily&Kids.jpg';
	imgs['religiao'] = 'imgs/mapReligion.jpg';
	imgs['pousadas'] = 'imgs/mapPousadas.jpg';
	imgs['golf'] = 'imgs/mapGolf.jpg';
	
	sideInfoTitle.innerHTML = title[e];
	sideInfoContent.innerHTML = "<img src='"+imgs[e]+"' />";
	
	var searchForm = document.getElementById('tourssearchform');
	var x = searchForm.offsetLeft + searchForm.offsetWidth;
  	var y = searchForm.offsetTop + searchForm.offsetHeight;
	
	// dealing with parents offsets
	var parent = searchForm;
	while (parent.offsetParent) {
		parent = parent.offsetParent;
		x += parent.offsetLeft;
		y += parent.offsetTop ;
	}
	
	sideInfo.style.left = x + "px";
	sideInfo.style.top = y + "px";
	sideInfo.style.visibility = "visible";
}

function mapElementOut(e) {
	var sideInfo = document.getElementById('mapSideInfo');
	if (sideInfo) {
		sideInfo.style.visibility = "hidden";
	}
}

function toggleAdvancedSearch() {
	var asBox = document.getElementById('advancedSearchBox');
	var map = document.getElementById('map');
	
	if (!asBox) {
		asBox = document.createElement('div');
		asBox.id = 'advancedSearchBox';
		
		asBox.innerHTML = '<table width="240px" cellpadding="0px" cellspacing="0px">\
    							<tr height="24px">\
        							<td width="15px"><img src="imgs/tourcorner2.png" /></td>\
            						<td id="advancedSearchTitle" width="150px">ADVANCED SEARCH</td>\
									<td id="advancedSearchClose" width="60px"><a href="javascript:closeAdvancedSearch();">CLOSE</a></td>\
						            <td width="15px"><img src="imgs/destcorner.png" /></td>\
								</tr>\
							</table>\
							<div id="advancedSearchContent">\
								<div class="advancedSearchContentRow">&nbsp;</div>\
								<div class="advancedSearchContentRow">\
									<div class="advancedSearchOptionLabel">Price</div>\
									<div class="advancedSearchOptionValue">\
										<select name="priceRange" id="advancedSearchPriceRangeList" style="width: 130px">\
											<option value="0">All</option>\
											<option value="0-300">&lt; €300</option>\
											<option value="300-600">€300 - €600</option>\
											<option value="600-1000">€600 - €1000</option>\
											<option value="1000-2000">€1000 - €2000</option>\
											<option value="2000-999999">&gt; €2000</option>\
										</select>\
									</div>\
								</div>\
								<div class="advancedSearchContentRow">\
									<div class="advancedSearchOptionLabel">Zone</div>\
									<div class="advancedSearchOptionValue">\
										<select name="region" id="advancedSearchRegionsList" style="width: 130px">\
											<option value="0">All</option>\
										</select>\
									</div>\
								</div>\
								<div class="advancedSearchContentRow">\
									<div class="advancedSearchOptionLabel">Category</div>\
									<div class="advancedSearchOptionValue">\
										<select name="category" id="advancedSearchCategoriesList" style="width: 130px">\
											<option value="0">All</option>\
										</select>\
									</div>\
								</div>\
								<div class="advancedSearchContentRow">\
									<div class="advancedSearchOptionLabel">Duration</div>\
									<div class="advancedSearchOptionValue">\
										<select name="duration" id="advancedSearchDurationList" style="width: 130px">\
											<option value="0">All</option>\
											<option value="0-4">&lt; 5 days</option>\
											<option value="5-8">5-8 days</option>\
											<option value="8-15">8-15 days</option>\
											<option value="15-9999">&gt; 15 days</option>\
										</select>\
									</div>\
								</div>\
								<div id="advancedSearchButtonRow">\
									&nbsp;<input type="submit" value="Search" onclick="advancedSearchSubmit();"/>\
								</div>\
							</div>\
							<table width="240px" cellpadding="0px" cellspacing="0px">\
    							<tr height="15px">\
        							<td width="15px"><img src="imgs/asBottomLeftCorner.png" /></td>\
            						<td id="advancedSearchFooter" width="210px"></td>\
						            <td width="15px"><img src="imgs/asBottomRightCorner.png" /></td>\
								</tr>\
							</table>';
		
		map.appendChild(asBox);
		regionsList = document.getElementById('advancedSearchRegionsList');
		for (var i = 0; i < regionsNames.length; i++) {
			regionsList.options[i+1] = new Option(regionsNames[i], regionsIds[i], false, false);
		}
		
		themesList = document.getElementById('advancedSearchCategoriesList');
		for (var i = 0; i < themesNames.length; i++) { 
			themesList.options[i+1] = new Option(themesNames[i], themesNames[i].replace('&', 'and'), false, false);														  
		}
	} else {
		asBox.style.visibility = "visible";
	}
	
	var x = map.offsetLeft + map.offsetWidth;
  	var y = map.offsetTop;
	
	// dealing with parents offsets
	var parent = map;
	while (parent.offsetParent) {
		parent = parent.offsetParent;
		x += parent.offsetLeft;
		y += parent.offsetTop ;
	}
	
	asBox.style.left = x + 5 + "px";
	asBox.style.top = y + "px";
}

function closeAdvancedSearch() {
	var asBox = document.getElementById('advancedSearchBox');
	if (asBox) {
		asBox.style.visibility = "hidden";
	}
}

function advancedSearchSubmit() {
	var pricesList = document.getElementById('advancedSearchPriceRangeList');
	document.getElementById('advancedSearchPriceRange').value = pricesList.options[pricesList.selectedIndex].value;
	
	var regionsList = document.getElementById('advancedSearchRegionsList');
	document.getElementById('advancedSearchRegion').value = regionsList.options[regionsList.selectedIndex].value;
	
	var categories = document.getElementById('advancedSearchCategoriesList');
	document.getElementById('advancedSearchCategory').value = categories.options[categories.selectedIndex].value;
	
	var durationList = document.getElementById('advancedSearchDurationList');
	document.getElementById('advancedSearchDuration').value = durationList.options[durationList.selectedIndex].value;
	
	document.getElementById('tourssearchform').submit();
	
}

function searchFieldFocus(e) {
	if (e.value == 'search')
		e.value = "";
}