var COLLECTIONS = new Array();
var MARKERS = new Array();
var map = null;

Event.observe(window, 'load', function() {

	// start loading up the region-entries from the dom and throw it into an array
	if ($('region-entries') ) {
		var regionlistitems = $('region-entries').immediateDescendants();
		var itemcnt = 0;
		
		regionlistitems.each (function(n) {
					var entryid, entryname, entrylocation, entrycomment, entryurl, entrylat, entrylong, entrylink, entryicon, entryimage
				
					// collect data
					entryid = n.id;
					entryname = n.down('a') ? n.down('a').innerHTML : '';
					entrylocation = n.down('p.location') ? n.down('p.location').innerHTML : '';
					entrycomment = n.down('p.comments') ? n.down('p.comments').innerHTML : '';
					entryurl = n.down('p.link') ? n.down('p.link').innerHTML : '';
					entrylat = n.down('abbr.latitude') ? n.down('abbr.latitude').innerHTML : '';
					entrylong = n.down('abbr.longitude') ? n.down('abbr.longitude').innerHTML : '';
					entrylink = n.down('a') ? n.down('a').id : '';
					entryicon = n.down('img.mapicon') ? n.down('img.mapicon').id : '';
					entryimage = n.down('img.entry-thumb') ? n.down('img.entry-thumb').src : '';
					entryimagealt = n.down('img.entry-thumb') ? n.down('img.entry-thumb').alt : '';
					
					// push data
					COLLECTIONS.push(new Array(
							entrylat,
							entrylong,
							entryname,
							entrylocation,
							entrycomment,
							entryurl,
							0,
							entrylink,
							entryicon,
							entryid,
							entryimage,
							entryimagealt
					));
			});
	}
	

	if ($('public-craft-map-container')) {
			if(GBrowserIsCompatible() && $('public-craft-map')) {

			map = new GMap2($('public-craft-map'));
			map.addControl(new GLargeMapControl());
			map.addControl(new GMapTypeControl());
			map.addControl(new GScaleControl());
			map.addControl(new GOverviewMapControl());
			
			// CHECK IF AN ITEM WAS PROVIDED AND THEN SET IT AS CENTER
			
			// else use default
			map.setCenter(new GLatLng(0, 0), 0);

			var bounds = new GLatLngBounds();

			var baseIcon = new GIcon();
			baseIcon.iconSize = new GSize(22, 38);
			baseIcon.iconAnchor = new GPoint(11, 37);
			baseIcon.infoWindowAnchor = new GPoint(11, 10);

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

				var iconid = (i+1);
				var collection = COLLECTIONS[i];

				collection[6] = i;

				var point = new GLatLng(collection[0], collection[1]);

				var icon = new GIcon(baseIcon);
				if (i < 20) {
					icon.image = "/_images/collection-and-exhibitions/public-craft/map-pin" + iconid + ".png";
				} else {
					icon.image = "/_images/collection-and-exhibitions/public-craft/map-pin.png";
				}

				
				var marker = new GMarker(point, {icon:icon, title: collection[2]});

				// Bind marker link to show info bubble on map
				GEvent.addListener(marker, 'click', function(event, thecollectionid) {
				
					var itemid = thecollectionid[6]+1;
					var htmlWindowText = '<div class="map-info-window"><h2 class="map-info-title"><img class="map-dot" height="22" width="22" src="/_images/collection-and-exhibitions/public-craft/map-dot' + itemid + '.png" alt="' + itemid + '">' + thecollectionid[2] + '</h2><div class="map-info-body">';
					
					if (thecollectionid[10] != '')
					{
						htmlWindowText += '<img class="map-image" src="' + thecollectionid[10] + '" alt="' + thecollectionid[11] + '">';
					}
					htmlWindowText += '<div class="map-url"><h4>' + thecollectionid[5] + '</h4></div><div class="map-location"><h4>Location:</h4>' + thecollectionid[3] + '</div><div class="map-summary"><h4>Summary:</h4>' + thecollectionid[4] + '</div></div></div>';
					this.openInfoWindowHtml(htmlWindowText);
					
				}.bindAsEventListener(marker, collection));
				
				MARKERS[collection[9]] = marker;
				
				// Bind Listing link to show info bubble on map
				Event.observe($(collection[7]), 'click',  function(event, marker, thecollectionid) {
					var itemid = thecollectionid[6]+1;
					var htmlWindowText = '<div class="map-info-window"><h2 class="map-info-title"><img class="map-dot" height="22" width="22" src="/_images/collection-and-exhibitions/public-craft/map-dot' + itemid + '.png" alt="' + itemid + '">' + thecollectionid[2] + '</h2><div class="map-info-body">';
					
					if (thecollectionid[10] != '')
					{
						htmlWindowText += '<img class="map-image" src="' + thecollectionid[10] + '" alt="' + thecollectionid[11] + '">';
					}
					
					htmlWindowText += '<div class="map-url"><h4>' + thecollectionid[5] + '</h4></div><div class="map-location"><h4>Location:</h4>' + thecollectionid[3] + '</div><div class="map-summary"><h4>Summary:</h4>' + thecollectionid[4] + '</div></div></div>';
					
					marker.openInfoWindowHtml(htmlWindowText);
				}.bindAsEventListener($(collection[7]), marker, collection));
				
				// assign icon image to listing item
				if ($(collection[8])) {
					if (i < 20) {
						$(collection[8]).src = "/_images/collection-and-exhibitions/public-craft/map-dot" + iconid + ".png";
					} else {
						$(collection[8]).src = "/_images/collection-and-exhibitions/public-craft/map-dot.png";
					}				
				}

				map.addOverlay(marker);
				bounds.extend(point);
			}

			
			queryParams = window.location.search.toQueryParams();
			if (queryParams['collection']) 
			{
				var collectionid = queryParams['collection'];
				
				for(var i = 0; i < COLLECTIONS.length; i++)
				{
					if (COLLECTIONS[i][9] == "region-info-" + collectionid)
					{
						var collection = COLLECTIONS[i];
						var htmlWindowText = '<div class="map-info-window"><h2 class="map-info-title"><img class="map-dot" height="22" width="22" src="/_images/collection-and-exhibitions/public-craft/map-dot' + (collection[6]+1) + '.png" alt="' + (collection[6]+1) + '">' + collection[2] + '</h2><div class="map-info-body">';
						
						if (collection[10] != '')
						{
							htmlWindowText += '<img class="map-image" src="' + collection[10] + '" alt="' + collection[11] + '">';
						}
						
						htmlWindowText += '<div class="map-url"><h4>' + collection[5] + '</h4></div><div class="map-location"><h4>Location:</h4>' + collection[3] + '</div><div class="map-summary"><h4>Summary:</h4>' + collection[4] + '</div></div></div>';
						
						MARKERS["region-info-" + collectionid].openInfoWindowHtml(htmlWindowText);
					}
				}				
			}
				
			map.setZoom(map.getBoundsZoomLevel(bounds)-2);
			map.setCenter(bounds.getCenter());
		}
	}

	
	if ($('regionMap')) {
	
		var regionovermapareas = document.getElementsByClassName('maptextimagemaparea');
			regionovermapareas.each(function(regionoverlaymaparea) {
				Event.observe(regionoverlaymaparea, 'mouseover', createTextOverlay.bindAsEventListener(regionoverlaymaparea));
		});
	}
});

function createTextOverlay(event) {

	removeTextOverlay(event);

	if (!$('regionMapTextOverLay')) {
		var textoverlay = "<div id='regionMapTextOverLay' class='regionMapTextOverLay " + this.id + "'>" + this.title + "</div>";
		new Insertion.After('regionImage', textoverlay);

		if ($('regionMapTextOverLay')) {
			Event.observe($('regionMapTextOverLay'), 'mouseout', removeTextOverlay.bindAsEventListener($('regionMapTextOverLay')));
			Event.observe($('regionMapTextOverLay'), 'click', changeLocation.bindAsEventListener($('regionMapTextOverLay'), this.href));
		}
	}
}

function changeLocation(event, newlocation) {
	document.location = newlocation;
}

function removeTextOverlay(event) {
	if ($('regionMapTextOverLay')) {
		$('regionMapTextOverLay').remove();
	}
}