var map;
var baseIcon = new GIcon(G_DEFAULT_ICON);
var lastMarker, htmlStr;
function initialize_map(latitude, longitude, zoomLevel) {
	if (GBrowserIsCompatible()) {
    	map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(latitude, longitude), zoomLevel);
		ui = map.getDefaultUI();
		ui.zoom.scrollwheel = false;
		map.setUI(ui) ;
		addAllProperties();
		createMarkersArray();
		createLodgingMarkersArray();
		createLodgingProperties();
		toggleMarkers();
		lodgings();
		
	}
}

// this function is used to intilize the
// vacation rental map
function initialize_lodgings_map(latitude, longitude, defaultZoomLevel, MaximumZoomLevel, map_display_toggle)
{
	if (GBrowserIsCompatible()) {
    	map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(latitude, longitude), defaultZoomLevel);
        ui = map.getDefaultUI();
		ui.zoom.scrollwheel = false;
		map.setUI(ui) ;
		if(MaximumZoomLevel != -1)
		{
			G_NORMAL_MAP.getMaximumResolution = function(){return MaximumZoomLevel; };
			G_SATELLITE_MAP.getMaximumResolution = function(){return MaximumZoomLevel; };
			G_HYBRID_MAP.getMaximumResolution = function(){return MaximumZoomLevel; };
			G_PHYSICAL_MAP.getMaximumResolution = function(){return MaximumZoomLevel; };
		}
		addAllProperties();
		createMarkersArray();
		createLodgingMarkersArray();
		createLodgingProperties();
		toggleMarkers();
		lodgings();
		if(!map_display_toggle)
		if(document.getElementById("map_info"))
			document.getElementById("map_info").style.display="none";
		
	}
}

// Creates a property marker whose info window displays the letter corresponding
function createMarker(point,propertyId,bathrooms,bedrooms,sleeps,quality,nightlyrangestart,nightlyrangeend,thumbnail,map_marker,map_marker_width,map_marker_height) {
	var imageIcon = new GIcon(baseIcon);
	imageIcon.image=map_marker;
	imageIcon.shadow="";
	imageIcon.iconSize = new GSize(map_marker_width, map_marker_height);
  	// Set up our GMarkerOptions object
  	markerOptions = { icon:imageIcon };
  	var marker = new GMarker(point, markerOptions);
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml('<table class="gmap-table" ><tr><td colspan="3" height="40px" border="0" align="left"><span style="font-size:20px">Property '+propertyId+'</span><hr color="#085173" size="2"/></td></tr><tr><td valign="top" width="150" height="112" ><img  src="'+thumbnail+'"  /></td><td width="2px">&nbsp;</td><td align="left" valign="top"><b>'+quality+'</b><br/>&#36;'+nightlyrangestart+' - &#36;'+nightlyrangeend+' / night<br/>Sleeps '+sleeps+'<br/>'+bedrooms+' br '+bathrooms+' baths<br/><a href="http://www.findtahoerentals.com/'+propertyId+'" target="_blank">More Details</a></td></tr></table>');
		});
  return marker;
}

// this function is used to create the  point of interest markers
function createPointOfInterestMarkers(point,name,phoneNumber,websitename,websiteUrl,thumbnail,propertyMarker,map_marker_width,map_marker_height)
{
	var imageIcon = new GIcon(baseIcon);
	imageIcon.image=propertyMarker;
	imageIcon.shadow="";
	imageIcon.iconSize = new GSize(map_marker_width, map_marker_height);
	// Set up our GMarkerOptions object
	markerOptions = { icon:imageIcon };
	var marker = new GMarker(point, markerOptions);
	width=name.length*10;
	if(width<200)
	{
		width=200;
	}
	else if(width>350)
	{
		width=350;
	}
	GEvent.addListener(marker, "click", function() {
		htmlStr='<table class="gmap-table" ><tr><td colspan="3" min-height="20" width="100%" align="left"><div style="width:'+width+'px;font-size:20px;">'+name+'</div><hr color="#085173" size="2"/></td></tr><tr><td valign="top" width="150" height="112" ><img  src="'+thumbnail+'"    alt="'+name+'" /></td><td width="2px">&nbsp;</td>';
		htmlStr+='<td align="left" valign="top">';
		if(phoneNumber != '')
		{
			htmlStr+=phoneNumber+'<br/>';
		}
		if(websitename != '')
		{
			htmlStr+='<a href="'+websiteUrl+'" target="_blank">'+websitename+'</a>';
		}
		htmlStr+='</td></tr></table>';
		marker.openInfoWindowHtml(htmlStr);
		});
	lastMarker = marker;
	return marker;
}

