// first, declare the namespace if it does not exist
if (WCD == null || typeof(WCD) != "object") { var WCD = {}; }


WCD.Maps = {}

var map;
var geocoder;
var icon;
var hotelIcon;
//var marker;


//// for casino profile
var mapcentredonce = 0;

//// for sidebar maps (city,state, country)
// this variable will collect the html which will eventualkly be placed in the side_bar
var side_bar_html = "";

// arrays to hold copies of the markers and html used by the side_bar
// because the function closure trick doesnt work there
var casinoMarkers = [];
var casinoHtmls = [];

var hotelMarkers = [];
var hotelHtmls = [];

var newInfoWindowMarker = undefined;
var newInfoWindowMarkerID = undefined;
//var i = 0;

//to center casino profile map including infowindow
var casinoProfilePanOffsetLng = -0.0015;
var casinoProfilePanOffsetLat = 0.0090;

//to center city map including infowindow
var cityMapPanOffsetLat = 0;
//var cityMapPanOffsetLat = 0.0150;
var cityMapPanOffsetLng = 0;


//for autofit to markers
var bounds;

//marker managing
var propertyManager;
var propertyVisibleZoom = 17;


//// create general purpose icon
var icon = new GIcon();
//icon.image = "/images/icons/hotel.gif";
icon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
icon.iconSize = new GSize(12, 20);
icon.shadowSize = new GSize(22, 20);
icon.iconAnchor = new GPoint(6, 20);
icon.infoWindowAnchor = new GPoint(5, 1);

////create casino icon
var casinoIcon = new GIcon();
casinoIcon.image = "/layout/maps/markers/casinomarker.png";
//casinoIcon.shadow = "/layout/maps/markers/casinomarker-shadow.png";
casinoIcon.iconSize = new GSize(27, 38);
//casinoIcon.shadowSize = new GSize(41, 29);
casinoIcon.iconAnchor = new GPoint(3, 38);
casinoIcon.infoWindowAnchor = new GPoint(-10, 9);

//// create hotel purpose icon
var hotelIcon = new GIcon();
hotelIcon.image = "/images/icons/building.png";
//hotelIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
hotelIcon.iconSize = new GSize(16, 16);
//hotelIcon.shadowSize = new GSize(22, 20);
hotelIcon.iconAnchor = new GPoint(6, 20);
hotelIcon.infoWindowAnchor = new GPoint(5, 1);

//create new infowindow ackground
var newInfoWindowIcon = new GIcon();
newInfoWindowIcon.image = "/layout/maps/overlay_window.png";
newInfoWindowIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
newInfoWindowIcon.iconSize = new GSize(302, 240);
newInfoWindowIcon.shadowSize = new GSize(37, 34);
newInfoWindowIcon.iconAnchor = new GPoint(5, 1);

