/**
 *
 * This contains the javascript that is specific to single photospot pages
 *
 *
 *
 *
 *
 */
//create some global variables
var googleMap = null;

// marker containers //
var photospots = new Array();


jQuery(document).ready(function() {

	initialize_google();
	

});


function initialize_google(){
	
	var latlng = new google.maps.LatLng(53.45,-1.30);
	var myOptions = {
		zoom: 4,
		mapTypeControl: true,
		mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
		navigationControl: true,
		navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
		center: latlng,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	};
	googleMap = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	
	
	populateMapData();

	
}

function setMapsPosition(Lat,Lng,zoom){

	//do google map
	var gPos = new google.maps.LatLng(Lat,Lng);
	googleMap.setCenter(gPos);

	//do OS map
	var osLngLat = new OpenLayers.LonLat( Lng , Lat );
	var gridProjection = new OpenSpace.GridProjection();
	var osPos = gridProjection.getMapPointFromLonLat(osLngLat);
	osMap.setCenter(osPos);
	
	//do zooming
	switch( zoom ){
		case 'close':
		googleMap.setZoom(15);
		osMap.zoomTo(8);
		break;
		default:
		googleMap.setZoom(8);
		osMap.zoomTo(3);
		break;
	}
}




/**
 *	Gets the home value set for the user
 *	and centres the maps there
 */
function populateMapData(){

	
	jQuery('span.coords').each(function(i){
			
		var coords = coordsFromString( jQuery(this).text() );
		placePhotospotMarker( coords[0] , coords[1] , i+1 );
		
		});

	//now set the map viewport
	//northeast
	
	ne = new google.maps.LatLng(jQuery('#searchparams span.north').text(),jQuery('#searchparams span.east').text());
	//southwest
	sw = new google.maps.LatLng(jQuery('#searchparams span.south').text(),jQuery('#searchparams span.west').text());
	
	bounds = new google.maps.LatLngBounds(sw,ne);
	googleMap.fitBounds(bounds);





}





/**
 * Creates a photospot marker and updates the form with the details.
 */
function placePhotospotMarker( Lat, Lng , num ){
		
	//get the location objects
	var GoogleLatLng = new google.maps.LatLng(Lat,Lng); //The google object
		
	//get the url for the marker
	var markerImageUrl = DOMAIN + 'themes/default/images/photospot_marker_'+num+'.png';
		
	//Create the google MarkerImage
	var image = new google.maps.MarkerImage( markerImageUrl,
		// This marker is 20 pixels wide by 32 pixels tall.
		new google.maps.Size(34, 40),
		// The origin for this image is 0,0.
		new google.maps.Point(0,0),
		// The anchor for this image is the base of the flagpole at 0,32.
		new google.maps.Point(16, 40)
		);

	//Create the google Marker - this is automatically attached to the map.	
	googlePhotospot = new google.maps.Marker({
		position: GoogleLatLng,
		map: googleMap,
		flat: true,
		icon: image,
		clickable: false,
		draggable: false,
		title: 'Photospot'
		});
	
}


function coordsFromString( latLngString ){
		
		var newstring = latLngString.replace('(','');
		newstring = newstring.replace(')','');
		var latLng = newstring.split(',');
		return latLng;
		
	}