/************ FUNCTIONS.JS ************************/
/*************************************************/
/**
 * @package BasicGoogleMapsPlacemarks
 * @author Ian Dunn <ian@iandunn.name>
 * @link http://wordpress.org/extend/plugins/basic-google-maps-placemarks/
 */


/**
 * Wrapper function to safely use $
 * @author Ian Dunn <ian@iandunn.name>
 */
function bgmp_wrapper( $ )
{
	// @todo - figure out if wrapper bad for memory consumption (https://developer.mozilla.org/en/JavaScript/Reference/Functions_and_function_scope#Efficiency_considerations)
		// ask on stackoverflow
	
	$.bgmp = 
	{
		/**
		 * Main entry point
		 * @author Ian Dunn <ian@iandunn.name>
		 */
		init : function()
		{
			$.bgmp.name					= 'Basic Google Maps Placemarks';
			$.bgmp.canvas				= document.getElementById( 'bgmp_map-canvas' );		// We have to use getElementById instead of a jQuery selector here in order to pass it to the Maps API.
			$.bgmp.previousInfoWindow	= undefined;
			$.bgmp.map					= undefined;
			$.bgmp.markerClusterer		= undefined;
			$.bgmp.markers				= [];
			
			
			//custom stuff for Filters Jesse 13/Dec
			$.bgmp.markers.all = [];

			
			// @todo make this loop through array instead of manual. also add any other numbers
			bgmpData.options.zoom					= parseInt( bgmpData.options.zoom ),
			bgmpData.options.latitude				= parseFloat( bgmpData.options.latitude );
			bgmpData.options.longitude				= parseFloat( bgmpData.options.longitude );
			bgmpData.options.clustering.maxZoom		= parseInt( bgmpData.options.clustering.maxZoom );
			bgmpData.options.clustering.gridSize	= parseInt( bgmpData.options.clustering.gridSize );
								
			if( $.bgmp.canvas ) {
				$.bgmp.buildMap();
			}
			else
				$( $.bgmp.canvas ).html( $.bgmp.name + " error: couldn't retrieve DOM elements." );
		},
		
		/**
		 * Pull in the map options from Wordpress' database and create the map
		 * @author Ian Dunn <ian@iandunn.name>
		 */
		buildMap : function()
		{
			var mapOptions;
			
			if( bgmpData.options.mapWidth == '' || bgmpData.options.mapHeight == '' || bgmpData.options.latitude == '' || bgmpData.options.longitude == '' || bgmpData.options.zoom == '' || bgmpData.options.infoWindowMaxWidth == '' )
			{
				// @todo update w/ cluster options?
				
				$( $.bgmp.canvas ).html( $.bgmp.name + " error: map options not set." );
				return;
			}
			
			mapOptions = 
			{
				'zoom'						: bgmpData.options.zoom,
				'center'					: new google.maps.LatLng( bgmpData.options.latitude, bgmpData.options.longitude ),
				'mapTypeId'					: google.maps.MapTypeId[ bgmpData.options.type ],
				'mapTypeControl'			: bgmpData.options.typeControl == 'off' ? false : true,
				'mapTypeControlOptions'		: { style: google.maps.MapTypeControlStyle[ bgmpData.options.typeControl ] },
				'navigationControl'			: bgmpData.options.navigationControl == 'off' ? false : true,
				'navigationControlOptions'	: { style: google.maps.NavigationControlStyle[ bgmpData.options.navigationControl ] },
				'streetViewControl'			: bgmpData.options.streetViewControl
			};
			
			// Override default width/heights from settings
			$( '#bgmp_map-canvas' ).css( 'width', bgmpData.options.mapWidth ); //'100%');		// @todo use $.bgmp.canvas intead of hardcoding it?
			$( '#bgmp_map-canvas' ).css( 'height', bgmpData.options.mapHeight ); // '100%');   Making map responsive. 
			// @todo this prevents users from using their own stylesheet?
			
			
			// Create the map
			try
			{
				$.bgmp.map = new google.maps.Map( $.bgmp.canvas, mapOptions );
			}
			catch( e )
			{
				$( $.bgmp.canvas ).html( $.bgmp.name + " error: couln't build map." );
				if( window.console )
					console.log( 'bgmp_buildMap: '+ e );
					
				return;
			}
			
			$.bgmp.addPlacemarks( $.bgmp.map );		// @todo not supposed to add them when clustering is enabled? http://www.youtube.com/watch?v=Z2VF9uKbQjI
			
			if( bgmpData.options.clustering.enabled )
			{
				$.bgmp.markerCluster = new MarkerClusterer(		// @todo should be .markerClusterer ?
					$.bgmp.map,
					$.bgmp.markers,
					{
						maxZoom		: bgmpData.options.clustering.maxZoom,
						gridSize	: bgmpData.options.clustering.gridSize,
						styles		: bgmpData.options.clustering.styles[ bgmpData.options.clustering.style ]
					}
				);
			}
		},
		
		/**
		 * Checks if the value is an integer. Slightly modified version of original.
		 * @author Invent Partners
		 * @link http://www.inventpartners.com/content/javascript_is_int
		 * @param mixed value
		 * @return bool
		 */
		isInt : function( value )
		{
			if( !isNaN( value ) && parseFloat( value ) == parseInt( value ) )
				return true;
			else
				return false;
		},

		/**
		 * Pull the placemark posts from Wordpress' database and add them to the map
		 * @author Ian Dunn <ian@iandunn.name>
		 * @param object map Google Maps map
		 */
		addPlacemarks : function( map )
		{
			// @todo - should probably refactor this since you pulled out the ajax. update phpdoc too
			
			if( bgmpData.markers.length > 0 )
			{
				for( var m in bgmpData.markers )
				{
					$.bgmp.createMarker(
						map,
						bgmpData.markers[ m ][ 'title' ],
						bgmpData.markers[ m ][ 'latitude' ],
						bgmpData.markers[ m ][ 'longitude' ],
						bgmpData.markers[ m ][ 'details' ],
						bgmpData.markers[ m ][ 'icon' ],
						parseInt( bgmpData.markers[ m ][ 'zIndex' ] ),
						bgmpData.markers[ m ][ 'categories' ] //Added by Jesse 13/Dec
					);
				}
			}
		},

		/**
		 * Create a marker with an information window
		 * @author Ian Dunn <ian@iandunn.name>
		 * @param object map Google Maps map
		 * @param string title Placemark title
		 * @param float latituded
		 * @param float longitude
		 * @param string details Content of the infowinder
		 * @param string icon URL of the icon
		 * @param int zIndex The desired position in the placemark stacking order
		 * @param category array <-- added by Jesse 13/Dec
		 * @return bool True on success, false on failure
		 */
		createMarker : function( map, title, latitude, longitude, details, icon, zIndex, categories )
		{
			// @todo - clean up variable names
			
			var infowindowcontent, infowindow, marker;
			
			if( isNaN( latitude ) || isNaN( longitude ) )
			{
				if( window.console )
					console.log( "bgmp_createMarker(): "+ title +" latitude and longitude weren't valid." );
					
				return false;
			}
			
			if( icon == null )
			{
				// @todo - this check may not be needed anymore
				
				if( window.console )
					console.log( "bgmp_createMarker(): "+ title +"  icon wasn't passed in." );
				return false;
			}
			
			if( !$.bgmp.isInt( zIndex ) )
			{
				//if( window.console )
					//console.log( "bgmp_createMarker():  "+ title +" z-index wasn't valid." );	// this would fire any time it's empty
				
				zIndex = 0;
			}
			
			infowindowcontent = '<div class="bgmp_placemark"> <h3>'+ title +'</h3> <div>'+ details +'</div> </div>';
			
			try
			{
				infowindow = new google.maps.InfoWindow( {
					content		: infowindowcontent,
					maxWidth	: bgmpData.options.infoWindowMaxWidth
				} );
				
				// Replace commas with periods. Some (human) languages use commas to delimit the fraction from the whole number, but Google Maps doesn't accept that.
				latitude = parseFloat( latitude.replace( ',', '.' ) );
				longitude = parseFloat( longitude.replace( ',', '.' ) );
				
				marker = new google.maps.Marker( {
					'position'	: new google.maps.LatLng( latitude, longitude ),
					'map'		: map,
					'icon'		: icon,
					'title'		: title,
					'zIndex'	: zIndex
				} );
				
				//Store Markers inside an array based on their categories. Jesse 13/Dec
				for (var s in categories) {
					title = categories[s]['name'];
					if (!$.bgmp.markers[title]){
						$.bgmp.markers[title] = [];
						$.bgmp.markers.push(title);
					}
					$.bgmp.markers[title].push(marker); 
				}
				
				//Need to store ALL markers inside an array to compensate for the possibility of multiple categories. Jesse 13/Dec
				$.bgmp.markers.all.push( marker );
				
				google.maps.event.addListener( marker, 'click', function()
				{
					if( $.bgmp.previousInfoWindow != undefined )
						$.bgmp.previousInfoWindow.close();
					
					infowindow.open( map, marker );
					$.bgmp.previousInfoWindow = infowindow;
				} );
				
				return true;
			}
			catch( e )
			{
				//$( $.bgmp.canvas ).append( '<p>' + $.bgmp.name + " error: couldn't add map placemarks.</p>");		// add class for making red? other places need this too?	// @todo - need to figure out a good way to alert user that placemarks couldn't be added
				if( window.console )
					console.log( 'bgmp_createMarker: '+ e );
			}
		}
	}; // end bgmp
	
	// Kick things off...
	$( document ).ready( $.bgmp.init );
	
} // end bgmp_wrapper()