function mapsLoad() {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"), mapoptions);
		geocoder = new GClientGeocoder();
		
		//setup bounds object for autofit
		bounds = new GLatLngBounds();

		//add controls
		//zoom/move
		map.addControl(new GLargeMapControl());
		//map/satellite
		map.addControl(new GMapTypeControl());
		
		//traffic
		//map.addOverlay(new GTrafficOverlay());
		//map.addControl(new ExtMapTypeControl({showTraffic: true, showTrafficKey: true}));
		
		//required for some reason for autofit
		map.setCenter(new GLatLng(0,0),0);
		
	
		if(maptype == 'casinoprofilemap' ) {
			showCasinoAddress(address);
		} else if (maptype == 'hotelprofilemap') {
			showHotelAddress(address);		
		} else if (maptype == 'citymap') {
			showCity(google_maps_location);
		} else if (maptype == 'statemap') {
			showState(google_maps_location);
		} else if (maptype == 'countrymap') {
			showCountry(google_maps_location);
		}
		
		if(casinoMarkers.length == 0 && hotelMarkers.length == 0) {
			if (geocoder) {
				geocoder.getLatLng(
					google_maps_location,
					function(point) {
						if (!point) {
							alert(address + " not found");
						} else {
							map.setCenter(point, 7);
						}
					}
				);
			}
		} else {
			mapsAutoFit();
		}

	}
}

        
// show a single casino (casino profile view)
function showCasinoAddress(address) {
     
	if(typeof(casino["latitude"]) !== 'undefined' && casino["latitude"] != ''
		&& typeof(casino["longitude"]) !== 'undefined' && casino["longitude"] != '') {
		
		var latlng = new GLatLng(casino["latitude"], casino["longitude"]);
		
		//turn on the maps tab
		document.getElementById("tabMapsAndDirections").style.display = 'inline';
		
		//turn on the maps divs
		document.getElementById("mapcontainer").style.display = 'block';
		document.getElementById("drivingcontrols").style.display = 'block';
		document.getElementById("drivingcontrols").style.display = 'block';
		
		document.getElementById("map").style.width = document.getElementById("mapcontainer").style.width;
		//document.getElementById("map").style.height = '1000px';//getBrowserHeight();
		//document.getElementById("mapcontainer").style.marginBottom = '15px';
		//document.getElementById("map").style.paddingBottom = '15px';
		//document.getElementById("map").style.paddingTop = '15px';
		
		//map.setCenter(point, 13);
		//mark the map as centred so we don't have to again
		mapcentredonce++;

		//if casino name is too long, make font smaller
		var fontAdjustment = '';
		if(infobox_company.length >= 33) { fontAdjustment = 'size=-2'; }
		else if(infobox_company.length > 25) { fontAdjustment = 'size=-1'; }
		
		createCasinoMarker(latlng,
						"<table width=100%><tr><td>" +
						"<font color='000000'"+fontAdjustment+"><b>" + infobox_company + "</b></font>" +
						"</td></tr></table>",
						0);
		map.addOverlay(casinoMarkers[0]);
		createInfoWindowMarkerSmall(casinoHtmls[0],
							0,
							'casino');
							
		//add to bounds object for autofit
		bounds.extend(latlng);
	}
	

} 


// show a single hotel (hotel profile view)
function showHotelAddress(address) {
        
	if(typeof(hotel["latitude"]) !== 'undefined' && hotel["latitude"] != ''
		&& typeof(hotel["longitude"]) !== 'undefined' && hotel["longitude"] != '') {
		
		var latlng = new GLatLng(hotel["latitude"], hotel["longitude"]);
		
		//turn on the maps tab
		document.getElementById("tabMapsAndDirections").style.display = 'inline';
		
		//turn on the maps divs
		document.getElementById("mapcontainer").style.display = 'block';
		document.getElementById("drivingcontrols").style.display = 'block';
		document.getElementById("drivingcontrols").style.display = 'block';
		
		document.getElementById("map").style.width = document.getElementById("mapcontainer").style.width;
		mapcentredonce++;
		/*marker = new GMarker(point, icon);
		map.addOverlay(marker);
		//open the info window
		map.openInfoWindowHtml(point, "<font color='000000'><b>" + infobox_company + "</b></font><br><font size=-2 color='666666'>" + infobox_address + "</font>");*/
		
		//if casino name is too long, make font smaller
		var fontAdjustment = '';
		if(infobox_company.length >= 35) { fontAdjustment = 'size=-2'; }
		else if(infobox_company.length > 25) { fontAdjustment = 'size=-1'; }
		
		createHotelMarker(latlng,
						"<table width=100%><tr><td>" +
						"<font color='000000'"+fontAdjustment+"><b>" + infobox_company + "</b></font><br><font size=-2 color='666666'>" + infobox_address + "</font>" +
						"</td></tr></table>",
						0);
		map.addOverlay(hotelMarkers[0]);
		createInfoWindowMarkerSmall(hotelHtmls[0],
							0,
							'hotel');
		
		//add to bounds object for autofit
		bounds.extend(latlng);
	}
} 




