// GLOBALS
var map;
var zoom;
var sh_sidebar_TOG = "1";
var infobox;

var map_pin_marker = Array();

// INITIALIZE MAP
function initialize()  {
	// GET FILTERS FOR FOOTER
	sh_map_filters();
	// CREATE MAP
	map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
	// DROP MAP PINS
	sh_map_pin_setup();
	// SET UP INFOBOX
	//sh_map_infobox_setup();
	//navigator.geolocation.getCurrentPosition();
	// SET MAP BOUNDS TO ALL MARKERS
	//sh_map_bounds_setup();
};
// SET MAP BOUNDS
function sh_map_bounds_setup() {

// NEED TO PASS LAT/LNG ONLY, NOT THE ENTIRE map_pin_marker ARRAY

	var bounds = new google.maps.LatLngBounds ();

	for (var i = 0, LtLgLen = map_pin_marker.length; i < LtLgLen; i++) {
		bounds.extend (map_pin_marker[i]);
	}
	map.fitBounds(bounds);
}
// SET UP MAP PINS
function sh_map_pin_setup() {
    for (var i = 0; i < sh_map_pins.length; i++) {
		// MAKE SURE THERE ARE VIEWPOINTS AT THIS LOCATION
		if(sh_map_pins[i][5] != 0) {
    		// ASSIGN MAP PIN ICON BASED ON # OF VIEWPOINTS
    		var image = sh_map_pin_icon(sh_map_pins[i][5],'off');
	    	// ADD MARKER
			map_pin_marker[i] = new google.maps.Marker({
				position: new google.maps.LatLng(sh_map_pins[i][2], sh_map_pins[i][3]),
				map: map,
				icon: image,
				zIndex: sh_map_pins[i][0]
			});
			// MAP PIN MOUSEOVER
			sh_map_pin_mouseover(map_pin_marker[i], i, sh_map_pins[i][0], sh_map_pins[i][5], sh_map_pins[i][1], sh_map_pins[i][4]);
			//MAP PIN MOUSEOUT
			sh_map_pin_mouseout(map_pin_marker[i], i, sh_map_pins[i][0]);
			// MAP PIN CLICK
			sh_map_pin_click(map_pin_marker[i], i, sh_map_pins[i][0]);
		}
    }
};

// Map Pin Hide

	function sh_map_pin_hide(marker_index)
	{
		map_pin_marker[marker_index].setMap(null);
		map_pin_array[marker_index]['show_flag'] = 0;
	}

	function sh_map_pin_hide_special(marker_index)
	{
		map_pin_marker[marker_index].setMap(null);
	}


// Map Pin Show


	function sh_map_pin_show(marker_index)
	{
		var image = sh_map_pin_icon(sh_map_pins[marker_index][5],'off');
	    	// ADD MARKER

			map_pin_marker[marker_index] = new google.maps.Marker({
				position: new google.maps.LatLng(sh_map_pins[marker_index][2], sh_map_pins[marker_index][3]),
				map: map,
				icon: image,
				zIndex: sh_map_pins[marker_index][0]
			});
			// MAP PIN MOUSEOVER
			sh_map_pin_mouseover(map_pin_marker[marker_index], i, sh_map_pins[marker_index][0], sh_map_pins[marker_index][5], sh_map_pins[marker_index][1], sh_map_pins[marker_index][4]);
			//MAP PIN MOUSEOUT
			sh_map_pin_mouseout(map_pin_marker[marker_index], i, sh_map_pins[marker_index][0]);
			// MAP PIN CLICK
			sh_map_pin_click(map_pin_marker[marker_index], i, sh_map_pins[marker_index][0]);

			map_pin_array[marker_index]['show_flag'] = 1;
	}

