var map;
// var centerLatitude = 40.6897; 
// var centerLongitude = -95.0446;
// var startZoom = 1; 
var deselectCurrent = function() {}; 
var removePolyline = function() {}; 

var markerArray = [];
var markers = [];
var latlngs = []; 

function windowHeight() { 
	// console.log("windowHeight");
	
	// Standard browsers (Mozilla, Safari, etc.) 
	if (self.innerHeight) 
	return self.innerHeight; 
	// IE 6 
	if (document.documentElement && document.documentElement.clientHeight) 
	return y = document.documentElement.clientHeight; 
	// IE 5 
	if (document.body) 
	return document.body.clientHeight; 
	// Just in case. 
	return 0;
} 

function handleResize() { 
	// console.log("handleResize");
	var height = windowHeight(); 
	// height -= document.getElementById('toolbar').offsetHeight - 30; 
	// document.getElementById('map').style.height = height + 'px'; 
	// document.getElementById('sidebar').style.height = height + 'px'; 
} 

function createIcon(id, category_name) {
	// console.log("id, category_name", id, category_name)
	var baseIcon = new GIcon(G_DEFAULT_ICON);

	baseIcon.shadow = "http://business.townoffrisco.com/images/markers/shadow.png";
	baseIcon.iconSize = new GSize(25.0, 33.0);
	baseIcon.shadowSize = new GSize(42.0, 33.0);
	baseIcon.iconAnchor = new GPoint(12.0, 16.0);
	baseIcon.infoWindowAnchor = new GPoint(12.0, 16.0);
	baseIcon.image = "http://business.townoffrisco.com/images/markers/" + category_name + ".png";
	
  // console.log("baseIcon:", baseIcon)
	
	return baseIcon;
}

function initializePoint(id, category_name, label) { 
	// console.log("initializePoint");
	var numberedIcon = createIcon(id, category_name);
	var marker = new GMarker(latlngs[id], {icon:numberedIcon, draggable:true });	
	markers.push(marker);
	
	// create the listItem html
	var listItem = document.createElement('li'); 
	var listItemLink = listItem.appendChild(document.createElement('a')); 
	listItemLink.href = "#"; 
	listItemLink.innerHTML = '<strong>' + latlngs[id].lat() + '<br />' + latlngs[id].lng() + '</strong>'; 
	
	var focusPoint = function() { 
		deselectCurrent(); 
		listItem.className = 'current'; 
		deselectCurrent = function() { listItem.className = ''; } 
		map.panTo(latlngs[id]); 
		return false; 
	}

	GEvent.addListener(marker, 'click', focusPoint); 
	listItemLink.onclick = focusPoint; 
	// $('sidebar-list').appendChild(listItem); 
	// console.log("listItem: ", listItem);
	document.getElementById('sidebar-list').appendChild(listItem);

	map.addOverlay(marker); 
	marker.enableDragging();
	
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(label);
	});
	
	GEvent.addListener(marker, 'dragend', function() { 
		listItemLink.innerHTML = '<strong>' + latlngs[id].lat() +	'<br />' + latlngs[id].lng() + '</strong>'; 
		latlngs[id] = marker.getPoint(); 
		// redrawPolyline(); 
	});
	
	// console.log("latlngs", latlngs);
	serializeMarkers();
}

function initializeReadOnlyPoint(id, category_name, label) {
	var numberedIcon = createIcon(id, category_name);
	var marker = new GMarker(latlngs[id], {icon:numberedIcon, draggable:false });
	markers.push(marker);
	map.addOverlay(marker);
	
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(label);
	});
	
}

function clearSerializedMarkers() {
	document.getElementById('map_markers').innerHTML = '';
}

function serializeMarkers() {
	var markerMarkup = '';

	// console.log("latlngs.length", latlngs.length);
	// console.log("markers.length", markers.length);
	
	if (latlngs.length > 0) {
		for(i = 0; i < markers.length; i++) { 
			// create the markerInput that we're going to use to store the marker points and then save them
			markerMarkup += '<input type="hidden" name="markers[' + i + '][lat]" value="' + latlngs[i].lat() + '"/>';
			markerMarkup += '<input type="hidden" name="markers[' + i + '][lng]" value="' + latlngs[i].lng() + '"/>';
		}
	}

	document.getElementById('map_markers').innerHTML = markerMarkup;
	// console.log("markerMarkup: ", markerMarkup);
}

function redrawMarkers(markerArray) {
	// map = new GMap2(document.getElementById("map"));
	for (i=0; i < markerArray.length; i++) { 
		latlngs.push(new GLatLng(markerArray[i][0], markerArray[i][1])); 
		// initializeReadOnlyPoint(latlngs.length - 1, latlngs.length - 1);
		ll_index = latlngs.length - 1;
		initializeReadOnlyPoint(ll_index, markerArray[i][2], markerArray[i][3]);
	}
	// redrawPolyline();
}


function init() {
	// console.log("init");
	
	// $('button-sidebar-hide').onclick = function() { return changeBodyClass('sidebar-right', 'nosidebar'); }; 
	// $('button-sidebar-show').onclick = function() { return changeBodyClass('nosidebar', 'sidebar-right'); }; 
	// handleResize();
	
	// map = new GMap2($("map"));
	map = new GMap2(document.getElementById("map"));
	map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom); 
	map.addControl(new GSmallMapControl()); 
	GEvent.addListener(map, 'click', handleMapClick); 
}

function initAndRedraw() {
	// console.log("init");
	// $('button-sidebar-hide').onclick = function() { return changeBodyClass('sidebar-right', 'nosidebar'); }; 
	// $('button-sidebar-show').onclick = function() { return changeBodyClass('nosidebar', 'sidebar-right'); }; 
	// handleResize();

	// console.log("initAndRedraw:", centerLatitude, centerLongitude, startZoom);	
	// map = new GMap2($("map"));
	map = new GMap2(document.getElementById("map"));
	map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom); 
	map.addControl(new GSmallMapControl()); 
	redrawMarkers(markerArray);
}

// invoke these in the appropriate pages

window.onload = init; 
window.onunload = GUnload;
window.onresize = handleResize;