var map = null;
var xml;
var markers = [];
var mapicons = [];

// *************************************************

// **
// Map-related functions
// **

function onPageLoad() {
	var mapDiv;

	if (GBrowserIsCompatible()) {
		// Center the map on Tokyo.
    getNewMap(35.651508, 139.730837, 14);
	}
}

function onPageUnload() {
	GUnload();
}

function getNewMap(lat, lng, zoom) {
	var mapDiv;

	mapDiv = $("myMap");

	map = new GMap2(mapDiv);
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.setCenter(new GLatLng(lat, lng), zoom);
	map.enableScrollWheelZoom();

	createMapIcons();

	GDownloadUrl("susan2.xml", function(data, responseCode) { parseXmlFile(data, responseCode); } );
}

function getNewBaseIcon() {
	var baseIcon;

	// Create a base icon for all of our markers that specifies the
	// shadow, icon dimensions, etc.
	baseIcon = new GIcon();
	baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
	baseIcon.iconSize = new GSize(32, 32);
	baseIcon.shadowSize = new GSize(37, 34);
	baseIcon.iconAnchor = new GPoint(9, 34);
	baseIcon.infoWindowAnchor = new GPoint(9, 2);
	baseIcon.infoShadowAnchor = new GPoint(18, 25);

	return baseIcon;
}

