var MINZF=1;
var MAXZF=18;
var CZF=2;
var DZF=3;
var RZF=6;
var AZF=12;
var MDZF=8;
var DMG="Destinations";
var RMG="Resorts";
var AMG="Accommodation";
var MH=19;
var MW=25;

var enableResortMarkerKeyIcon;
var enableAccommMarkerKeyIcon;

var resMarker;
var accommMarker;
var resortZoomInLink;
var accommZoomInLink;


var pzw;
var lw;
var mtw;
var di;
var ri;
var ai;
var ed;
var mc;
var rmo;
var mapDispalyText;
var markerSearcher;
var rfs = ['client_id', 'repository_id','name', 'url','video_source','type','image_url','street', 'town','type','pc', 'lat', 'lon'];

var xmlreqs = new Array();
var clickedMarker;


function zTL(lat,lon,zoomFactor){
	mv.setZoomFactor(zoomFactor);
	mv.goToPosition(new MMLatLon(lat,lon));
	mv.setMappingAPI( 'virtualearth' );
}

function aS(itemType, repositoryId){
	var formInput = document.getElementById('zoomFactor');
	formInput.value=mv.getZoomFactor();
	var currentPosition=mv.getMapBounds().getCenter();
	formInput=document.getElementById('centrePositionLatitude');
	formInput.value=currentPosition.lat;
	formInput=document.getElementById('centrePositionLongitude');
	formInput.value=currentPosition.lon;
	formInput=document.getElementById('declutteringEnabled');
	formInput.value=ed;formInput=document.getElementById('usingMap');
	formInput.value='true';
	var submitButton=document.getElementById('submitButton');
	submitButton.value=repositoryId + '*' + itemType + '*/destinations';
	submitButton.click();
}

function queryForMarkers(){
    
    
    
    markerSearcher = MMFactory.createSearchRequester( displayResults );
    var search = new MMSearch(); 
    search.return_fields = rfs;
    search.count=10000;
    
    var bounds = mv.getMapBounds();
    
    var centerPoint = mv.getMapBounds().getCenter();
    search.point = centerPoint;
    search.bounding_box = mv.getMapBounds();
    
    //We want to search for markers arounds the center point. This however only will return all markers whether a record is a destination.
    //resort or accommodation therefore filters need to be applied so the correct records are returned, e.g.- destinations for destination level
    search.filters = new Array();
    var zf=mv.getZoomFactor();
    
    var findMarkers = false;
	
	if(zf>=DZF && zf<RZF){
		search.filters.push(new MMSearchFilter('type', 'equals', 'destination'));
		findMarkers = true;
	}
	if(zf>=RZF && zf<=14){
		search.filters.push(new MMSearchFilter('type', 'equals', 'resort'));	
	    findMarkers = true;
		
	}
	//Note because resort  markers are to be displayed from zoom levels 12 to 14 with accomm markers the filter msut be modified for this
	if(zf>=AZF && zf<=17){
		if(search.filters.length>0){
			search.logic = 'OR'; 
		}
		findMarkers = true;
		
		search.filters.push(new MMSearchFilter('type', 'equals', 'accommodation'));	
				
	}
	
	//If we are not at the correct zoom level then do not bother searching
	if(!findMarkers){
		return;
	}
	
    markerSearcher.search( search );
}