function showCasinos() {

	for(var j=0; j< casinos.length; j++) {
		if(casinos[j]["latitude"] != '' && casinos[j]["longitude"] != '') {
		
			if(typeof(casinoMarkers[j]) !== 'undefined') {
				casinoMarkers[j].show();
			} else {
				var point = new GLatLng(casinos[j]["latitude"], casinos[j]["longitude"]);
				
				//if casino name is too long, make font smaller
				var fontAdjustment = '';
				if(casinos[j]["name"].length >= 35) { fontAdjustment = 'size=-2'; }
				else if(casinos[j]["name"].length > 25) { fontAdjustment = 'size=-1'; }

				
				//prepare the profile to be displayed in the div
				var html = "<table><tr><td valign='top'>";
				if(casinos[j]['random_casino_picture'] != '' && casinos[j]['random_casino_picture'] != undefined ) {
					html = html + "<div class=ewindowCasinoProfileImage><img src='/casinoimages/thumbs/tn-" + casinos[j]['random_casino_picture'] + "'></div>";
				}
				html = html + "<font color='000000' " + fontAdjustment + "><b>" + casinos[j]["name"] + "</b></font><br>";
				html = html + "<b><a href='http://www.worldcasinodirectory.com/casino/" + casinos[j]["url"] + "'><font color='000099' size=-1>go to casino profile</font></a><img src='/images/icons/bullet_go.png' style='margin-bottom: -3px; margin-left: 1px;'></b></td>";
	
				// onclick='GB_showFullScreen(\"" + casinos[j]["name"] + "\", \"http://www.worldcasinodirectory.com/casino/" + casinos[j]["url"]+"\"); return false;'"+
	
				html = html + "</tr>";
							
				html = html + "</table>";
	
					//create it
				var marker = createCasinoMarker(point, html, j);
				map.addOverlay(marker);
				
				//add to bounds object for autofit
				bounds.extend(point);
			}
		}
	}
	

}

function hideCasinos() {
	for(var j=0; j< casinoMarkers.length; j++) {
		if(typeof(casinoMarkers[j]) !== 'undefined') casinoMarkers[j].hide();
	}
}
	
	

function showHotels() {
	for(var j=0; j < hotels.length; j++) {
		if(hotels[j]["latitude"] != '' && hotels[j]["longitude"] != '') {
			var point = new GPoint(hotels[j]["latitude"], hotels[j]["longitude"]);
			
			//prepare the profile to be displayed in the div
			var html = "<table width=100%><tr><td valign='top'>";
			if(hotels[j]['first_hotel_picture'] != '' && hotels[j]['first_hotel_picture'] != undefined ) {
				html = html + "<div class=ewindowHotelProfileImage><img src='" + hotels[j]['first_hotel_picture'] + "'></div>";
			}
			html = html + "<font color='000000'><b>" + hotels[j]["name"] + "</b></font><br><font size=-2 color='666666'>" + hotels[j]["physical_address"] + "</font><br>";
			html = html + "<b><a href='http://www.worldcasinodirectory.com/hotels/" + hotels[j]["url"] + "' onclick='GB_showFullScreen(\"" + hotels[j]["name"] + "\", \"http://www.worldcasinodirectory.com/hotels/" + hotels[j]["url"] +"\"); return false;'"+
"><font color='000099' size=-1>view profile or book a room >></font></a></b></td>";
			html = html + "</tr></table>";
			
			//create it
			var marker = createHotelMarker(point, html, j);
			map.addOverlay(marker);
			//propertyManager.addMarker(marker);

		}
	}
}

function hideHotels() {
	for(var j=0; j< hotelMarkers.length; j++) {
		if(typeof(hotelMarkers[j]) !== 'undefined') hotelMarkers[j].hide();
	}
}

function showCity(google_maps_location) {
        
	showHotels();
        showCasinos();

} 

function showState(google_maps_location) {
        

	showHotels();
        showCasinos();
	
} 