// function to open the info window of perticular point of interest.
var current_active_link = "";
function showPoiInfoWindow(pid){
	// here i am checking for phot info div is existed or not
	if(map != 'undefined' && map != null)
	{
		if(document.getElementById("photos_info"))
		{
			if(document.getElementById("photo-link"))
			{
				photo=document.getElementById('photo-link');
				photo.className='inactive-link';
			}
			if(document.getElementById('map-link'))
			{
				mapLink=document.getElementById('map-link');
				mapLink.className='active-btn';
				current_active_link = mapLink;
			}
			if(document.getElementById('list-link'))
			{
				list=document.getElementById('list-link');
				list.className='inactive-link';			
	
			}
			
			document.getElementById("photos_info").style.display="none";
			document.getElementById("map_info").style.display="block";
			if(markerObjectArray[pid] != null && markerObjectInfoHtml[pid]!= null)
			{
				display_map();
				markerObjectArray[pid].openInfoWindowHtml(markerObjectInfoHtml[pid]);
			}
		}
		else
		{
			if(markerObjectArray[pid] != null && markerObjectInfoHtml[pid]!= null)
			{
				display_map();
				markerObjectArray[pid].openInfoWindowHtml(markerObjectInfoHtml[pid]);
			}
		}
	}
}

// function to open the info window of perticular lodging proeprty
// here we are checking if that property marker is added to the map or not .
function showLodgingsInfoWindow(lodging_type,lodging_id){
	// here we are checkinf if that lodging check box is selected or not
	// if the check box is not checked or there is no that check box we are adding the
	// map marker to the layer
	if(!checkTheCheckbox(lodging_type))
	{
		// here this code will add the map marker to map
		for(i=0;i<markerLodgingObjectArray[lodging_type].length;i++)
		{
			if(markerLodgingObjectArray[lodging_type][i] != null && markerLodgingObjectArray[lodging_type][i] != 'undefined')
			{
				
				//alert("lodging id ="+lodging_id);
				if(i==lodging_id)
					map.addOverlay(markerLodgingObjectArray[lodging_type][i]);
				else
					map.removeOverlay(markerLodgingObjectArray[lodging_type][i]);
			}
		}
	}
	// here i am checking for phot info div is existed or not
	display_map();	
	if(markerLodgingObjectArray[lodging_type][lodging_id] != null && markerLodgingObjectInfoHtml[lodging_type][lodging_id]!= null)
		markerLodgingObjectArray[lodging_type][lodging_id].openInfoWindowHtml(markerLodgingObjectInfoHtml[lodging_type][lodging_id]);
		
	
}

//this function remove attractions if the corresponding checkboxes unchecked
function toggleMarkers(){
	for(i=0;i<markerObjectAttraction.length;i++){
		map.removeOverlay(markerObjectArray[i]);
		for(k=0;k<document.poiCheckBoxesForm.length;k++){
			if (document.poiCheckBoxesForm[k].type=="checkbox" && document.poiCheckBoxesForm[k].name=="attraction" && 
					markerObjectAttraction[i]==document.poiCheckBoxesForm[k].value)
			{
				if(document.poiCheckBoxesForm[k].checked){
					map.addOverlay(markerObjectArray[i]);
				}
				
			}
		}
	}
	
}

// this function is used create or remove lodging markers
function lodgings()
{
	// here i am removing the overlay
	for(i=0;i<markerLodgingObjectArray.length;i++){
		if(markerLodgingObjectArray[i].length)
		{
			for(j=0;j<markerLodgingObjectArray[i].length;j++)
			{
				if(markerLodgingObjectArray[i][j] != null && markerLodgingObjectArray[i][j] != 'undefined')
				{
					map.removeOverlay(markerLodgingObjectArray[i][j]);
				}
			}
		}
	}
	// here i am getting the checked lodging values and 
	// adding the lodging markers to map
	for(k=0;k<document.poiCheckBoxesForm.length;k++){
		if (document.poiCheckBoxesForm[k].type=="checkbox" && document.poiCheckBoxesForm[k].name=="lodging" )
		{
			if(document.poiCheckBoxesForm[k].checked){
				lodging_value=document.poiCheckBoxesForm[k].value;
				// here i have to get the index values and add to map
				for(j=0;j<markerLodgingObjectArray[lodging_value].length;j++)
				{
					if(markerLodgingObjectArray[lodging_value][j] != null && markerLodgingObjectArray[lodging_value][j] != 'undefined')
					{
						map.addOverlay(markerLodgingObjectArray[lodging_value][j]);
					}
				}
			}
		}
	}
}