function displayResults(){

	// If an error code has been produced, display the explanation:
	if ( markerSearcher.error_code ) {
		var err =  '';
		if ( markerSearcher.error_explanation ) {
		    err =  markerSearcher.error_explanation;
		} else {
		    err =  'Your request failed. Error code: ' + markerSearcher.error_code;
		}
	    var errorDiv = document.getElementById('errorMessage');
	    errorDiv.innerHTML=err;
		return;
	}

	if(!markerSearcher.record_sets){
		return;
	}

	// Loop through each record set:
	for ( var count=0, l = markerSearcher.record_sets.length; count < l; count++ ) {

		// If an error was returned for the record set, display details and return:
		if ( markerSearcher.record_sets[count].error ) {
		    var err =  '';
		    if ( markerSearcher.record_sets[count].error.error_explanation ) {
			err =  markerSearcher.record_sets[count].error.error_explanation;
		    } else {
			err =  'Your request failed. Error code: ' + markerSearcher.record_sets[count].error.error_code;
		    }
		    var errorDiv = document.getElementById('errorMessage');
		    errorDiv.innerHTML=err;
		    return;  
		}

		// If not, check to see if individual records have been returned:
		if ( markerSearcher.record_sets[count].records ) {
		    // Loop through each record in the record set, and add it to the list below the map,
		    //  and populate the infobox text:           
		    for (var record_count = 0, rl = markerSearcher.record_sets[count].records.length; record_count < rl; record_count++ ) {
				var record = markerSearcher.record_sets[count].records[record_count]; 
				var name=record['name'];
				
				var iconType;
				if(record['type'] == 'destination'){
					iconType=di;
				}
				else if(record['type'] =='resort'){
					iconType=ri;
				}
				else if(record['type'] =='accommodation'){
					
					iconType=ai;
				}
				
				var marker=mv.createMarker( record.point, {'label': record['name'], 'icon':iconType} );	 
				marker.setAttribute('repositoryId',record['repository_id']);
				marker.setAttribute('itemType',record['type']);  					
				
		    }
		}
	}
}


function up(){
	
	var checkedValue=document.getElementById( 'toggleDeclutteringCheckBox' ).checked;
	if(ed!=checkedValue){
		ed=checkedValue;
		if(ed){
			mv.declutterGroup(DMG,{},MM_DECLUTTER_GRID );
			mv.declutterGroup(RMG,{},MM_DECLUTTER_GRID,MM_CLUSTER_ACCURATE );
			mv.declutterGroup(AMG,{},MM_DECLUTTER_GRID,MM_CLUSTER_ACCURATE );

		}
		else{
			mv.declutterGroup(DMG,{},MM_DECLUTTER_NONE );
			mv.declutterGroup(RMG,{},MM_DECLUTTER_NONE );
			mv.declutterGroup(AMG,{},MM_DECLUTTER_NONE );
		}
	}
}

function loadMap(){
	if(MMIsSupportedBrowser()){
		mv = MMFactory.createViewer( document.getElementById('mapViewer'), MM_WORLD_MAP );
		mv.goToPosition( new MMLatLon( 42.3508, -71.0717 ),CZF );
		mv.resize(660,410);
		mv.setAllowedZoomFactors(MINZF, MAXZF);
		mv.setOption('mousewheel:wheelup',"zoomin");
		mv.setOption('mousewheel:wheeldown',"zoomout");
		rmo=false;
		createMarkerIcons();
		addWidgets();
		addExtraControls();
		addEventHandlers();
		ed=false;
		
		enableResortMarkerKeyIcon = false;
		enableAccommMarkerKeyIcon = false;
		
		resMarker = document.getElementById('resmarker');
		accommMarker= document.getElementById('accommmarker');;
		resortZoomInLink= document.getElementById('resortZoomInLink');
		accommZoomInLink= document.getElementById('accommZoomInLink');
		
		mapDispalyText='Click the "declutter" tick-box to ensure you see all markers in a destination, as some that are very close together may be hidden behind one another.<br/><br/>Use the arrow buttons on the map to move around and see more   resorts in the destination you are looking at, or click the plus and minus buttons to zoom in and out.';
		mv.setMappingAPI( 'virtualearth' );
		reverseDataPrefs(MM_WORLD_MAP);
	} else{
		container=document.getElementById ('mv');
		container.innerHTML='<div class="error">Sorry! Your browser is not supported by the Multimap API. Please use the drop down box to select your Destination.</div>';
	}
}
	

function addWidgets(){

	pzw = new MMPanZoomWidget();
	mv.addWidget(pzw);
	
	lw=new MMLocationWidget (undefined,new MMBox());
	lw.setContainer(document.getElementById('locationWidgetContainer'));
	mtw=new MMMapTypeWidget();
	mv.addWidget(mtw);
}