function showCountry(google_maps_location) {
        

	showHotels();
        showCasinos();
	
} 

function mapsAutoFit() {
	map.setZoom(map.getBoundsZoomLevel(bounds));

	map.setCenter(bounds.getCenter());
}


function sizeMapToBrowser() {
	//var winwidth = window.innerwidth || document.body.clientwidth;
	
	if(map) { map.checkResize(); }
	mapsAutoFit();
}

// A function to create the marker and set up the event window
function createCasinoMarker(point,html,i) {
	var marker = new GMarker(point, casinoIcon);
	GEvent.addListener(marker, "click", function() {
		//if we're on the casino profile single view, show the small infowindow
		//only 1 can ever be active on 1 casino view as opposed to location views
		//if(maptype == 'casinoprofilemap') {
			if(newInfoWindowMarker == undefined) {
				createInfoWindowMarkerSmall(html, i);
			} else {
				map.removeOverlay(newInfoWindowMarker);
				newInfoWindowMarker = undefined;
				newInfoWindowMarkerID = undefined;

			}
		//regular location maps, show the big window
		/*} else {
			if(newInfoWindowMarker == undefined) {
				createInfoWindowMarker(html, i);
			} else {
				map.removeOverlay(newInfoWindowMarker);
				if(newInfoWindowMarkerID == i) {
					newInfoWindowMarker = undefined;
					newInfoWindowMarkerID = undefined;
				} else {
					createInfoWindowMarker(html, i);
				}
			}	
		}*/
	});
	// save the info we need to use later for the side_bar
	casinoMarkers[i] = marker;
	casinoHtmls[i] = html;
	// add a line to the side_bar html
	return marker;
}

function createHotelMarker(point,html,i) {
	//var marker = new GMarker(point, hotelIcon);
	var marker = new GMarker(point, casinoIcon);
	GEvent.addListener(marker, "click", function() {
		//if we're on the casino profile single view, show the small infowindow
		//only 1 can ever be active on 1 casino view as opposed to location views
		if(maptype == 'hotelprofilemap') {
			if(newInfoWindowMarker == undefined) {
				createInfoWindowMarkerSmall(html, i, 'hotel');
			} else {
				map.removeOverlay(newInfoWindowMarker);
				newInfoWindowMarker = undefined;
				newInfoWindowMarkerID = undefined;

			}
		//regular location maps, show the big window
		} else {
			//marker.openInfoWindowHtml(html);
			if(newInfoWindowMarker == undefined) {
				createInfoWindowMarker(html, i, 'hotel');
			} else {
				map.removeOverlay(newInfoWindowMarker);
				if(newInfoWindowMarkerID == i) {
					newInfoWindowMarker = undefined;
					newInfoWindowMarkerID = undefined;
				} else {
					createInfoWindowMarker(html, i, 'hotel');
				}
			}	
		}
	});
	// save the info we need to use later for the side_bar
	hotelMarkers[i] = marker;
	hotelHtmls[i] = html;
	// add a line to the side_bar html
	return marker;
}


function createInfoWindowMarker(html, i, type) {
	if(newInfoWindowMarker != undefined) {
		map.removeOverlay(newInfoWindowMarker);
		if(newInfoWindowMarkerID == i) {
			newInfoWindowMarker = undefined;
			newInfoWindowMarkerID = undefined;
		}
	}
	newInfoWindowMarker = new EWindow(map, E_STYLE_7);
	map.addOverlay(newInfoWindowMarker);
	
	if(type == 'hotel') {
		newInfoWindowMarker.openOnMarker(hotelMarkers[i],html);
	} else {
		newInfoWindowMarker.openOnMarker(casinoMarkers[i],html);
	}
	
	newInfoWindowMarkerID = i;
	//return marker;
}


