//**********************
//stateMap
//**********************
function stateMap(state) {
	// Grabs user's geolocation information from browser
	if(google.loader.ClientLocation)
	{
		visitor_lat = google.loader.ClientLocation.latitude;
		visitor_lon = google.loader.ClientLocation.longitude;
		radiusVar = 50;
	}
	
	var myLatlng = new google.maps.LatLng(visitor_lat, visitor_lon);
	var myOptions = {
		zoom: 11,
		center: myLatlng,
		mapTypeControl: false,
		streetViewControl: false,
		navigationControlOptions: {
			style: google.maps.NavigationControlStyle.SMALL
		},
		mapTypeId: google.maps.MapTypeId.ROADMAP,
		draggable: true
	}
	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // creates instance of map	
	
	bounds = new google.maps.LatLngBounds(); //initialize latlng bound variable
	myXml = "../genxml.php?state=" + state; // build xml url for state
		
	// parse xml url to get markers
	downloadUrl(myXml, function(data) {
		var markers = data.documentElement.getElementsByTagName("marker");
		
		var maxFeatured = 6; //max number of featured divs to display
		
		//$('.featuredShopDiv').remove(); // clears old featured shops
		
		for (var i = 0; i < markers.length; i++) {
			var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); 
			var contentHTML = createInfoWindowHTML(markers[i]);
			var marker = createMarker(markers[i].getAttribute("name"), markers[i].getAttribute("type"), latlng, contentHTML);
			markersArray.push(marker);
			if((markers[i].getAttribute("type") == "featured") && (maxFeatured > 0))
			{
				$('#rightContent').append(createFeaturedDiv(markers[i]));
				maxFeatured = maxFeatured - 1;	
			}
			bounds.extend(latlng);
			map.fitBounds(bounds);
		}
	});

	
};

//**********************
//cityMap
//**********************
function cityMap(state, city) {
	// Grabs user's geolocation information from browser
	if(google.loader.ClientLocation)
	{
		visitor_lat = google.loader.ClientLocation.latitude;
		visitor_lon = google.loader.ClientLocation.longitude;
		radiusVar = 50;
	}
	
	var myLatlng = new google.maps.LatLng(visitor_lat, visitor_lon);
	var myOptions = {
		zoom: 11,
		center: myLatlng,
		mapTypeControl: false,
		streetViewControl: false,
		navigationControlOptions: {
			style: google.maps.NavigationControlStyle.SMALL
		},
		mapTypeId: google.maps.MapTypeId.ROADMAP,
		draggable: true
	}
	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // creates instance of map	
	
	bounds = new google.maps.LatLngBounds(); //initialize latlng bound variable
	myXml = "http://www.headshops.com/genxml.php?state=" + state + "&city=" + city; // build xml url for state
		
	// parse xml url to get markers
	downloadUrl(myXml, function(data) {
		var markers = data.documentElement.getElementsByTagName("marker");
		
		var maxFeatured = 6; //max number of featured divs to display
		
		//$('.featuredShopDiv').remove(); // clears old featured shops
		
		for (var i = 0; i < markers.length; i++) {
			var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); 
			var contentHTML = createInfoWindowHTML(markers[i]);
			var marker = createMarker(markers[i].getAttribute("name"), markers[i].getAttribute("type"), latlng, contentHTML);
			markersArray.push(marker);
			if((markers[i].getAttribute("type") == "featured") && (maxFeatured > 0))
			{
				$('#rightContent').append(createFeaturedDiv(markers[i]));
				maxFeatured = maxFeatured - 1;	
			}
			bounds.extend(latlng);
			map.fitBounds(bounds);
		}
	});

	
};

