/* Sky Ride Led Rides (details) - JS Functionality */
var bounds;
var map;
var postcode;
var numListings=0;

$(document).ready(function(){

	map = new GMap2(document.getElementById("map_canvas"));
	map.setCenter(new GLatLng(51.510746, -0.124841), 14, G_NORMAL_MAP);
	map.addControl(new GMapTypeControl());
	map.addControl(new GSmallMapControl());
  
	bounds = new GLatLngBounds();

	// deal with form submission
	$("form#lrcomp").submit(function(e) {
		e.preventDefault();
		$("img#loading").show();
		$.getJSON(
				"/zuvvi/ext/component/bc/com_bc_skyride_bikeshops/ajax/shops.php",
				{ postcode : $("#postcode").val() },
				populateMap);
	});

	// fetch initial points for map
	$("img#loading").show();
	$.getJSON(
			"/zuvvi/ext/component/bc/com_bc_skyride_bikeshops/ajax/shops.php",
			{ postcode : $("#postcode").val() },
			populateMap);

});

function populateMap(json)
{
	postcode = null;
	map.clearOverlays();

	// reset search results
	$("div#lrsrcontainer").html('');
	numListings = 0;
	
	$.each(json, function(i, shop) {
		var bubbleHtml = null;
		bubbleHtml = '<div class="mapbubble"><h5>'+shop.name+'</h5>';
		bubbleHtml = bubbleHtml + '<p class="type">'+shop.typeDescription+'</p>';
		if (shop.address)
		{
			bubbleHtml = bubbleHtml + '<address>'+shop.address+'</address>';
			bubbleHtml = bubbleHtml + '<p class="phone">'+shop.telephone+'</p>';
		}
		bubbleHtml = bubbleHtml + '</div>';
		addEvent(shop.lat, shop.long, shop.name, bubbleHtml, shop.shop_type);
		addListing(shop);
		// postcode?
		if (shop.shop_type == -1)
			postcode = shop;
	});
	autoZoomMap();
	$("img#loading").hide();
}

function addEvent(latitude, longitude, title, html, type)
{
	if (latitude == 0 && latitude == 0)
		return false;
		
	// add event location marker
	var location = new GLatLng(latitude, longitude);
	var markerIcon = new GIcon(G_DEFAULT_ICON);
	switch (type)
	{
	case 1:
	case "1":
		markerIcon.image = 'http://maps.google.com/mapfiles/ms/micons/green-dot.png';
		break;
	case -1:
		markerIcon.image = 'http://maps.google.com/mapfiles/ms/micons/red-dot.png';
		break;
	case 0:
	case "0":
	default:
		markerIcon.image = 'http://maps.google.com/mapfiles/ms/micons/blue-dot.png';
		break;
	}
	markerIcon.iconSize = new GSize(32, 32);
	markerIcon.iconAnchor = new GPoint(16, 32);
	var marker = new GMarker(location, { icon: markerIcon, title: title } );
	GEvent.addListener(marker, 'click', function() {
		var bubbleHtml = html;
		map.openInfoWindowHtml( location, bubbleHtml );
	});
	bounds.extend(location);
	map.addOverlay(marker);
}

function autoZoomMap()
{
	var zoomLev = map.getBoundsZoomLevel(bounds);
	if (postcode)
	{
		map.setCenter( new GLatLng(postcode.lat, postcode.long) );
		zoomLev += 2;
	}
	else
		map.setCenter(bounds.getCenter());
	map.setZoom( zoomLev );
	map.checkResize();
}

function addListing(shop)
{
	if (shop.shop_type == -1 || numListings > 6)
		return true;
	var entryHtml = '';
	entryHtml += '<h5>'+shop.name+'</h5>';
	if (shop.distance)
		entryHtml += '<p class="distance">'+shop.distance+'km</span>'; 
	entryHtml += '<address>'+shop.address+'</address>';
	entryHtml += '<p class="phone">'+shop.telephone+'</p>';
	$("div#lrsrcontainer").append('<div class="shop">'+entryHtml+'</div>');
	numListings++;
} // end add_srlisting