function createInfoWindowMarkerSmall(html, i, type) {
	if(newInfoWindowMarker != undefined) {
		map.removeOverlay(newInfoWindowMarker);
		if(newInfoWindowMarkerID == i) {
			newInfoWindowMarker = undefined;
			newInfoWindowMarkerID = undefined;
		}
	}
	//map.removeOverlay(newInfoWindowMarker);
	newInfoWindowMarker = new EWindow(map, E_STYLE_8);
	map.addOverlay(newInfoWindowMarker);
	
	
	if(type == 'hotel') {
		newInfoWindowMarker.openOnMarker(hotelMarkers[i],html);
	} else {
		newInfoWindowMarker.openOnMarker(casinoMarkers[i],html);
	}
	
	newInfoWindowMarkerID = i;
	//return marker;
}

    
// This function picks up the click and opens the corresponding info window
function clickCasino(i) {

	//load the point in question
	var mapPoint = casinoMarkers[i].getPoint();
	
	//show the point if it's hidden (click could come from menu)
	if(casinoMarkers[i].isHidden) casinoMarkers[i].show();
	
	if(maptype == 'casinoprofilemap') {
		map.panTo(new GLatLng(mapPoint.lat()+casinoProfilePanOffsetLat, mapPoint.lng()+casinoProfilePanOffsetLng));
	} else {
		map.panTo(new GLatLng(mapPoint.lat() + cityMapPanOffsetLat, mapPoint.lng()+cityMapPanOffsetLng));
	}
	
	//toggle the infowindow on /off based on click
	if(newInfoWindowMarkerID == i) {
		map.removeOverlay(newInfoWindowMarker);
		newInfoWindowMarker = undefined;
		newInfoWindowMarkerID = undefined;
	} else {
		createInfoWindowMarker(casinoHtmls[i], i);
	}
}

function clickHotel(i) {
	map.panTo(hotelMarkers[i].getPoint());
	
	//toggle the infowindow on /off based on click
	if(newInfoWindowMarkerID == i) {
		map.removeOverlay(newInfoWindowMarker);
		newInfoWindowMarker = undefined;
		newInfoWindowMarkerID = undefined;
	} else {
		createInfoWindowMarker(hotelHtmls[i], i, 'hotel');
	}
}


// these functions take care of the tabs for casino/hotel lists
function showCasinoList() {
	document.getElementById("maphotellist").style.display = 'none';
	document.getElementById("mapcasinolist").style.display = 'block';
}

function showHotelList() {
	document.getElementById("maphotellist").style.display = 'block';
	document.getElementById("mapcasinolist").style.display = 'none';
}


//for casino profile view
/*function toggleMapDivCasino(div, address) {
	var theDiv = document.getElementById(div);
	if(theDiv.style.display == 'none') {
		theDiv.style.display = 'block';
		map.checkResize();
		//if it's been centred once already, we don't need to do the pan effect.. just recenter
		if(mapcentredonce < 2) {
			showCasinoAddress(address);
		} else {
			var mapPoint = casinoMarkers[0].getPoint();
			map.panTo(new GLatLng(mapPoint.lat()+casinoProfilePanOffsetLat, mapPoint.lng()+casinoProfilePanOffsetLng));
		}
		
		//space it out a bit from the rest of the profile
		document.getElementById("mapcontainer").style.marginBottom = '10px';
		
		//set the div with map controls
		document.getElementById("mapcontrols").innerHTML = '<table style="padding: 0px; margin: 0px;"><tr><td width=16><a href="javascript:toggleMapDivCasino(\'map\', address);"><img src=/images/icons/action_go_back.gif border=0></a></td><td><span style="font-size:.8em;"><b><a href="javascript:toggleMapDivCasino(\'map\', address);">Hide map</a></b></span></td><td width=16><a href="javascript:recenterMap(\'map\', address);"><img src=/images/icons/icon_get_world.gif border=0></a></td><td><span style="font-size:.8em;"><b><a href="javascript:recenterMap();">Re-center map on casino</a></b></span></td></tr></table>';
		document.getElementById("mapcontrols").style.clear = 'both';
		document.getElementById("mapcontrols").style.float = 'none';
		
	} else { 
		theDiv.style.display = 'none';
		document.getElementById("mapcontainer").style.marginBottom = '0px';
		document.getElementById("mapcontrols").innerHTML = '<table style="padding: 0px; margin: 0px;"><tr><td width=16><a href="javascript:toggleMapDivCasino(\'map\', address);"><img src=/images/icons/action_go.gif border=0></a></td><td><span style="font-size:.8em;"><b><a href="javascript:toggleMapDivCasino(\'map\', address);">Show map</a></b></span></td></tr></table>';
	

	}
}*/


