/*
	For Reference
	http://code.google.com/apis/maps/articles/toomanymarkers.html#markerclusterer
	http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/examples/advanced_example.html
	
	


*/

var map = '';
var infoBubble = '';
var markersRef = [];
var markersArray = [];
var regionMarkersArray = [];
var regionMarkersRef = [];

function initGMap(){
    var myLatlng = new google.maps.LatLng(mapConfig['starting_latitude'], mapConfig['starting_longitude']);
    var myOptions = {
      zoom: mapConfig['starting_zoom_level'],
      center: myLatlng,
	  panControl: mapConfig['show_pan'],
	  zoomControl: mapConfig['show_zoom'],
	  zoomControlOptions: {
		style: google.maps.ZoomControlStyle.SMALL
	  },	  

	  scaleControl: mapConfig['show_scale'],
	  streetViewControl: mapConfig['show_streetview'],
	  mapTypeControl: mapConfig['show_maptype'],
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
	
    map = new google.maps.Map(document.getElementById("map"), myOptions);
	var mapWidth = document.getElementById('map').style.width;
	infoBubble = new google.maps.InfoWindow({ 
        pixelOffset: new google.maps.Size(mapConfig['map_bubble_x'],mapConfig['map_bubble_y'])
	});
	
	// Create Pub Markers
	var pubMarkers = [];
	pubMarkers = createPubMarkers(mapConfig['pub_map_markers']);
	if(mapConfig['marker_display']=='CLUSTERER'){
		  var styles = [[{
			url: mapConfig['cluster_icon_small'],
			height: mapConfig['cluster_icon_small_height'],
			width: mapConfig['cluster_icon_small_width'],
			opt_anchor: [16, 0],
			opt_textColor: mapConfig['cluster_icon_small_font_color'],
			opt_textSize: mapConfig['cluster_icon_small_font_size']
		  }, {
			url: mapConfig['cluster_icon_medium'],
			height: mapConfig['cluster_icon_medium_height'],
			width: mapConfig['cluster_icon_medium_width'],
			opt_anchor: [16, 0],
			opt_textColor: mapConfig['cluster_icon_medium_font_color'],
			opt_textSize: mapConfig['cluster_icon_medium_font_size']
		  }, {
			url: mapConfig['cluster_icon_large'],
			height: mapConfig['cluster_icon_large_height'],
			width: mapConfig['cluster_icon_large_width'],
			opt_anchor: [16, 0],
			opt_textColor: mapConfig['cluster_icon_large_font_color'],
			opt_textSize: mapConfig['cluster_icon_large_font_size']
		  }]];
		var pubMarkerManager = new MarkerClusterer(map, pubMarkers, {
			styles: styles[0]
		});
	} else {
		var pubMarkerManager = new MarkerManager(map);
		google.maps.event.addListener(pubMarkerManager, 'loaded', function() {
			pubMarkerManager.addMarkers(pubMarkers, mapConfig['show_pubs_zoom']);
			pubMarkerManager.refresh();
			if(mapConfig['starting_pubid']>0){
				ajaxFindOnMap([mapConfig['starting_pubid']]);				
				setTimeout(function(){map.panBy(0, -20)},500);
			}			
		}); 			
	}
	
	// Create Region markers
	if(mapConfig['load_region_markers']==true){
		var regionMarkers = createRegionMarkers(mapConfig['region_map_markers']);
		var regionMarkerManager = new MarkerManager(map);
		google.maps.event.addListener(regionMarkerManager, 'loaded', function() {
			regionMarkerManager.addMarkers(regionMarkers, 0, mapConfig['show_pubs_zoom']);
			regionMarkerManager.refresh();		
		}); 
		// Load default marker
		if(mapConfig['starting_regionid'] > 0 && mapConfig['starting_pubid']==0){
			google.maps.event.trigger(regionMarkersArray[regionMarkersRef[mapConfig['starting_regionid']]], 'click');
		}	
	}
	

	// Add the custom control
	if(mapConfig['show_reset']==true){
		var controlDiv = document.createElement('DIV');
		var controlUI = document.createElement('DIV');
		var myControl = createResetControl(controlDiv, controlUI);
		
		controlDiv.index = 1;
		map.controls[google.maps.ControlPosition.TOP_RIGHT].push(controlDiv);	
		google.maps.event.addDomListener(controlUI, 'click', function() {
			map.setZoom(mapConfig['starting_zoom_level']);
			var startingLoc = new google.maps.LatLng(mapConfig['starting_latitude'], mapConfig['starting_longitude']);
			map.panTo(startingLoc);
		});
	}
}

function createPubMarkers(url){
	var xml = downloadUrl(url);
	var xmlMarkers  = xml.documentElement.getElementsByTagName("marker");
	for (var m = 0; m <xmlMarkers.length; m++) {
		var marker = xmlMarkers[m];
		var pubLoc = new google.maps.LatLng(marker.getAttribute('latitude'), marker.getAttribute('longitude'));
		
		// If this is just a pub then add normal marker, hotels have a unique one
		var pubIcon = mapConfig['icon_pub'];
		var hotelHtml = '';
		if(marker.getAttribute('hotelName')!="" && marker.getAttribute('hotelName')!=null){
			pubIcon = mapConfig['icon_hotel'];
			hotelHtml 	= '<span class="accommodation small-text"><a class="accommodation" href="' + marker.getAttribute('url') + 'accommodation/">' + marker.getAttribute('hotelName') + '</a> Accommodation<br /></span>';
		}
		
		// Set info for bubble
		var pointUrl	= pubLoc.toUrlValue();
		var pubHtml 	= '<a href="' + marker.getAttribute('url') + '">' + marker.getAttribute('pubName') + '</a><br />';
		var closureHtml = '';
		var addressHtml = '<span class="small-text">' + marker.getAttribute('address') + '<br />Tel: ' + marker.getAttribute('telephone') + '</span><br />';
		var mapHtml = '<span class="small-text">Directions with Google: <a href="http://maps.google.co.uk/maps?daddr=' + pointUrl + '" target="_blank">To here</a> | <a href="http://maps.google.co.uk/maps?saddr=' + pointUrl + '" target="_blank">From here</a></span><br />'
								 + '<span class="small-text">View on a: <a href="http://maps.google.co.uk/maps?q=' + pointUrl + '" target="_blank">Larger Google map</a></span>';
		if(marker.getAttribute('closureText') != "" && marker.getAttribute('closureText') !=null) {
			closureHtml	= '<span class="announcement small-text">' + marker.getAttribute('closureText') + '</span><br />';
		}
		var bubbleSize = '';
		if(mapConfig['infowindow_width']  > 0 && mapConfig['infowindow_height']  > 0){
			bubbleSize = 'style="width:' + mapConfig['infowindow_width'] + 'px; height:' + mapConfig['infowindow_height'] + 'px;"';
		}

		html= '<div id="mapInfoBubble" ' + bubbleSize + '>' + pubHtml + closureHtml + addressHtml + hotelHtml + mapHtml + '</div>';		
		markersArray[m] = 	new google.maps.Marker({
			position: pubLoc,
			icon: pubIcon,
			title: marker.getAttribute("pubName")
		});
		markersRef[marker.getAttribute(mapConfig['pub_identifier'])] = m;
		createMarkerEvent(markersArray[m], html);
	}
	return markersArray;
}

function createRegionMarkers(url) {
	var xml = downloadUrl(url);
	var xmlMarkers  = xml.documentElement.getElementsByTagName("marker");
	var regionLinkHtml 	= '';
	
	for (var m = 0; m <xmlMarkers.length; m++) {	
		var xmlMarker = xmlMarkers[m];
		var regLoc = new google.maps.LatLng(xmlMarker.getAttribute('latitude'), xmlMarker.getAttribute('longitude'));
		var regionLinkText = mapConfig['region_link_text'];
		if(mapConfig['show_region_link']==true) {
			regionLinkHtml = regionLinkText.replace('%1', '<a href="' + xmlMarker.getAttribute("url") + '">');
			regionLinkHtml = regionLinkHtml.replace('%2', '</a>');
			regionLinkHtml = regionLinkHtml + ' or ';
		}
		var html = xmlMarker.getAttribute("regionName") 
					+ '<br />' + xmlMarker.getAttribute("countTxt")
					+ '<br /><span class="small-text">' + regionLinkHtml + '<a href="#" onClick="zoomTo('
					+ xmlMarker.getAttribute("latitude") + ', ' + xmlMarker.getAttribute("longitude") + ', '
					+ mapConfig['show_pubs_zoom'] +');">zoom in</a> on the map.</span>';
		regionMarkersArray[m] = 	new google.maps.Marker({
			position: regLoc,
			icon: mapConfig['icon_region'],
			title: xmlMarker.getAttribute("regionName") 
		});					
		regionMarkersRef[xmlMarker.getAttribute('regionID')] = m;
		createMarkerEvent(regionMarkersArray[m], html);
	}
	return regionMarkersArray;
}

function createMarkerEvent(marker, content) {
  google.maps.event.addListener(marker, 'click', function() {
	infoBubble.setContent(content);
	infoBubble.open(map,marker);
  });
}

function ajaxFindOnMap(pubMarkerID){	
	map.setZoom(mapConfig['search_zoom']);
	map.panTo(markersArray[markersRef[pubMarkerID]].position);
	google.maps.event.trigger(markersArray[markersRef[pubMarkerID]], 'click');
}

function infoWindowClick(pubMarkerID){
	google.maps.event.trigger(markersArray[markersRef[pubMarkerID]], 'click');
}

function findOnMapFromLink(link, pubID, latitude, longitude) {
	var mapXY 		= getMapXY(document.getElementById('map'));
	var mapX		= mapXY[0];
	var mapY		= mapXY[1];
	link.className 	= 'dfcMapResults';
	ajaxFindOnMap(pubID);
	window.scrollTo(0, mapY, mapX[0]);
}

function showRegion(regionMarkerID){
	google.maps.event.trigger(regionMarkers[regionMarkersRef[regionMarkerID]], 'click');
}

function zoomTo(latitude, longitude, zoomLvl){
	var newLoc = new google.maps.LatLng(latitude, longitude);
	map.setCenter(newLoc);
	map.setZoom(zoomLvl);	
}

function getMapXY() {
	var mapX = 0;
	var mapY = 0;
	obj = document.getElementById('map');
	if (obj.offsetParent) {
		do {
			mapX += obj.offsetLeft;
			mapY += obj.offsetTop;
		} while (obj = obj.offsetParent);
	}
	return [mapX,mapY];
}

function searchLatLon(latitude, longitude, address) {
	if(latitude != undefined && longitude != undefined && address != undefined) {
		frm = document.getElementById('frmSearch');
		frm.searchLatitude.value  	= latitude;
		frm.searchLongitude.value 	= longitude;
		frm.searchAddress.value 	= address;
		frm.submit();
	}
}

function setGMapType(type){
	map.setMapTypeId(type);
}
	
function downloadUrl(url){
	if (window.XMLHttpRequest){
		// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp=new XMLHttpRequest();
	} else {
		// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.open("GET",url,false);
	xmlhttp.send();
	xmlDoc=xmlhttp.responseXML; 
	return xmlDoc;
}

function createResetControl(controlDiv, controlUI){
	controlDiv.style.padding = '5px';

	// Set CSS for the control border	
	controlUI.style.backgroundColor = 'white';
	controlUI.style.borderStyle = 'solid';
	controlUI.style.borderWidth = '1px';
	controlUI.style.borderColor = '#a6a6a6';
	controlUI.style.cursor = 'pointer';
	controlUI.style.textAlign = 'center';
	controlUI.title = 'Click to reset the map';
	controlDiv.appendChild(controlUI);

	// Set CSS for the control interior
	var controlText = document.createElement('DIV');
	controlText.style.fontFamily = 'Arial,sans-serif';
	controlText.style.fontSize = '12px';
	controlText.style.color = '#6082c5';
	controlText.style.fontWeight = 'bold';
	controlText.style.paddingLeft = '7px';
	controlText.style.paddingRight = '7px';
	controlText.innerHTML = 'Reset';
	controlUI.appendChild(controlText);
}

function loadXMLString(xmlData) {
	try { 
		//Internet Explorer
		xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
		xmlDoc.async = "false";
		xmlDoc.loadXML(xmlData);
		return xmlDoc;
	}catch(e){ 
		//Firefox et. all
		try {
			parser = new DOMParser();
			xmlDoc = parser.parseFromString(xmlData, "text/xml");
			return xmlDoc;
		}catch(e){
			alert(e.message)
		}
	}
	return false;
}


window.onload = initGMap;