// MAP PIN MOUSEOVER
function sh_map_pin_mouseover(marker, i, pinid, total, title, img) {
	google.maps.event.addListener(marker, 'mouseover', (function(marker, i) {
		return function() {
			// CREATE BOX
			sh_map_infobox(title,total,img);
			// OPEN THE BOX
			infobox.open(map, this);
    		// ASSIGN CORRECT ICON
    		var image = sh_map_pin_icon(sh_map_pins[i][5],'on');
	    	// SET ICON
			this.setIcon(image);
		}
	})(marker, i));
};
// MAP PIN MOUSEOUT
function sh_map_pin_mouseout(marker, i, pinid) {
	google.maps.event.addListener(marker, 'mouseout', (function(marker, i) {
		return function() {
			// CLOSE THE BOX
			infobox.close(map, this);
    		// ASSIGN CORRECT ICON
    		var image = sh_map_pin_icon(sh_map_pins[i][5],'off');
	    	// SET ICON
			this.setIcon(image);
		}
	})(marker, i));
};


// MAP PIN CLICK





function sh_map_pin_click(marker, i, pinid) {
	google.maps.event.addListener(marker, 'click', (function(marker, i) {
		return function() {
			// GET VIEWPOINT DATA
			var content_url = application_url + '?display=viewpoint&location_id='+pinid;
			// UPDATE MODAL
			$.get(content_url, function(data) {
				$('#sh_map_modal').empty();
				$('#sh_map_modal').append(data);
			});
			// SHOW MODAL
			$('#sh_map_modal').modal('show');
			//initialize();
			$('#sh_map_modal').on('hidden.bs.modal', function () {
			    $('#sh_map_modal').empty();
			})
		}
	})(marker, i));
};


// MAP PIN AUTOMATICALLY LOAD AND SHOW


function sh_map_pin_auto_load(image_keyy)
{
	var content_url = application_base_url + 'vpimage-modal/' + image_key + '/';

	// UPDATE MODAL

	$.get(content_url, function(data) {
		$('#sh_map_modal').empty();
		$('#sh_map_modal').append(data);
	});

	// SHOW MODAL

	$('#sh_map_modal').modal('show');

	//initialize();

	$('#sh_map_modal').on('hidden.bs.modal', function () {
		$('#sh_map_modal').empty();
	})
}


// ASSIGN CORRECT MAP PIN ICON
function sh_map_pin_icon(total,state) {
	// CREATE CASE
	// SET UP VARS
	/*
	switch(state) {
		case "on":
			break;
		case "off":
			break;
		case "clicked"
			break;
	}
	*/
	var sh_map_pin_num;
	var sh_map_pin_prefix;
	var sh_map_pin_suffix = '.png';
	var sh_icon_path = 'https://storage.googleapis.com/google-code-archive-downloads/v2/code.google.com/google-maps-icons/';
	// ADD A LEADING ZERO IF THE TOTAL IS LESS THAN 10 (FOR THIS ICON SET ONLY)
	total >= 10 ? sh_map_pin_num = total : sh_map_pin_num = "0" + total;
	// SET RED OR BLACK MARKER BASED ON STATE (FOR THIS ICON SET ONLY)
	state == "on" ? sh_map_pin_prefix = "black" : sh_map_pin_prefix = "red";
	// RETURN THE RESULTING ICON PATH
	return sh_icon_path + sh_map_pin_prefix + sh_map_pin_num + sh_map_pin_suffix;
};

// MAP PIN FILTERS