//**********************
//searchMap
//**********************
function searchMap(address, radius) {
	eraseMarkers();
	bounds = new google.maps.LatLngBounds(); //initialize latlng bound variable
	myXml = "genxmlradius.php?address=" + address + "&radius=" + radius; // build xml url with address + radius
	
	//uppercase address
	address = address.toLowerCase().replace(/\b[a-z]/g, function(letter) {
		return letter.toUpperCase();
	});

	$('#locationHeader').text('Displaying Head Shops Near ' + address);
	
	// parse xml url to get markers
	downloadUrl(myXml, function(data) {
		var markers = data.documentElement.getElementsByTagName("marker");
		
		var maxFeatured = 6; //max number of featured divs to display
		
		$('.featuredShopDiv').remove(); // clears old featured shops
		
		for (var i = 0; i < markers.length; i++) {
			var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); 
			var contentHTML = createInfoWindowHTML(markers[i]);
			var marker = createMarker(markers[i].getAttribute("name"), markers[i].getAttribute("type"), latlng, contentHTML);
			markersArray.push(marker);
			if((markers[i].getAttribute("type") == "featured") && (maxFeatured > 0))
			{
				$('#rightContent').append(createFeaturedDiv(markers[i]));
				maxFeatured = maxFeatured - 1;	
			}
			bounds.extend(latlng);
			map.fitBounds(bounds);
		}
	});
};



//**********************
//updateMap
//**********************
function updateMap(lat, lng, radius) {
	eraseMarkers();
	bounds = new google.maps.LatLngBounds(); //initialize latlng bound variable
	myXml = "genxmlradius.php?lat=" + lat + "&lon=" + lng + "&radius=" + radius; // build xml url with address + radius
	
	// parse xml url to get markers
	downloadUrl(myXml, function(data) {
		var markers = data.documentElement.getElementsByTagName("marker");
		
		var maxFeatured = 6; //max number of featured divs to display
		
		$('.featuredShopDiv').remove(); // clears old featured shops
		
		for (var i = 0; i < markers.length; i++) {
			var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng"))); 
			var contentHTML = createInfoWindowHTML(markers[i]);
			var marker = createMarker(markers[i].getAttribute("name"), markers[i].getAttribute("type"), latlng, contentHTML);
			markersArray.push(marker);
			if((markers[i].getAttribute("type") == "featured") && (maxFeatured > 0))
			{
				$('#rightContent').append(createFeaturedDiv(markers[i]));
				maxFeatured = maxFeatured - 1;	
			}
			bounds.extend(latlng);
			map.fitBounds(bounds);
		}
	});
};

//**********************
//eraseMarkers
//**********************
function eraseMarkers() {
	if (markersArray) {
		for (i in markersArray) {
			markersArray[i].setMap(null);
		}
		markersArray.length = 0;  // would actually erase all markers from array not just hide on map
	}

};

//**********************
//createFeaturedDiv
//**********************
function createFeaturedDiv(marker) {
	var cityTemp = marker.getAttribute("city").replace(/-/gi, "_");
	var strHTML = '<a href=\"' + 'http://www.headshops.com/' + marker.getAttribute("state").replace(/ /gi, "-") + '/' + cityTemp.replace(/ /gi, "-") + '/' + marker.getAttribute("id") +  '/\"><div class=\"featuredShopDiv\">';
	imageTemp = marker.getAttribute("image");
	if(imageTemp != "")
	{
		strHTML = strHTML + '<img src=\"http://www.headshops.com/shop-images/' + imageTemp + '\" class=\"featuredShopImg\">';
	}
	strHTML = strHTML + '<div class=\"featuredShopText\">';
	strHTML = strHTML + marker.getAttribute("name") + '<br>';
	strHTML = strHTML + marker.getAttribute("street") + '<br>';
	strHTML = strHTML + marker.getAttribute("city") + ', ' + marker.getAttribute("state") + ' ' + marker.getAttribute("postalcode") + '<br>';
	strHTML = strHTML + marker.getAttribute("phone") + '<br>';
	strHTML = strHTML + '</div></div></a>';	
	return strHTML;
};

//**********************
//createInfoWindowHTML
//**********************
function createInfoWindowHTML(marker) {
		var cityTemp = marker.getAttribute("city").replace(/-/gi, "_");
//	var strHTML =  '<div class=\"mapInfowindowImage\"><img src=\"http://www.headshops.com/shop-images/' + marker.getAttribute("image") + '\" width=\"80\" height\"60\"><div 			class=\"mapInfowindowText\"><b>' + marker.getAttribute("name") + '</b><br>' + marker.getAttribute("street") + '<br>' + marker.getAttribute("city") + ', ' + 	
var strHTML = '<a href=\"' + 'http://www.headshops.com/' + marker.getAttribute("state").replace(/ /gi, "-") + '/' + cityTemp.replace(/ /gi, "-") + '/' + marker.getAttribute("id") + '/\"><div class=\"featuredShopDiv\">';

	strHTML = strHTML + '<div><b>' + marker.getAttribute("name") + '</b><br>' + marker.getAttribute("street") + '<br>' + marker.getAttribute("city") + ', ' + 				marker.getAttribute("state") + ' ' + marker.getAttribute("postalcode") + '<br><br>click here to see more...</div></a>';     
	return strHTML;
};

