$(document).ready(function() {
	if ($('body').is('.where_we_go')) {
		wwg.initPage();
	}
});

var wwg = {
	sPHPScriptName: '/where_we_go.php',
	sGMapsKey: '',
	sGAjaxLoaderJsURL: 'http://www.google.com/jsapi?key=',
	oData: '',
	bPaneOpen: false,

    initPage: function() {
	    wwg.getGmapKey();
		wwg.displayOpeningPara();
	    wwg.displayLocationsList();
	    
    },
    getGmapKey: function(id) {
    	var url= '/ticket_booking.php?action=get_gmap_key_json';
    	
    	$.ajax({
    	    url: url,
    	    cache: false,
    	    dataType: "json",
    	    async: false,
    	    success: function(data){
	    		wwg.sGMapsKey = data.key;
    	    },
    	    error: function(XMLHttpRequest, textStatus, errorThrown) {
    	    	alert('ERROR. textStatus: ' + textStatus + ' errorThrown: ' + errorThrown);
    	    }
    	});
    	
    },
    displayOpeningPara: function() {
    	var html = '<ul class="timetable"><li><a onclick="return !window.open(this.href,\'window_name\');" title="Download timetable (PDF, 866k)" href="/assets/pdf/greyhounduk_timetable.pdf">Download timetable (PDF, 866k)</a></li></ul><p class="opening_para">Most of our services have a number of pick-up and drop-off points.';
    	html += '<br/>Check below for those most convenient for your journey.</p>';
    	html += '<ul class="where_we_go_list"></ul>';
    	$('#main_content').append(html);
    },
    displayLocationsList: function() {
    	var url= wwg.sPHPScriptName + '?action=get_locations_json';
    	var html = '';
    	$.ajax({
    	    url: url,
    	    cache: false,
    	    dataType: "json",
    	    async: false,
    	    success: function(data){
	    		$.each(data.items, function(i,item){
	    			html += '<li class="short" id="locationShort'+item.id+'">';
	    			html += '<a href="javascript: wwg.displayExpandedDetails('+item.id+');">';
	    			html += '<span class="left">'+item.title+'</span>';
	    			html += '<span class="right">View map, pick-up and drop-off points for '+item.title+'</span>';
	    			html += '</a></li>';
		        });
	    		html += '</ul>';
		        $('.where_we_go_list').html(html);
    	    },
    	    complete: function() {
    	    	// nothing just now
    	    }
    	});
    },
    displayExpandedDetails: function(id) {
    	var url= wwg.sPHPScriptName + '?action=get_location_full_details_json&id='+id;
    	
    	$.ajax({
    	    url: url,
    	    cache: false,
    	    dataType: "json",
    	    async: false,
    	    success: function(data){
	    		wwg.displayExpandedDetailsPane(id, data);
	    		wwg.oData = data;
    	    },
    	    complete: function() {
    	    	// nothing just now
    	    },
    	    error: function(XMLHttpRequest, textStatus, errorThrown) {
    	    	alert('ERROR. textStatus: ' + textStatus + ' errorThrown: ' + errorThrown);
    	    }
    	});
    	
    },
    displayExpandedDetailsPane: function(id, data) {
    	if (wwg.bPaneOpen) {
    		wwg.closeDetailsPane();
    	}
    	var html = '<li class="expanded"><h2>' + data.items[0].main_title + '</h2>';
    	html += '<p class="close"><a href="javascript: wwg.closeDetailsPane();">Close</a></p>';
    	html += '<div class="where_we_go_info">';
    	html += '<script type="text/javascript">$(function(){$(\'.address\').jScrollPane({showArrows:true, scrollbarWidth: 16});});	</script>';
    	html += '<div class="map" id="where_we_go_map_canvas">Google Map</div>';
    	html += '<div class="address scroll-pane">';
    	
    	$.each(data.items, function(i, item) {
    	    html += '<div class="location';
    	    if (i==0) {
    	    	html += ' first';
    	    }
    	    html += '">';
    	    html += '<h3>' + item.title + ', <br/>' + item.street + '</h3>';
    	    html += '<h4> '+ item.town + ', <br/>' + item.postcode + '</h4>';
    	    html += '<p>' + item.description + '</p>'
    	    html += '</div>';
    	});
    	html += '</div></div></li>';
    	$('#locationShort' + id).replaceWith(html);

    	wwg.bPaneOpen = true;
    	wwg.initLoader();
    },
    initLoader: function() {
    	  var script = document.createElement("script");
    	  script.src = "http://www.google.com/jsapi?key="+wwg.sGMapsKey+"&callback=wwg.loadMaps";
    	  script.type = "text/javascript";
    	  document.getElementsByTagName("head")[0].appendChild(script);
    },
    loadMaps: function() {
    	  google.load("maps", "2", {"callback" : wwg.populateMap});
    },

    populateMap: function() {
    	var data = wwg.oData;
    	if (GBrowserIsCompatible()) {
    		var map = new GMap2(document.getElementById("where_we_go_map_canvas"));
    		$.each(data.items, function(i, item) {
    			if (item.parent_id == 0) { // This is the master point
    				map.setCenter(new GLatLng(item.lat, item.long), 13);
    			}
        	});
    		//map.setCenter(new GLatLng(55.86528818789959416335, -4.25099015235900878906), 13);
    		map.setUIToDefault();
    		map.addControl(new GSmallMapControl());
            map.addControl(new GMapTypeControl());
            map.enableContinuousZoom();
            
            $.each(data.items, function(i, item) {
        		wwg.addMapPoint(map, item);
        	});
    	}
    	
    },
    addMapPoint: function (map, item) {
        var point = new GLatLng(item.lat, item.long);
        var objMarker = new GMarker(point);
        var sHTML = '<div class="bubble">'+item.title+'<br>' + item.street + '<br>' + item.town + '<br>' + item.postcode + '</div>';
        GEvent.addListener(objMarker, "click", function() {
            objMarker.openInfoWindowHtml(sHTML);
        });
        map.addOverlay(objMarker);
    },
    closeDetailsPane: function() {
        GUnload();
		//if($.browser.msie){
		    $('.expanded').remove();
			wwg.bPaneOpen = false;
			$('.where_we_go_list').html('');
		    wwg.displayLocationsList();
		//}
		//else{
	     //   $('.expanded').slideUp('fast', function(){
			$('.expanded').remove();
			//wwg.bPaneOpen = false;
		    //$('.where_we_go_list').html('');
		    //wwg.displayLocationsList();
		    
		  //  });
		//}
    }
};