function createMapIcons() {
	var thisIcon;

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/red-pushpin.png";

	mapicons[mapicons.length] = {
		"name": "business1",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/pink-pushpin.png";

	mapicons[mapicons.length] = {
		"name": "business2",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/ltblu-pushpin.png";

	mapicons[mapicons.length] = {
		"name": "business3",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/ylw-pushpin.png";

	mapicons[mapicons.length] = {
		"name": "business4",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/blue-dot.png";

	mapicons[mapicons.length] = {
		"name": "1-school1",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/pink-dot.png";

	mapicons[mapicons.length] = {
		"name": "school2",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/rail.png";
	thisIcon.shadow = "";

	mapicons[mapicons.length] = {
		"name": "rail",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/tree.png";
	thisIcon.shadow = "";

	mapicons[mapicons.length] = {
		"name": "park",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_ALL/mapfiles/ms/icons/homegardenbusiness.png";
	thisIcon.shadow = "";

	mapicons[mapicons.length] = {
		"name": "homegarden",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/arts.png";
	thisIcon.shadow = "";

	mapicons[mapicons.length] = {
		"name": "arts",
		"icon": thisIcon
	};

	thisIcon = getNewBaseIcon();
	thisIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/icons/rail.png";
	thisIcon.shadow = "";

	mapicons[mapicons.length] = {
		"name": "polyline",
		"icon": thisIcon
	};
}

function findIcon(iconName) {
	var i;

	for (i=0; i<mapicons.length; i++) {
		if (iconName == mapicons[i].name) {
			return mapicons[i].icon;
		}
	}

	return mapicons[0].icon;
}

function getLayout(parentNode) {
	var layout = "";
	var text;

	if (null == parentNode) {
		return "";
	}

	text = getSafeStringNode(parentNode, "name", "");

	if ("" != text) {
		layout += "<b>" + text + "</b><br />";
	}

	text = getSafeStringNode(parentNode, "description", "");

	if ("" != text) {
		layout += text + "<br />";
	}

	text = getSafeStringNode(parentNode, "url", "");

	if ("" != text) {
		layout += "<a href='" + text + "' target='_blank'>" + text + " </a>";
	}

	return layout;
}

function parseXmlFile(data, responseCode) {
	var point, marker;
	var items, poly, polyroute;
	var arrPoints;
	var i, j;

  xml = GXml.parse(data);
  items = xml.documentElement.getElementsByTagName("item");

  for (i = 0; i < items.length; i++) {
  	if ("location" == getSafeAttribute(items[i], "type", "location")) {
			point = new GLatLng(parseFloat(getSafeStringNode(items[i], "latitude", "0.0")),
				parseFloat(getSafeStringNode(items[i], "longitude", "0.0")));
			marker = new GMarker(point, findIcon(getSafeAttribute(items[i], "category", "business1")));
			layout = getLayout(items[i]);
			createMarker(marker, layout);
			createListing(items[i], marker, layout);

			map.addOverlay(marker);
		} else if ("polyline" == getSafeAttribute(items[i], "type", "location")) {
			point = new GLatLng(parseFloat(getSafeStringNode(items[i], "latitude", "0.0")),
				parseFloat(getSafeStringNode(items[i], "longitude", "0.0")));
			marker = new GMarker(point, findIcon("polyline"));
			polyroute = getNode(items[i], "route");
			arrPoints = [];

			for (j=0; j<polyroute.childNodes.length; j++) {
				if (polyroute.childNodes[j].tagName) {
					if ("waypoint" == polyroute.childNodes[j].tagName) {
						point = new GLatLng(parseFloat(getSafeStringNode(polyroute.childNodes[j],
							"latitude", "0.0")), parseFloat(getSafeStringNode(polyroute.childNodes[j],
							"longitude", "0.0")));
						arrPoints[arrPoints.length] = point;				
					}
				}
			}

			poly = new GPolyline(arrPoints, getSafeAttribute(items[i], "color", "#9B9B9B"), 2, 0.95);
			layout = getLayout(items[i]);
			createMarker(marker, layout);
			createListing(items[i], marker, layout);

			map.addOverlay(poly);
			map.addOverlay(marker);
		}
	}

	sortListings();
	displayListings();
}

function createMarker(marker, layout) {
	GEvent.addListener(marker, "click", function() {
		this.openInfoWindowHtml(layout);
	});
}

function createListing(parentNode, marker, layout) {
	var index = markers.length;
	var t = getSafeAttribute(parentNode, "type", "location");

	markers[index] = {
		"type": t,
		"category": ("location" == t) ? getSafeAttribute(parentNode, "category", "business1") : "",
		"title": getSafeStringNode(parentNode, "name", "(blank)"),
		"marker": marker,
		"layout": layout
	};
}

function sortListings() {
	var i, j;
	var tmp;

	if (markers.length > 1) {
		for (i=0; i<markers.length - 1; i++) {
			for( j=i+1; j<markers.length; j++) {
				if (compare(markers[i].type, markers[j].type) > 0) {
					tmp = markers[i];
					markers[i] = markers[j];
					markers[j] = tmp;

					continue;
				}
			}
		}

		for (i=0; i<markers.length - 1; i++) {
			for( j=i+1; j<markers.length; j++) {
				if (0 == compare(markers[i].type, markers[j].type)) {
					if (compare(markers[i].category, markers[j].category) > 0) {
						tmp = markers[i];
						markers[i] = markers[j];
						markers[j] = tmp;

						continue;
					}
				}
			}
		}

		for (i=0; i<markers.length - 1; i++) {
			for( j=i+1; j<markers.length; j++) {
				if (0 == compare(markers[i].type, markers[j].type)) {
					if (0 == compare(markers[i].category, markers[j].category)) {
						if (compare(markers[i].title, markers[j].title) > 0) {
							tmp = markers[i];
							markers[i] = markers[j];
							markers[j] = tmp;

							continue;
						}
					}
				}
			}
		}
	}
}

function compare(str1, str2) {
	str1 = str1.toLowerCase();
	str2 = str2.toLowerCase();
	var cmp;
	var i;

	for (i=0; i<str1.length; i++) {
		if (str2.length < i) {
			return -1;
		}

		cmp = str1.charCodeAt(i) - str2.charCodeAt(i);

		if (0 != cmp) {
			return cmp;
		}
	}

	return 0;
}

function displayListings() {
	var ctr;
	var elm;

	ctr = $("myListings");

	for (i=0; i<markers.length; i++) {
		elm = Builder.node("div", [
			Builder.node("img", {"src": findIcon(markers[i].category).image}),
			Builder.node("a", {"href": "#", "onclick": "openMarker(" + String(i) + "); return false;"},
				markers[i].title)
		]);

		ctr.appendChild(elm);
	}
}

function openMarker(index) {
	markers[index].marker.openInfoWindowHtml(markers[index].layout);
}

function getNode(parentNode, nodeName) {
	var i;

	for (i=0; i<parentNode.childNodes.length; i++) {
		if (parentNode.childNodes[i].tagName == nodeName) {
			return parentNode.childNodes[i];
		}
	}

	return null;
}

function getSafeStringNode(parentNode, nodeName, def) {
	var res = getNode(parentNode, nodeName);

	if (null === res) {
		return def;
	}

	if (res.childNodes.length > 0) {
		return res.childNodes[0].nodeValue;
	} else {
		return "";
	}
}

function getSafeAttribute(parentNode, nodeAttr, def) {
	var res = parentNode.getAttribute(nodeAttr);

	if (!res) {
		return def;
	}

	return res;
}

// **
// Miscellaneous helper functions
// **

function isSafari() {
    if (navigator) {
    	if (navigator.vendor) {
	        if (-1 != navigator.vendor.indexOf("Apple")) {
    	        return true;
        	}
        }
    }

    return false;
}

function isGecko() {
    if (navigator) {
        if (navigator.product == "Gecko") {
            return true;
        }
    }

    return false;
}

function deleteChildren(element) {
    var i;

    if (element) {
        if (element.childNodes) {
            for (i=element.childNodes.length - 1; i>=0; i--) {
                element.removeChild(element.childNodes[i]);
            }
        }
    }
}

// **
// Debug functions
// **

// Inspect a DOM element - list all attributes/values
// beginning with the specified index.
function inspect(elm, index) {
  var str = "";
  var x = 0;
  for (var i in elm) {
    x++;
    if (x >= index)
      str += i + ": " + elm.getAttribute(i) + "\n";
  }
  alert(str);
}