var icn = new GIcon();
//icn.image = "icons/icnAxis.png";
//icn.iconSize = new GSize(17, 17);
//icn.iconAnchor = new GPoint(8, 4);
//icn.infoWindowAnchor = new GPoint(5, 14);

var retailersXml = "retailers.xml";
var retailers = [];
var gMapEnabled;
var axisMap, mapBox, axisMarkers;

function el(ID) {
	return document.getElementById(ID);
}

function getBoundboxCenter(box) {
	var sw = box.getSouthWest();
	var ne = box.getNorthEast();
	var lat1 = sw.lat();
	var lat2 = ne.lat();
	var lng1 = sw.lng();
	var lng2 = ne.lng();
	var lat = lat2 - ((lat2-lat1)/2);
	var lng = lng2 - ((lng2-lng1)/2);
	return new GLatLng(lat, lng);
}

function resetMap() {
	axisMap.setCenter(getBoundboxCenter(mapBox), axisMap.getBoundsZoomLevel(mapBox));
	axisMap.closeInfoWindow();
}

function getHtml(marker) {
	var d = marker.axisData;

	var ht = "<div id='infoName'>" + d.name + "</div>";
	if(d.branch)
		ht += "<div id='infoBranch'>" + d.branch + "</div>";
	if(d.address)
		ht += "<div id='infoAddress'>" + d.address + "</div>";
	if(d.email)
		ht += "<div id='infoEmail'>" + d.email + "</div>";
	if(d.tel)
		ht += "<div id='infoTel'>" + d.tel + "</div>";
	if(d.url)
		ht += "<div id='infoUrl'><a href='" + d.url + "'>" + d.url + "</a></div>";

	return ht;
}

function icnClicked(marker) {
	var ht = getHtml(marker);
	marker.openInfoWindowHtml(ht, {maxWidth:250});
}

function showRetailers() {
	var i, l;
	var cur, marker, title;

	mapBox = new GLatLngBounds();
	axisMarkers = [];

	l = retailers.length;

	for(i=0;i<l;i++) {
		cur = retailers[i];

		title = cur.name;
		if(cur.branch)
			title += " - " + cur.branch;

		marker = new GMarker(new GLatLng(cur.lat, cur.lng), {title:title});
		marker.ID = cur.id;
		marker.axisData = cur;
		marker.clickable = true;

		var lis = GEvent.callbackArgs(this, icnClicked, marker);
		GEvent.addListener(marker, "click", lis);

		axisMap.addOverlay(marker);
		mapBox.extend(marker.getPoint());
		axisMarkers.push(marker);
	}

	resetMap();
}

function onRetailersData(txt) {
	var i, nd;
	var ret = {};
	var rets = [];
	var x = GXml.parse(txt);
	var xrets = x.firstChild.childNodes;
	var l = xrets.length;

	for(i=0;i<l;i++) {
		nd = xrets[i];

		if(nd.nodeType == 1) {
			ret = {};
			ret.id = nd.getAttribute("id");
			ret.lat = nd.getAttribute("lat");
			ret.lng = nd.getAttribute("lng");
			ret.branch = nd.getAttribute("branch");
			ret.name = nd.getAttribute("name");
			ret.tel = nd.getAttribute("tel");
			ret.url = nd.getAttribute("url");
			ret.email = nd.getAttribute("email");
			ret.address = GXml.value(nd.childNodes[1]);

			rets.push(ret);
		}
	}

	retailers = rets;
	showRetailers();
}

function getData(filename) {
	GDownloadUrl(filename, onRetailersData);
}

function initAxisMap() {
	if(GBrowserIsCompatible()) {
		gMapEnabled = true;

		axisMap = new GMap2(el("mapdiv"));
		axisMap.addControl(new GSmallMapControl());
		axisMap.setCenter(new GLatLng(39.36827914916013, -103.7109375), 4);

		getData(retailersXml);
	}
}

function getMarkerById(ID) {
	var i, mk, foundMarker;
	var l = axisMarkers.length;

	for(i=0;i<l;i++) {
		mk = axisMarkers[i];
		if(mk.ID == ID) {
			foundMarker = mk;
			break;
		}
	}

	return foundMarker;
}

//function to be called from the list. The "ID" argument is the id attribute defined on the xml file
function highlightIcon(ID) {
	var icn = getMarkerById(ID);
	var pt = icn.getPoint();
	axisMap.setCenter(pt, 15);
	icnClicked(icn);
}