//this function opens the given url in separate page
function viewPointOfInterest(url)
{
	window.open(url,"_blank");
}
// this function is used to create the other lodging properties in map
function createLodgingMarkers(point,name,fromRate,phoneNumber,linkText,anchorTxt,thumbnail,lodgingMarker,map_marker_width,map_marker_height) {
	var imageIcon = new GIcon(baseIcon);
	imageIcon.image=lodgingMarker;
	imageIcon.shadow="";
	imageIcon.iconSize = new GSize(map_marker_width, map_marker_height);
  	// Set up our GMarkerOptions object
  	markerOptions = { icon:imageIcon };
	
  	var marker = new GMarker(point, markerOptions);
	GEvent.addListener(marker, "click", function() {
		htmlStr='<table class="gmap-table" ><tr><td colspan="3" height="40px" align="left"><span style="font-size:20px">'+name+'</span><hr color="#085173" size="2"/></td></tr><tr><td valign="top" width="150" height="112" ><img  src="'+thumbnail+'"  /></td><td width="2px">&nbsp;</td>';
		htmlStr+='<td align="left" valign="top">';
		if(fromRate!=''){
			htmlStr+='From: <b>$'+fromRate+'</b>/night<br/>';
		}
		if(phoneNumber!='')
		{
			htmlStr+=''+phoneNumber+'<br/>';	
		}
		htmlStr+='<a href="'+linkText+'" target="_blank">'+anchorTxt+'</a></td></tr></table>';
		marker.openInfoWindowHtml(htmlStr);
		});
  return marker;
}

// this function addes the all lodging properties to map
function createLodgingProperties()
{
	 for(i=0;i<markerLodgingObjectArray.length;i++)
	 {
		 //alert(markerLodgingObjectArray[i].length);
		 if(markerLodgingObjectArray[i].length )
		 {
			 for(j=0;j<markerLodgingObjectArray[i].length;j++)
			 {
				 if(markerLodgingObjectArray[i][j] != null && markerLodgingObjectArray[i][j] != 'undefined' )
				 {
					 map.addOverlay(markerLodgingObjectArray[i][j]);
				 }
			 }
		 }
		 
	 }
}

// Creates a manual property marker  for the vacation rental lodging
function createManualPropertyMarker(point,propertyId,bathrooms,bedrooms,sleeps,nightlyrangestart,nightlyrangeend,thumbnail,linkText,property_header,map_marker,map_marker_width,map_marker_height) {
	var imageIcon = new GIcon(baseIcon);
	imageIcon.image=map_marker;
	imageIcon.shadow = "";
	imageIcon.iconSize = new GSize(map_marker_width, map_marker_height);
  	// Set up our GMarkerOptions object
  	markerOptions = { icon:imageIcon };
  	var marker = new GMarker(point, markerOptions);
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml('<table class="gmap-table" ><tr><td colspan="3" height="40px" align="left"><span style="font-size:20px">'+property_header+'</span><hr color="#085173" size="2"/></td></tr><tr><td valign="top" width="150" height="112" ><img  src="'+thumbnail+'"  /></td><td width="2px">&nbsp;</td><td align="left" valign="top">'+propertyId+'<br/>&#36;'+nightlyrangestart+' - &#36;'+nightlyrangeend+' / night<br/>Sleeps '+sleeps+'<br/>'+bedrooms+' br '+bathrooms+' baths<br/><a href="'+linkText+'" target="_blank">More Details</a></td></tr></table>');
		});
  return marker;
}

// this function replaces the map with images
function display_images(){
	if(document.getElementById('photo-link'))
	{
		photo=document.getElementById('photo-link');
		photo.className='active-btn';
		
		
	}
	if(document.getElementById('map-link'))
	{
		mapLink=document.getElementById('map-link');
		mapLink.className='inactive-link';
		
	}
	if(document.getElementById('list-link'))
	{
		list=document.getElementById('list-link');
		list.className='inactive-link';
		
	}
	current_active_link = photo;			
	if(document.getElementById("photos_info"))
		document.getElementById("photos_info").style.display="block";
	if(document.getElementById("map_info"))
		document.getElementById("map_info").style.display="none";
	if(document.getElementById("list-info"))
		document.getElementById("list-info").style.display="none";
	
}