function addExtraControls(){
	var controlsElement=document.getElementById('extraControls');
	var innerHTML='<div id="destinationkey">'
	+ '<ul><li id="first"><strong>Marker key</strong>:</li>'
	+ '<li id="desmarker">Destination</li>'
	+ '<li id="resmarker">Resort/Cities</li>'
	+ '<li id="accommmarker">Accommodations</li>'	
	+ '</ul>'
	+ '<div id="desInfo">Please <a id="accommZoomInLink" href="#" onclick="changeMapPosition();mv.setZoomFactor(RZF);">zoom in for resort</a> information </div>'
	+ '<div id="resInfo">Please <a id="resortZoomInLink" href="#" onclick="mv.setZoomFactor(AZF);">zoom in for accommodation</a> information</div>'
	+ '<div id="accommInfo">Please note that not all of our properties can be seen on the map just yet but these are being added daily and will be completed very soon.</div>'
	+ '<div class="clear"></div>'
	+ '<div class="divider"></div>'
	+ '<div id="displayo"><strong>Map Display Options</strong>'
	+ '<div>Zoom to display: <select id="zfs" onchange="mv.setZoomFactor(Number(this.options[this.selectedIndex].value))">'
	+ '<option value= CZF >Continents</option>'
	+ '<option value=' + DZF + '>Destinations</option>'
	+ '<option value=' + RZF + '>Resorts</option>'
	+ '<option value=' + AZF + '>Accommodations</option>'
	+ '<option value=' + MDZF + '>More detail</option>'
	+  '</select></div>'
	+ '<div><input type="checkbox" id="toggleDeclutteringCheckBox" onClick="up();" />Declutter marker display on Map  <a href="javascript:void(0);" class="mc-roll">info<span class="contain rmReq"><span class="headRoll">Decluttering</span><span class="roll-cont"><span class="gradCont">The Declutter function spreads out all the markers on the map, so if two are located very close together, or directly on top of each other, it is easier to see them both, although they no longer point to their exact location.  If you would like to see all the markers in a destination, tick the declutter box.</span></span><span class="footRoll"></span></span></a></div>'+'<div class="floatleft"><a href="#" onClick="javascript:print();return false;">Print Map</a></div>'
	+'<div class="clear"></div></div>';
	controlsElement.innerHTML=innerHTML;
}

function createMarkerIcons(){
	di=new MMIcon('/images/browse/mmicon-destination.png');
	di.iconSize=new MMDimensions(MH,MH);
	di.iconAnchor=new MMPoint(9.5,19);
	di.groupName  = DMG;
	ri=new MMIcon('/images/browse/mmicon-resort.png');
	ri.iconSize=new MMDimensions(MH,MH);
	ri.iconAnchor=new MMPoint(9.5,19);
	ri.groupName =RMG;
	ai=new MMIcon('/images/browse/mmicon-accommodation.png');
	ai.iconSize=new MMDimensions(MH,MW);
	ai.iconAnchor=new MMPoint(9.5,25);
	ai.groupName =AMG;
	
	
	/*var declutterIcon = new MMIcon('/images/browse/mmicon-destination-cluster.png');
	declutterIcon.iconSize = new MMDimensions( 9.5, 19 );
	
	mv.declutterGroup(DMG,{ 'cluster_icon' : declutterIcon } );
	mv.declutterGroup(RMG,{ 'cluster_icon' : declutterIcon } );
	mv.declutterGroup(AMG,{ 'cluster_icon' : declutterIcon } );*/
	
}


function  addEventHandlers(){
	mv.addEventHandler('click', onClick);
	mv.addEventHandler ('changeZoom', onChangeZoom);
	mv.addEventHandler ('endPan', endPan);
	mv.addEventHandler ('endMouseDrag', endMouseDrag);
	

}

