// load event function by Simon Willison
function addLoadEvent(func) {
	var oldonload = window.onload;
	if (typeof window.onload != 'function') window.onload = func;
	else {
		window.onload = function () {
			if (oldonload) oldonload();
			func();
		}
	}
}

// create elements function to circumvent XHTML/DOM compliance
function createElement(element) {
	element = element.toLowerCase();
	if (typeof document.createElementNS != 'undefined')
		return document.createElementNS('http://www.w3.org/1999/xhtml', element);
	if (typeof document.createElement != 'undefined')
		return document.createElement(element);
	return false;
}

function insertAfter(newElement,targetElement) {
	var parent = targetElement.parentNode;
	if (parent.lastChild == targetElement) parent.appendChild(newElement);
	else parent.insertBefore(newElement,targetElement.nextSibling);
}



/* --- Google Maps functions ---
*/

var baseIcon, map;

function initMap() {
	setTimeout("if (typeof GMap2 != 'undefined') loadMap();", 10);
}

function loadMap() {
	if (!GBrowserIsCompatible() || !(document.createElementNS || document.createElement) || !document.createTextNode) return false;
	if (!(typeof city == 'object')) return false

	// try to get map element
	var map_element = document.getElementById("map");
	if (!map_element) return false;

	// create map
	map = new GMap2(map_element);
	if (!map) return false;

	// try zoom of 6 to 9
	map.setCenter(new GLatLng(city["latitude"], city["longitude"]), 6, G_HYBRID_MAP);

	// add controls
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());

	return initOverlay();
}

function createMarker(longitude, latitude, icon, display_element) {
	var point = new GPoint(parseFloat(longitude),parseFloat(latitude));

	var marker = new GMarker(point, icon);

	if (display_element != '') {
		GEvent.addListener(marker, 'click', function() {
			map.savePosition();
			marker.openInfoWindow(display_element);
		});
	}

	GEvent.addListener(marker, 'infowindowclose', function() {
		map.returnToSavedPosition();
	});

	return marker;
}

function createWeatherIcon(icon_file) {
	var icon = new GIcon();

	icon.image = "http://www.searchandgo.com/images/icons/large/" + icon_file + ".png";
	icon.iconSize = new GSize(30, 30);
	icon.iconAnchor = new GPoint(15, 15);
	icon.infoWindowAnchor = new GPoint(30, 15);

	return icon;
}

function initOverlay() {
	// make main city (zeroth index at the moment)
	var icon;

	// weather conditions icon
	icon = createWeatherIcon(city["icon"]);

	var data = new Array()
	data['Summary'] = city["summary"];
	data['Temperature'] = city["temperatureF"] + ' / ' + city["temperatureC"];

	// create list of weather data
	var data_list = createElement("ul");
	data_list.setAttribute("style","white-space:nowrap;");
	for (key in data) {
		var listItem = createElement("li");

		// create and add label
		var listItemLabel = createElement("strong");
		listItemLabel.appendChild(document.createTextNode(key + ': '));
		listItem.appendChild(listItemLabel);

		// add data
		var span = document.createElement("span");
		span.innerHTML = data[key];	// easiest way to do this considering the markup given
		insertAfter(span,listItemLabel);
		data_list.appendChild(listItem);
	}

	var display_element = data_list;

	map.addOverlay(createMarker(city["longitude"],city["latitude"],icon,display_element));

	return true;
}

// add load event functions
addLoadEvent(initMap);

// add unload event functions
window.onunload = function () {
	if (typeof GUnload != 'undefined') GUnload();
}