var state_show_array = Array();


	function sh_map_filters() {

		var content_url = application_url + '?display=filters';

		$.get(content_url, function(data) {
			$('#sh_map_footer').empty();
			$('#sh_map_footer').append(data);
		});
	};


	function show_country(country)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_country'] == country)
			{
				sh_map_pin_show(i);
			}
		}
	}

	function hide_country(country)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_country'] == country)
			{
				sh_map_pin_hide(i);
			}
		}
	}


	function filter_by_country(country, current_country_index)
	{

		var limit = map_country_array.length;

		if(map_country_array[current_country_index]['show_flag'] == 1)
		{
			hide_country(country);
			map_country_array[current_country_index]['show_flag'] = 0;
		}
		else
		{
			// HIDE OTHER PINS
			for ( var i = 0; i < limit; i++ ) {

				if(map_country_array[i]['show_flag'] == 0) {

					hide_country(map_country_array[i]['locations_country']);
				}
			}
			show_country(country);
			map_country_array[current_country_index]['show_flag'] = 1;
		}
	}


	function show_state(state)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_state'] == state)
			{
				sh_map_pin_show(i);
			}
		}
	}


	function hide_state(state)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_state'] == state)
			{
				sh_map_pin_hide(i);
			}
		}
	}


	function filter_by_state(state, current_state_index)
	{

		var limit = map_state_array.length;

		if(map_state_array[current_state_index]['show_flag'] == 1)
		{
			hide_state(state);
			map_state_array[current_state_index]['show_flag'] = 0;
		}
		else
		{
			// HIDE OTHER PINS
			for ( var i = 0; i < limit; i++ ) {

				if(map_state_array[i]['show_flag'] == 0) {

					hide_state(map_state_array[i]['locations_state']);
				}
			}
			show_state(state);
			map_state_array[current_state_index]['show_flag'] = 1;
		}
	}


	function show_park(park)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_name'] == park)
			{
				sh_map_pin_show(i);
			}
		}
	}


	function hide_park(park)
	{
		limit = map_pin_array.length;

		for(i = 0; i < limit; i++)
		{
			if(map_pin_array[i]['locations_name'] == park)
			{
				sh_map_pin_hide(i);
			}
		}
	}

	function filter_by_park(park, current_park_index)
	{

		var limit = map_park_array.length;

		if(map_park_array[current_park_index]['show_flag'] == 1)
		{
			hide_park(park);
			map_park_array[current_park_index]['show_flag'] = 0;
		}
		else
		{
			// HIDE OTHER PINS
			for ( var i = 0; i < limit; i++ ) {

				if(map_park_array[i]['show_flag'] == 0) {

					hide_park(map_park_array[i]['locations_name']);
				}
			}
			show_park(park);
			map_park_array[current_park_index]['show_flag'] = 1;
		}
	}

	var kid_friendly_show_flag = 0;

	function filter_by_kid_friendly()
	{
		var limit = map_pin_array.length;

		if ( kid_friendly_show_flag == 0 ) {

			for ( i = 0; i < limit; i++ ) {

				sh_map_pin_hide(i);

				if ( map_pin_array[i]['kid_friendly'] == '1' ) {

					sh_map_pin_show(i);

				}
			}

			kid_friendly_show_flag = 1;

		} else {

			for ( i = 0; i < limit; i++ ) {

				sh_map_pin_hide(i);

				if ( map_pin_array[i]['kid_friendly'] == '1' ) {

					sh_map_pin_hide(i);

				}
			}

			kid_friendly_show_flag = 0;
		}

	}


	function filter_by_wheelchair_access()
	{
		var limit = map_pin_array.length;

		if($('#wheelchair_accessible_checkbox').attr('checked'))
		{
			for(i = 0; i < limit; i++)
			{
				if(map_pin_array[i]['wheel_chair_access'] == '0')
				{
					sh_map_pin_hide_special(i);
				}
			}
		}
		else
		{
			for(i = 0; i < limit; i++)
			{
				if(map_pin_array[i]['wheel_chair_access'] == '0')
				{
					if(map_pin_array[i]['show_flag'] == 1)
					{
						sh_map_pin_show(i);
					}
				}
			}
		}
	}


// Future functionality in case someone purchases an entire location.

	function filter_by_my_viewpoints(checkbox_reference)
	{
		/* alert('my viewpoints');

		var limit = map_pin_array.length;

		if($('#my_viewpoints_checkbox').attr('checked'))
		{
			for(i = 0; i < limit; i++)
			{
				if(map_pin_array[i]['purchased_flag'] == '1')
				{
					sh_map_pin_hide_special(i);
				}
			}
		}
		else
		{
			for(i = 0; i < limit; i++)
			{
				if(map_pin_array[i]['purchased_flag'] == '0')
				{
					if(map_pin_array[i]['show_flag'] == 1)
					{
						sh_map_pin_show(i);
					}
				}
			}
		}*/
	}


