$(document).ready(function(){

	var _mission = "";
	var _category = "";
	var _record_count = "";

	var base_url = "http://www.downtownportland.org/getting-around/";
	var init = false;

	// init map object & set center coords
	var map = new GMap2($("#map").get(0));
	var portlandOR = new GLatLng(45.5193269348145,-122.68000793457);
		map.setCenter(portlandOR, 14);
		map.addControl(new GSmallMapControl());
 
	//	Begin building map
	//	check for direct link in url string
	$.address.init(function(event) {

		//	set tmp value for list view
		$("#list").html("<div class='list_head'>&nbsp;Searching...</div>");

		// center the details overlay
		$("div#mask_map").center_mask();

		// check for #somevalue in url
		var record_id = $.address.value();

		if (record_id != "/") {

			if ( isNaN(record_id) ) {

				_mission = "category";
				_category = record_id;

				var st = "%";

				if (record_id == "MapIt") {
					st = "SmartPark";				
				}
				
		        GDownloadUrl(base_url+"data/singleCategory", function(data) {

					drawPins(data);

		        }, "search_string="+st, "application/x-www-form-urlencoded" );

			} else {

				//_mission = "single";
				// found something that isn't default
		        GDownloadUrl(base_url+"data/linked", function(data) {
	
					drawPins(data);
	
		        }, "search_string="+record_id, "application/x-www-form-urlencoded" );
					
				$('#details_content').load(base_url+"data/single/"+record_id, function(responseText){
	
					$("#message").hide();
					$("div#box").show();
					$("div#box").center();
	
				});

			}

		} else {

			// nothing found get all data
	        GDownloadUrl(base_url+"data", function(data) {
				drawPins(data);
	        }, "search_string=%", "application/x-www-form-urlencoded" );

		}

	});


	// Submit Search String
	// User submitted something for search
	 $("form").submit(function() {

		// clear existing values
		clearApp();

		// set tmp value
		$("#list").html("<div class='list_head'>&nbsp;Searching...</div>");

		// get search string from text field 
		var send = $("#search_string").val();

		// submit search string to php functions
        GDownloadUrl(base_url+"data", function(data) {
			drawPins(data);
        }, "search_string="+send, "application/x-www-form-urlencoded" );

	});


	function drawPins(data) {

		map.clearOverlays();

		// empty values for use later
		var pin = [];
		var markers = [];

		var categories_list = ["Hotels", "Dining", "Shopping" ];
		var markerGroups = { "Hotels": [], "Dining": [], "Parking": [], "Shopping": [] }; 

		// begin xml parsing
		var xml = GXml.parse(data);
		var records = xml.documentElement.getElementsByTagName("marker");

			_record_count = records.length; 
			
		if ( records.length	> 0 ) {	$("#list").html("");	}

//		if (init == false) {
//			$("#list").html("<div id='default_message' style='padding:10px 0 0 10px';>No Search performed</div>");
//		}

		init = true;

		for (var i = 0; i < records.length; i++) {

			var rec = records[i];

			var record_id 	= GXml.value( records[i].getElementsByTagName("record_id")[0]);
			var name 		= GXml.value( records[i].getElementsByTagName("business_name")[0] );

			var category 	= GXml.value( records[i].getElementsByTagName("category")[0] );
			var address 	= GXml.value( records[i].getElementsByTagName("address_1")[0] );
			var phone 		= GXml.value( records[i].getElementsByTagName("phone")[0] );
			var lat 		= GXml.value( records[i].getElementsByTagName("latitude")[0] );
			var lng 		= GXml.value( records[i].getElementsByTagName("longitude")[0] );
			var type 		= GXml.value( records[i].getElementsByTagName("category")[0] );
			var url 		= GXml.value( records[i].getElementsByTagName("url")[0] );
			var errata_1 	= GXml.value( records[i].getElementsByTagName("errata_1")[0] );

			var point 		= new GLatLng( parseFloat( lat ), parseFloat( lng ) );
			
			// this array contains the basic data for the windows
			pin[i] = {latlng: point, record_id: record_id, name: name, address: address, type: type, phone: phone, url:url, lat:lat, lng:lng, smartpark_key:errata_1};

			// default icon values
			var myIcon = new GIcon(G_DEFAULT_ICON);
				myIcon.image = base_url+"src/icons/"+type+".png";
				myIcon.iconAnchor = new GPoint(1, 1);
				myIcon.shadow = base_url+"src/icons/shadow_triangle.png"; 
				myIcon.shadowSize = new GSize(22, 23);
				myIcon.infoWindowAnchor = new GPoint(1, 1);

			if (type == "Parking" ) {
				myIcon.iconSize = new GSize(18, 16);
				myIcon.shadow = base_url+"src/icons/shadow_circle.png"; 
				labelText = "x";
				labelOffset = "-0, -0";
			} else {
				labelText = "x";
				myIcon.iconSize = new GSize(18, 16);
				labelOffset = "-0, -0";
			}

			// opts for the marker object below
	        opts = {  "icon": myIcon, "clickable": true, "title": type, "labelText": labelText, "labelOffset": new GSize(-0, -0) };

			var marker = new GMarker(point, opts);
			
			markerGroups[type].push(marker);

			map.addOverlay(marker);

			markers[i] = marker;

		}

		$(markers).each(function(i, marker){
			var cb_val = $("#cb_"+pin[i]["type"]).attr('checked');
			if (cb_val == false) { 
				display = 'style="display: none;"'; 
				hideGroup(pin[i]["type"]);
			} else {
				display = '';
			}

			// this loop used to set category head in the list
			for (var j = 0; j < categories_list.length; j++) {

				if (pin[i]["type"] == categories_list[j] ) {

					$('#list').append("<div class='"+pin[i]["type"]+" list_head' "+display+">&nbsp;"+pin[i]["type"]+"</div>");
					categories_list[j] = '';

				}

			}

			if (pin[i]["type"] != "Parking") {
				$("<li id="+i+" class="+pin[i]["type"]+" "+display+"/>").html("<b>"+pin[i]["name"]+"</b><br>"+pin[i]["address"]+"<br>"+pin[i]["phone"]).click(function(){ displayPoint(marker, i); }).appendTo("#list");
			}

			GEvent.addListener(marker, "click", function(){
				displayPoint(marker, i);
			});

		});

		function setCheckbox(arg, val) {
			//$('#'+arg+'').attr('checked', val);
		}

//		$("#message").appendTo(map.getPane(G_MAP_FLOAT_SHADOW_PANE));
		$("#message").appendTo( map.getPane(G_MAP_FLOAT_PANE) );


/////////


		function displayPoint(marker, index){

			$("div#mask_map").show();

			var moveEnd = GEvent.addListener(map, "moveend", function(){
			var markerOffset = map.fromLatLngToDivPixel( marker.getLatLng() );

				$("#record_id").html(pin[index]["record_id"]);
				
				// get the pin type from the array set above
				var pin_type = pin[index]["type"];

				//	show the initial overlay
				$("#message").fadeIn().css({ top:(markerOffset.y - $("#message").height() ), left:(markerOffset.x - 30)});

				GEvent.removeListener(moveEnd);

			});

			// move the map to the coords set above
			map.panTo(marker.getLatLng());

			// hide
			$("#message").hide();

			var type = pin[index]["type"];

			if (type == "Parking") {
				
				// build the red box for the parking clicks
				var tmp_av = $('[id="available_'+pin[index]["smartpark_key"]+'"]').html();	
				var parking_tag = "<br>parking spaces available<br>";
				var html = "";
				// on of the 2 that doesn't have realtime feeds

				if (tmp_av == null) {

					tmp_av = "";
					parking_tag = "";


					html = "<span style='color:white'><b>"+pin[index]["address"]+"</b>"
							+parking_tag
							+"<div id='icon_smartPark' style='padding-top:5px;'>"
							+"<img src='"+base_url+"/src/bug_smart_park.png'></div>"
							+"<div id='available_text' style='float:right;border:1px solid transparent; line-height:40px; width:120px;padding-top:22px;'>"
							+"<a href='http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Smart Park "+pin[index]["address"]+"&sll="+pin[index]["lat"]+","+pin[index]["lng"]+"&sspn=5.826657,10.898438&ie=UTF8&hq=Smart Park "+pin[index]["address"]+"&ll="+pin[index]["lat"]+","+pin[index]["lng"]+"&spn=0.01138,0.021286&z=16&iwloc=A' target='_blank'>"
							+"<img src='"+base_url+"/src/butt_get_directions_smartpark.png'>"
							+"</a>"
							+"</div>"
							+"<div id='butt_getDirections'><br><br><br>&nbsp;<br>"
							+"</div></span>";

				} else {

					html = "<span style='color:white'><b>"+pin[index]["address"]+"</b>"
							+parking_tag
							+"<div id='icon_smartPark' style='padding-top:5px;'>"
							+"<img src='"+base_url+"/src/bug_smart_park.png'></div>"
							+"<div id='available_text' style='float:right;border:1px solid transparent; line-height:30px; width:120px;'>"+tmp_av+"</div>"
							+"<div id='butt_getDirections'>"
							+"<a href='http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Smart Park "+pin[index]["address"]+"&sll="+pin[index]["lat"]+","+pin[index]["lng"]+"&sspn=5.826657,10.898438&ie=UTF8&hq=Smart Park "+pin[index]["address"]+"&ll="+pin[index]["lat"]+","+pin[index]["lng"]+"&spn=0.01138,0.021286&z=16&iwloc=A' target='_blank'>"
							+"<img src='"+base_url+"/src/butt_get_directions_smartpark.png'>"
							+"</a>"
							+"</div></span>";
				
				}

				$("#message").css({ backgroundImage : "url("+base_url+"src/bubble_footer_smartpark.png)" });
/*
				var html = "<span style='color:white'><b>"+pin[index]["address"]+"</b>"
							+"<br>parking spaces available<br>"
							+"<div id='icon_smartPark'>"
							+"<img src='"+base_url+"/src/bug_smart_park.png'></div><div id='available_text'>"+tmp_av+"</div>"
							+"<div id='butt_getDirections'>"
							+"<a href='http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Smart Park "+pin[index]["address"]+"&sll="+pin[index]["lat"]+","+pin[index]["lng"]+"&sspn=5.826657,10.898438&ie=UTF8&hq=Smart Park "+pin[index]["address"]+"&ll="+pin[index]["lat"]+","+pin[index]["lng"]+"&spn=0.01138,0.021286&z=16&iwloc=A' target='_blank'>"
							+"<img src='"+base_url+"/src/butt_get_directions_smartpark.png'>"
							+"</a>"
							+"</div></span>";
*/
				$("#message_content").html(html);
				$("#butt_close").html("<img src='"+base_url+"src/butt_close_smartpark.png'>");
				$("#butt_showDetail").css({display : "none"});
				$("#butt_getDirections").css({display : "inline"});

			} else {

				// build content for the red box for the other clicks
				$("#message").css({ backgroundImage : "url("+base_url+"src/bubble_footer.png)" });
				$("#message_content").html("<b>"+pin[index]["name"]+"</b><br>"+pin[index]["address"]+"<br>"+pin[index]["phone"]);
				$("#butt_close").html("<img src='"+base_url+"src/butt_close.png'>");
				$("#butt_showDetail").css({display : "inline"});
				$("#butt_getDirections").css({display : "none"});

			}

			// hide the details overlay if it is vis
			$("#details_wrapper").hide();

		}

		// show the detail box
		$('#butt_showDetail').click(function(e){

			// show and center the detail overlay
			$("div#box").show();
			$("div#box").center();

			// set the record id in a hidden field
			var tmp = $('#record_id').html();

			// go to the php and get the xml for the selected item
			$('#details_content').load(""+base_url+"data/single/"+tmp, function(responseText){

				$("#message").hide();
				$('#details_content').html(responseText);
				$("#details_wrapper").fadeIn();

			});

		});


		$('#butt_close').click(function(e){
			$("#message").hide();
		});


		$('#butt_close_detail').click(function(e){
			$("div#box").hide();
		});

		// This is the function tied to the Park, Shop, Eat, Sleep buttons (skinned checkboxes)
		$('.filters').click(function(e){ 

			var checked_count = $("input:checkbox:checked").length; 
			var cb_value = $("#cb_"+this.id).attr('checked');

			if (cb_value == true) {

				showGroup(this.id);
				$('.'+this.id).show();

				$("#default_message").hide();

				if (checked_count == 1) {

					if ($("#cb_Parking").attr('checked') == true) {
						$("#default_message").show();
					}

				}


			} else {

				if (checked_count == 0) {			

					$("#default_message").show();	

				}

				if (checked_count == 1) {

					if ($("#cb_Parking").attr('checked') == true) {

						$("#default_message").show();

					}

				}

				hideGroup(this.id);	
				$('.'+this.id).hide();

			}

			$("#message").hide();
			$("#details_wrapper").hide();

		});

		// hide groups of markers (Shopping, Dining, etc.)
		function hideGroup(type) {

			for (var i = 0; i < markerGroups[type].length; i++) {
				var marker = markerGroups[type][i];
					marker.hide();
			}

		}


		// show groups of markers (Shopping, Dining, etc.)
		function showGroup(type) {

			for (var i = 0; i < markerGroups[type].length; i++) {
				var marker = markerGroups[type][i];
					marker.show();
			}

		}


		function toggleGroup(type) {

			var cb_val = $("#cb_"+type).attr('checked'); // $("#cb_"+type).val();

			for (var i = 0; i < markerGroups[type].length; i++) {

				var marker = markerGroups[type][i];

				if (marker.isHidden()) {
					marker.show();
				} else {
					marker.hide();
				}

			}
		
		}


	}

//////////////////
// done drawing pins
////////////////

	function logthis(logdat) {
		// console.log( logdat+" >> "+new Date().getTime() )
		// for testing only
	}
	
	function clearApp(){		
		$("#list").html("<br>&nbsp;&nbsp;--");	
	}

	jQuery.fn.center = function () {
	    this.css("position","absolute");
		//	this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
	    this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
	    return this;
	}


	jQuery.fn.center_mask = function () {
	    this.css("position","absolute");
		//	this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
		//	this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
	    this.css("left", ( $(window).width() - this.width() ) / 2+100 + "px");
	    return this;
	}

	$("#TMP_BUTTON").click(function(){

		$('#message_content').html("!!!!!!!!!!!!");

	});

});


/////