//**********************
//capitalize 
//**********************
String.prototype.capitalize = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}


//**********************
//createMarker
//**********************
function createMarker(name, listingType, latlng, infoContent) {
	if(listingType == "standard") //set marker icon and animation for standard listing Shops
	{
		var marker = new google.maps.Marker({position: latlng, map: map, zIndex: Math.round(latlng.lat()*-100000)<<5, icon: 'http://www.headshops.com/images/waterpipe2.png'});
	}
	else if(listingType == "featured") //set marker icon and animation for featured listing Shops
	{
		var marker = new google.maps.Marker({position: latlng, map: map, zIndex: google.maps.Marker.MAX_ZINDEX, icon: 'http://www.headshops.com/images/waterpipe.png'});
		marker.setAnimation(google.maps.Animation.BOUNCE);
	}
	
	google.maps.event.addListener(marker, "click", function() {
		if (infowindow) infowindow.close();
		infowindow = new google.maps.InfoWindow({
			content: infoContent
			//maxWidth: 500
		});
		//infowindow.setContent(infoContent);
		infowindow.open(map, marker);
	});
	return marker;
};


//**********************
//initialize
//**********************
function initialize() {
	var browserSupportFlag =  new Boolean();
		
	// Grabs user's geolocation information from browser
	if(google.loader.ClientLocation)
	{
		visitor_lat = google.loader.ClientLocation.latitude;
		visitor_lon = google.loader.ClientLocation.longitude;
		visitor_city = google.loader.ClientLocation.address.city.capitalize();
		visitor_state = google.loader.ClientLocation.address.region.toUpperCase();
		visitor_region = google.loader.ClientLocation.address.region;
		visitor_country = google.loader.ClientLocation.address.country;
		visitor_countrycode = google.loader.ClientLocation.address.country_code;
		visitor_postalcode = null;
		radiusVar = 25;
		document.getElementById('radiusDropdown').value = radiusVar;
	}
	
	$('#locationHeader').text('Displaying Head Shops Near ' + visitor_city + ", " + visitor_state);
	
	var myLatlng = new google.maps.LatLng(visitor_lat, visitor_lon);
	var myOptions = {
		zoom: 11,
		center: myLatlng,
		mapTypeControl: false,
		streetViewControl: false,
		navigationControlOptions: {
			style: google.maps.NavigationControlStyle.SMALL
		},
		mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	
	map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // creates instance of map	
	updateMap(visitor_lat, visitor_lon, radiusVar);
		
		
		// when map is dragged
		google.maps.event.addListener(map, "dragend", function() {
			//var newCenter = map.getCenter();
			//updateMap(newCenter.lat(), newCenter.lng(), document.getElementById('radiusDropdown').value);
		});
	
};

//**********************
//initializeShopPage
//**********************
function initializeShopPage(lat, lng) {
	var browserSupportFlag =  new Boolean();
		
	var myLatlng = new google.maps.LatLng(lat, lng);
	var myOptions = {
		zoom: 15,
		center: myLatlng,
		mapTypeControl: false,
		streetViewControl: false,
		navigationControlOptions: {
			style: google.maps.NavigationControlStyle.SMALL
		},
		mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	
	map = new google.maps.Map(document.getElementById("map_canvasShopPage"), myOptions); // creates instance of map	
	var latlng = new google.maps.LatLng(parseFloat(lat), parseFloat(lng)); 
	var marker = new google.maps.Marker({position: latlng, map: map, zIndex: Math.round(latlng.lat()*-100000)<<5, icon: 'http://www.headshops.com/images/waterpipe2.png'});
	
};