$(function()
{
	// Google Map/Shadowbox stuff.
	$('#gm-link').click(distributorMap);
	
	// Build lookup arrays.
	var distributorBoxes = $('#contacts li');
	var distributorMarkers = $('#map > li:not(#gm-link)');
	var distributorLookup = new Array();
	var reverseDistributorLookup = new Array();
	distributorBoxes.each(function(index)
	{
		var item = $(this);
		var heading = item.find('h4');
		if (heading.length > 0)
		{
			distributorLookup[heading.text()] = item;
		}
	});
	distributorMarkers.each(function(index)
	{
		var marker = $(this);
		var title = marker.attr('title');
		reverseDistributorLookup[title] = marker;
	});
	
	var persistedDistributor;
	
	// Marker handlers.
	distributorMarkers.css('cursor', 'pointer');
	var mouseover;
	distributorMarkers.mouseover(mouseover = function()
	{
		var marker = $(this);
		if (persistedDistributor && persistedDistributor.attr('title') == marker.attr('title'))
		{
			return;
		}
		
		marker.addClass('active');
		var distributorName = marker.attr('title');
		var box = distributorLookup[distributorName];
		if (typeof box != 'undefined' && $.isFunction(box.addClass))
		{
			box.addClass('active');
			
			$('#info').append('<div id="temp-box"></div>');
			box.children().clone().appendTo('#temp-box');
		}
	}).mouseout(function()
	{
		var marker = $(this);
		if (persistedDistributor && persistedDistributor.attr('title') == marker.attr('title'))
		{
			return;
		}
			
		marker.removeClass('active');
		var distributorName = marker.attr('title');
		var box = distributorLookup[distributorName];
		if (typeof box != 'undefined' && $.isFunction(box.addClass))
		{
			box.removeClass('active');
		}
		
		$('#temp-box').remove();
	}).click(function()
	{
		var marker = $(this);
		if (persistedDistributor && persistedDistributor.attr('title') == marker.attr('title'))
		{
			return;
		}
		
		persistedDistributor = marker;	
		var otherDistributors = distributorMarkers.not(this);
		otherDistributors.unbind('mouseover', mouseover);
		var callback = function()
		{
			otherDistributors.unbind('mouseover', arguments.callee);
			otherDistributors.bind('mouseover', mouseover);
			var temp = persistedDistributor;
			persistedDistributor = null;
			temp.mouseout(); 
			$(this).mouseover();
		};
		
		otherDistributors.bind('mouseover', callback);
	});
	
	// Box handlers.
	distributorBoxes.mouseover(function()
	{
		var box = $(this);
		box.addClass('active');
		var distributorName = box.find('h4').text();
		var marker = reverseDistributorLookup[distributorName]; 
		if (typeof marker != 'undefined' && $.isFunction(marker.addClass))
		{
			marker.addClass('active');
		}
	}).mouseout(function()
	{
		var box = $(this);
		var distributorName = box.find('h4').text();
		var marker = reverseDistributorLookup[distributorName];
		if (persistedDistributor && persistedDistributor.attr('title') == marker.attr('title'))
		{
			return;
		} 
		
		box.removeClass('active');
		if (typeof marker != 'undefined' && $.isFunction(marker.addClass))
		{
			marker.removeClass('active');
		}
	});
	
});

Shadowbox.loadSkin('classic', '/includes/shadowbox-skin/');
$(Shadowbox.init);

function distributorMap()
{
	Shadowbox.open(
	{
	        player: 'html',
		title: 'Interactive 3S Lighting Distributor Map', 
	        content: '',
	        height: 560,
	        width: 820,
	        options:
		{
			onFinish: function(item)
			{
	                	function formatWindow(input)
				{
					var html = '<div class="bubble">';
					html += '<h1>' + input.company + '</h1>';
					html += '<p>' + input.address + '</p>';
					html += '<p>' + 'Tel: ' + input.telephone + '<br />';
					html += 'Fax: ' + input.fax + '</p>';
					html += '<p>' + 'Contact: ' + input.contact + '</p>';
					html += '<p>' + 'Email: <a href="mailto:' + input.email + '">' + input.email + '</a></p>';
					html += '</div>';
					return html;
				}
				
				function makeIcon(image)
				{
					var icon = new GIcon();
					icon.image = image;
					//icon.shadow = '/resources/images/dot-google-shadow.png';
					icon.iconSize = new GSize(12, 12);
					//icon.shadowSize = new GSize(16, 22);
					icon.iconAnchor = new GPoint(6, 6);
					//icon.infoShadowAnchor = new GPoint(0, 0);
					icon.infoWindowAnchor = new GPoint(6, 6);
					return icon;
				}
				
				function createMarker(input)
				{
					var marker = new GMarker(input.point, makeIcon(input.markerImage));
					GEvent.addListener(marker, 'click', function()
					{
						marker.openInfoWindowHtml(formatWindow(input));
					});
					return marker;
				}
				
				function parseJson(doc)
				{
					var jsonData = eval('(' + doc + ')');
					for (var i = 0; i < jsonData.markers.length; i++)
					{
						var marker = createMarker(jsonData.markers[i]);
						gmap.addOverlay(marker);
					}
				}
				
				GDownloadUrl('/resources/points.json', function(data, responseCode)
				{
					parseJson(data);
				});
				
				var gmap = new GMap2(document.getElementById('shadowbox_content'));
				gmap.addControl(new GSmallMapControl());
				gmap.addControl(new GMapTypeControl());
				//gmap.addControl(new GOverviewMapControl(new GSize(100, 100)));
				gmap.enableScrollWheelZoom();
				gmap.setCenter(new GLatLng(-29.45873, 146.68945), 4);
			}
		}
	});
}