function onClick(type,target,position){
	
	var zoomFactor=mv.getZoomFactor();
	if(zoomFactor==CZF){
			mv.setZoomFactor(DZF);
			mv.goToPosition(position);	
		    mv.setMappingAPI( 'virtualearth' );
		    queryForMarkers();	
		    						
	}
	if(target instanceof MMMarkerOverlay){
		//Get the geocde of the marker
		var geocode = target.getPosition().coords;
		
		clickedMarker = target;
		
         var requestStr = '';
         //requestStr = 'itemType=' + target.getAttribute['repositoryId'];
         requestStr = 'itemType=' + target.getAttribute('itemType');
         requestStr += '&repositoryId=' + target.getAttribute('repositoryId');			
         	

	xmlreqPOST('/browse/getMarkerItem.jsp',requestStr);
					
	}

}
function onChangeZoom (type,target,oldZoom,newZoom ) {
	mv.removeAllOverlays();
	var zfs=document.getElementById('zfs');
	for( var i=0,l=zfs.options.length;i<l;++i) {
		if(zfs.options[i].value==newZoom) {
			zfs.selectedIndex=i;
		}
	}
	
	if(newZoom >=RZF &&newZoom <=10){
		var tda=document.getElementById('textDisplayArea');
		tda.innerHTML=mapDispalyText;
	}

	if(newZoom>DZF){
		mv.addWidget(lw);
	} else if(newZoom<=DZF){
		mv.removeWidget(lw);
		var tda=document.getElementById('textDisplayArea');
		tda.innerHTML='';
	}
	
	//Colour the icon for resorts on the map key if at the correct level
	if(newZoom >= RZF && !enableResortMarkerKeyIcon){
	
		document.getElementById('desInfo').style.visibility = 'hidden';
		resMarker.style.background = 'transparent url(/images/browse/resort_marker.gif) no-repeat scroll 0%';
		enableResortMarkerKeyIcon = true;
		changeMapPosition();
	}
	//Grey out the resort key icon if you go beklow resort level and add link
	else if(newZoom < RZF && enableResortMarkerKeyIcon){
		document.getElementById('desInfo').style.visibility= 'visible';
		resMarker.style.background = 'transparent url(/images/browse/res-grey.gif) no-repeat scroll 0%';
		enableResortMarkerKeyIcon = false;	
	}
	
	//Colour the icon for accommodations on the map key if at the correct level
	if(newZoom >= AZF && !enableAccommMarkerKeyIcon){
		document.getElementById('resInfo').style.visibility = 'hidden';
		accommMarker.style.background = 'transparent url(/images/browse/accommodation_marker.gif) no-repeat scroll 0%';	
		enableAccommMarkerKeyIcon = true;
	}	
	//Grey out the accommodation key icon if you go below accommodation level and add link
	else if(newZoom < AZF && enableAccommMarkerKeyIcon){
		document.getElementById('resInfo').style.visibility  = 'visible';
		accommMarker.style.background = 'transparent url(/images/browse/accomm-grey.gif) no-repeat scroll 0%';
		enableAccommMarkerKeyIcon = false;	
	}
	
	queryForMarkers();
}

function endPan(type,target,startPos,endPos,reason){
	queryForMarkers();
}

function endMouseDrag(type,target,distance){
	queryForMarkers();
}


//AJAX functions

function CXMLReq(freed) { 
	this.freed = freed; 
	this.xmlhttp = false; 
	if (window.XMLHttpRequest) { 
		this.xmlhttp = new XMLHttpRequest(); 
	} else if (window.ActiveXObject) { 
		this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
	} 
} 

function xmlreqPOST(url,data) { 
	var pos = -1; 
	for (var i=0; i<xmlreqs.length; i++) { 
		if (xmlreqs[i].freed == 1) { 
			pos = i; 
			break; 
		} 
	} 
	
	if (pos == -1) { 
		pos = xmlreqs.length; 
		xmlreqs[pos] = new CXMLReq(1); 
	} 
	if (xmlreqs[pos].xmlhttp) { 
		xmlreqs[pos].freed = 0; 
		xmlreqs[pos].xmlhttp.open("POST",url,true); 
		xmlreqs[pos].xmlhttp.onreadystatechange = function() { 
				if (typeof(xmlhttpChange) != 'undefined') { 
					xmlhttpChange(pos); 
				} 
			} 
		xmlreqs[pos].xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
		xmlreqs[pos].xmlhttp.send(data); 
	} 
} 