//for hotel profile view
function toggleMapDivHotel(div, address) {
	var theDiv = document.getElementById(div);
	if(theDiv.style.display == 'none') {
		theDiv.style.display = 'block';
		map.checkResize();
		//if it's been centred once already, we don't need to do the pan effect.. just recenter
		if(mapcentredonce < 2) {
			showHotelAddress(address);
		} else {
			var mapPoint = hotelMarkers[0].getPoint();
			map.panTo(new GLatLng(mapPoint.lat()+casinoProfilePanOffsetLat, mapPoint.lng()+casinoProfilePanOffsetLng));
		}
		
		//space it out a bit from the rest of the profile
		document.getElementById("mapcontainer").style.marginBottom = '30px';
		
		//set the div with map controls
		document.getElementById("mapcontrols").innerHTML = '<span style="font-size:.8em;"><a href="javascript:toggleMapDivHotel(\'map\', address);"><img src=/images/icons/action_go_back.gif border=0></a> <b><a href="javascript:toggleMapDivHotel(\'map\', address);">Hide map</a></b> <a href="javascript:recenterMap(\'map\', address);"><img src=/images/icons/icon_get_world.gif border=0></a> <b><a href="javascript:recenterMap();">Re-center map on casino</a></b></span>';
		
	} else { 
		theDiv.style.display = 'none';
		document.getElementById("mapcontainer").style.marginBottom = '0px';
		document.getElementById("mapcontrols").innerHTML = '<span style="font-size:.8em;"><a href="javascript:toggleMapDivHotel(\'map\', address);"><img src=/images/icons/action_go.gif border=0></a> <b><a href="javascript:toggleMapDivHotel(\'map\', address);">Show map</a></b></span>';
	
	
	}
}


//
//for casino profile view
function toggleDrivingDivCasino(div, address) {
	var theDiv = document.getElementById(div);
	if(theDiv.style.display == 'none') {
		theDiv.style.display = 'block';
		
		//set the div with driving controls
		document.getElementById("drivingcontrols").innerHTML = '<table style="padding: 0px; margin: 0px;"><tr><td width=16><a href="javascript:toggleDrivingDivCasino(\'drivingdirections\');"><img src=/images/icons/car.png border=0></a></td><td><span style="font-size:.8em;"><b><a href="javascript:toggleDrivingDivCasino(\'drivingdirections\');">Hide directions</a></b></span></td></tr></table>';
		
	} else { 
		theDiv.style.display = 'none';
		document.getElementById("drivingcontrols").innerHTML = '<table style="padding: 0px; margin: 0px;"><tr><td width=16><a href="javascript:toggleDrivingDivCasino(\'drivingdirections\');"><img src=/images/icons/car.png border=0></a></td><td><span style="font-size:.8em;"><b><a href="javascript:toggleDrivingDivCasino(\'drivingdirections\');">Driving directions</a></b></span></td></tr></table>';

	
	}
}

//recenter-map on casino profile view
//can't use an offset cause it won't work at all zoom levels
function recenterMap() {
	//var mapPoint = casinoMarkers[0].getPoint();
	//map.panTo(new GLatLng(mapPoint.lat(), mapPoint.lng()));
	mapsAutoFit();
}


//the "x" close icon on overlay windows
function closeOverlay() {
	map.removeOverlay(newInfoWindowMarker);
	newInfoWindowMarker = undefined;
	newInfoWindowMarkerID = undefined;
}