// INFOBOX
function sh_map_infobox(title, total, img) {
	// CREATE INFOBOX FOR MAP PIN MOUSEOVERS (Google infobox.js plugin)
	infobox = new InfoBox({
		//content: document.getElementById("infobox"),
		disableAutoPan: false,
		//maxWidth: 410,
		pixelOffset: new google.maps.Size(10, -110),
		zIndex: null,
		boxStyle: {
			boxClass: "panel panel-default",
			color: "black",
			background: "transparent",
			opacity: 1
			//width:410
		},
		closeBoxURL:"",
		infoBoxClearance: new google.maps.Size(1, 1)
	});
	infobox.setContent('<div class="sh_popup_con">'+
		'<div class="sh_popup_arrow">'+
		'&laquo;'+
		'</div>'+
		'<div class="sh_popup_body">'+
			'<div class="panel panel-success">'+
				'<div class="panel-heading">'+
					'<h4>'+title+'</h4>'+
					'<span class="badge">'+
							total+
							'&nbsp;Viewpoints'+
					'</span><span class="pull-right">(click map pin for more info)</span>'+
				'</div>'+
				'<div class="panel-body">'+
					'<img width="300" src="/img/datapoints/med/'+img+'">'+
				'</div>'+
			'</div>'+
		'</div>'+
	'</div>');
}

function sh_viewpoint_list_click(lid, vid) {

	// alert("clicked:"+vid);
	// GET VIEWPOINT DATA

	var content_url = application_url + '?display=viewpoint&location_id='+lid+'&viewpoint_id='+vid;

	// alert(content_url);

	// UPDATE MODAL
	$.get(content_url, function(data) {
		$('#sh_map_modal').empty();
		$('#sh_map_modal').append(data);
	});
	// SHOW MODAL
	$('#sh_map_modal').modal('show');

	$('#sh_map_modal').on('hidden.bs.modal', function () {
	    $('#sh_map_modal').empty();
	});
};
// ZOOM IN & OUT
function sh_zoom(a) {
	map.setZoom(map.getZoom() + a);
};
// CENTER ON BROWSER'S GEOLOCATION
function sh_near_me() {
	// CHECK FOR HTML5 GEOLOCATION SUPPORT
	if(navigator.geolocation) {
		// GET GEOLOCATION
		navigator.geolocation.getCurrentPosition(function(position) {
			// SET GEOLOCATION
			var pos = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
			// RESET ZOOM IN CASE USER IS ZOOMED WAAAAAAY IN;  REPLACE VALUE WITH VAR
			map.setZoom(6);
			// CENTER MAP ON GEOLOCATION
			map.setCenter(pos);
    	});
	} else {
    	// THROW EXCEPTION
		alert("NO GPS FOR YOU!");
	}
};
// MAP STYLES ARRAY
var styleArray = [
			          { featureType: 'all',
			            stylers: [
			              { saturation: -80 }
			            ]
			          },
			          { featureType: 'road',
			            elementType: 'geometry',
			            stylers: [
			              { hue: '#ff8800' },
			              { gamma: 1 },
			              { saturation: 100 }
			            ]
			          },
			          {
					    featureType: 'water',
					    elementType: 'all',
					    stylers: [
					      { hue: '#007fff' },
					      { lightness: -30 },
					      { saturation: 20 }
					    ]
					  },
					  {
					    featureType: 'water',
					    elementType: 'labels',
					    stylers: [
					      { visibility: 'off' },
					    ]
					  },
					  {
					    featureType: 'administrative.locality',
					    elementType: 'labels',
					    stylers: [
					      { visibility: 'off' },
					    ]
					  },
					  {
					    featureType: 'administrative.neighborhood',
					    elementType: 'labels',
					    stylers: [
					      { visibility: 'off' },
					    ]
					  },
					  {
					    featureType: 'administrative.locality',
					    elementType: 'labels',
					    stylers: [
					      { visibility: 'off' },
					    ]
					  }
];
// MAP DEFAULT SETTINGS
var mapProp = {
	//center:new google.maps.LatLng(48.7, -113.),
	center:new google.maps.LatLng(39.5,-98.35),
	zoom:4,
	minZoom:3,
	mapTypeId:google.maps.MapTypeId.TERRAIN,
	styles:styleArray,
	disableDefaultUI:true
};

// MAP INIT
google.maps.event.addDomListener(window, 'load', initialize);

// DROP UP MENU CHECKBOX HANDLER
$('.dropdown-menu').on('click', function(e) {
    if($(this).hasClass('dropdown-menu-form')) {
        e.stopPropagation();
    }
});