function xmlhttpChange(pos) { 
	if (typeof(xmlreqs[pos]) != 'undefined' && xmlreqs[pos].freed == 0 && xmlreqs[pos].xmlhttp.readyState == 4) { 
		if (xmlreqs[pos].xmlhttp.status == 200 || xmlreqs[pos].xmlhttp.status == 304) { 
			handleResponse(xmlreqs[pos].xmlhttp.responseText);
		} else { 
			handle_error(); 
		} 
		xmlreqs[pos].freed = 1; 
	} 
}

function handleResponse(responseText) {
		
	var values=responseText.split('*');
	var name=values[0];
	var videoSource=values[1];
	var url=values[2];
	var imageUrl=values[3];
	
	var heading;
	var zf =mv.getZoomFactor(); 
	var showMarkers = false;
	
	var type = clickedMarker.getAttribute('itemType');
	var repositoryId = clickedMarker.getAttribute('repositoryId');
	
	
	if(type == 'destination'){
		heading = 'Destination Information';
	}
	if(type == 'resort'){
				heading = 'Resort Information';
		
	}	
	if(type == 'accommodation'){
			heading = 'Accommodation Information';
	
	}	
	var geocode = clickedMarker.getPosition().coords;
	var html='<div class="mpBH"><h2>' + heading + '</h2></div><p>';
	//If record has image then render it
	
	if(imageUrl!='' && imageUrl != 'none' && imageUrl.substring(0,4)!='none'){		
		html+= '<img src="' + imageUrl + '" width=\"75\" height=\"75\"/>';	
	}
	html+= name + '<ul>'
	+ '<li><a href="' + url + '" onclick="setPage(\'' + type + '\',\'' + geocode.lat + '\',\'' + geocode.lon + '\',\'' + zf + '\');"/>Tell me more &raquo</a></li>'
	+ '<li><a href="#" onClick="PlayVideo(\'' + videoSource + '\'); return false;">Watch video &raquo</a></li>'
	+ '<li><a href="#" onClick="aS(\'' + type + '\',\'' + repositoryId + '\');">Add to My Shortlist &raquo</a></li>';
	
	
	if(type == 'destination'){
		html+='<li><a href="#" onClick="zTL(' + geocode.lat + ',' + geocode.lon + ',RZF)">View Destination Resorts &raquo;</a></li>';
	}
	else if (type == 'resort'){
		html+='<li><a href="#" onClick="zTL(' + geocode.lat + ',' + geocode.lon + ',AZF)">View Resort Accommodation &raquo;</a></li>';			
	}
	
	html+='</ul></p>';   
	     
	
	clickedMarker.openInfoBox(html,{className:'mpB','min_width':170});	
				
			
}

function setPage(type,geocodeLat,geocodeLon,zf){
document.getElementById('fromProductsPage').value= type;
document.getElementById('geocodeLat').value= geocodeLat;
document.getElementById('geocodeLon').value= geocodeLon;
document.getElementById('zf').value= zf;

}

function handle_error() {
	document.getElementById('errorMessage').innerHTML='An AJAX Error occurred';
}

function changeMapPosition(){
	mv.goToPosition( new MMLatLon( 51.449214,-0.111695 ));
}

function reverseDataPrefs(maptype) {
    var prefs = MMDataResolver.getDataPreferences( maptype);
    var newprefs = [];
    // Reverse order:
    for( var i = prefs.length - 1 ; i >= 0; --i ) {
        newprefs.push(prefs[i]);
    }
    // Re-draw map:
    MMDataResolver.setDataPreferences( maptype, newprefs ); 
    mv.redrawMap();
}