// this function used to display the map by not showing the photos
function display_map()
{
	
	if(document.getElementById('map-link'))
	{
		mapLink=document.getElementById('map-link');
		mapLink.className='active-btn';
	}
	if(document.getElementById('photo-link'))
	{
		photo=document.getElementById('photo-link');
		photo.className='inactive-link';
	}
	if(document.getElementById('list-link'))
	{
		list=document.getElementById('list-link');
		list.className='inactive-link';
		
	}	
	current_active_link = mapLink;
	if(document.getElementById("map_info"))
		document.getElementById("map_info").style.display="block";
	if(document.getElementById("photos_info"))
		document.getElementById("photos_info").style.display="none";
	if(document.getElementById("list-info"))
		document.getElementById("list-info").style.display="none";

}

//this function is displays the list by not showing the photos and maps
function display_list()
{	
	if(document.getElementById('list-link'))
	{
		list=document.getElementById('list-link');
		list.className='active-btn';
	}
	if(document.getElementById('photo-link'))
	{
		photo=document.getElementById('photo-link');
		photo.className='inactive-link';
	}
	if(document.getElementById('map-link'))
	{
		mapLink=document.getElementById('map-link');
		mapLink.className='inactive-link';
	}	
	current_active_link = list;
	if(document.getElementById("list-info"))
		document.getElementById("list-info").style.display="block";
	if(document.getElementById("photos_info"))
		document.getElementById("photos_info").style.display="none";
	if(document.getElementById("map_info"))
		document.getElementById("map_info").style.display="none";
}

//This function is used to change the class of the div to hover
function changeClassToHover(obj){
	if(obj.className != "active-btn")
		obj.className = 'link-hover';
}
//This function is used to change the class of the div to normal (normal borders etc)
function changeClassToNormal(obj){
	if(obj != current_active_link && obj.className != "active-btn")
		obj.className = 'inactive-link';
	
}
// this will display the perticular attraction point of interests only
function display_attraction_map(attractionId)
{
	if( attractionId == "" || attractionId == null )
	{
		alert("attraction id is not passed as a parameter");
	}
	else
	{
		for(i=0;i<markerObjectAttraction.length;i++){
			if(markerObjectArray[i] != null)
				mapLink.removeOverlay(markerObjectArray[i]);
			if(markerObjectAttraction[i] == attractionId)
			{
				if(markerObjectArray[i] != null)
				map.addOverlay(markerObjectArray[i]);
			}
		}
	}
}

// this function is used to intiliaze the map and display the specific attraction details
function initialize_attraction_map(latitude, longitude, zoomLevel,attractionId, map_display_toggle)
{
	if( attractionId == "" || attractionId == null )
	{
		alert("attraction id is not passed as a parameter");
	}
	else if (GBrowserIsCompatible()) {
    	map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(latitude, longitude), zoomLevel);
		
	
		ui = map.getDefaultUI();
		ui.zoom.scrollwheel = false;
		map.setUI(ui) ;

		
		map.disableScrollWheelZoom();
		createAttractonMarkersArray(attractionId);
	}
	if(!map_display_toggle)
		if(document.getElementById("map_info"))
			document.getElementById("map_info").style.display="none";
}

// this function gets the browser details and sets the photviewer width
function setPVHeight(width)
{
	var browser=navigator.appName;
	if(browser=="Microsoft Internet Explorer")
	{
		width=width-2;
		if(document.getElementById("PVImg"))
			document.getElementById("PVImg").style.height=width;
	}
}

// this funcion is used to  open the link
function gotoProperty(url)
{

	if(url != '' && url != null)
		window.location=url;
}
// this funcion is used to check if particular check box is existead in form or not
function checkTheCheckbox(lod)
{
	lodgingChecked=0;
	for(k=0;k<document.poiCheckBoxesForm.length;k++){
		if (document.poiCheckBoxesForm[k].type=="checkbox" && document.poiCheckBoxesForm[k].name=="lodging" )
		{
			if(document.poiCheckBoxesForm[k].checked){
				if(lod==document.poiCheckBoxesForm[k].value)
				{
					lodgingChecked=1;
					break;
				}
			}
		}
	}
	//alert(lod);
	return lodgingChecked;
}