bgmp_wrapper( jQuery );



/************CUSTOM JAVASCRIPT************************/
/****************************************************/
$.geocoder;	
var html = '';	

$(document).ready(function(){
	//Add the Filtered Nav Div
	if ($('#map').length) {
		$('#map').append("<div id='filteredNav' /><hr /><div id='mapLocs' style='padding-left:30px;' />");
		$.each($.bgmp.markers, function(index, arr) {
			$('#filteredNav').append('<button class="fNav shown" value='+$.bgmp.markers[index]+''+'>'+$.bgmp.markers[index]+'</button>'); 			
		});
	}
	//Verify that there are categories. 
	if ($('#filteredNav').length > 0) {		
		//This isn't a good way to do this, but this will allow the ability to show multiple groups of markers. 		
		$('#filteredNav button').click(function() {
				if(!$(this).hasClass('shown')) {
					$(this).addClass('shown');
				} else { $(this).removeClass('shown'); }
			//Hide all markers
			$.each($.bgmp.markers.all, function(index, marker) {
				$.each(marker, function(key, value) {
					marker.setVisible(false);
				});
			});			
			//show only the markers that should be visible
			$('#filteredNav .shown').each(function() {
				var check = $(this).attr('value');				
				html = html + '<h3>'+check+'</h3><ul>';
				$.each($.bgmp.markers[check], function(index, marker) {
					$.each(marker, function(key, value) {
						marker.setVisible(true);
					});
					if($.bgmp.map.getBounds().contains(marker.getPosition())) {
						//html = html+'key: '+key+' = value: '+value+';<br /> ';					
						html = html +'<li style="list-style:none;height:35px;"><a style="cursor:pointer;" class="'+check+'-'+index+'"><img style="float:left;" src="'+marker['icon']+'" />';
						html = html +marker['title']+'</a></li>';					
					}
				});
				html = html+'</ul>';
			});
			$('#mapLocs').html(html);			
		});
		
		
		//Center Map on Marker Clicked
		$('#mapLocs').on('click','a', function(event) {
			event.preventDefault();
			var loc = $(this).attr('class').split('-');
			$.bgmp.map.panTo($.bgmp.markers[loc[0]][loc[1]].getPosition());
			$.bgmp.map.setZoom(15);
		});
	}


	//Override Search 
	$('form[id=mapSearchForm]').submit(function(e) { 
		e.preventDefault();
		codeAddress($(this).find('input[name="q"]').val());
	});
	
	//http://stackoverflow.com/questions/4338490/google-map-event-bounds-changed-triggered-multiple-times-when-dragging
	//https://developers.google.com/maps/documentation/javascript/events#EventListeners
	google.maps.event.addListener($.bgmp.map, 'center_changed', function () {
		window.setTimeout(function() {
			html = "";
			//window.alert('Timer Fired');
			$('#filteredNav .shown').each(function() {
				var check = $(this).attr('value');				
				html = html + '<h3>'+check+'</h3><ul>';
				$.each($.bgmp.markers[check], function(index, marker) {
					if($.bgmp.map.getBounds().contains(marker.getPosition())) {
						//html = html+'key: '+key+' = value: '+value+';<br /> ';					
						html = html +'<li style="list-style:none;height:35px;"><a style="cursor:pointer;" class="'+check+'-'+index+'"><img style="float:left;" src="'+marker['icon']+'" />';
						html = html +marker['title']+'</a></li>';					
					}
				});
				html = html+'</ul>';
			});
			$('#mapLocs').html(html);	
		}, 300);
	});
});


//Credit to: http://stackoverflow.com/questions/6140303/google-maps-v3-how-to-center-using-an-address-on-initialize
function codeAddress(address) {
    $.geocoder = new google.maps.Geocoder();
    $.geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
		$.bgmp.map.panTo(results[0].geometry.location);	
	  }
	});
}