/**
 * Timetable Specific JavaScript Interface
 *
 * Uses jquery-ui to power the tabbed interface 
 *
 * @author James <james@silverstripe.com>
 * @author Will <will@silverstripe.com>
 */

(function($) {
	$(document).ready(function() {	
		
		function showDirection(dir) {
			$(".timetable-data-outbound, .timetable-data-inbound").addClass('ui-tabs-hide');

			if(dir == "outbound" && $("a.outbound").length > 0) {
				$(".timetable-data-outbound").removeClass('ui-tabs-hide');
			}
			else if($("a.inbound").length > 0){
				$(".timetable-data-inbound").removeClass('ui-tabs-hide');
			}
			else {
				// either or
				$(".timetable-data-outbound, .timetable-data-inbound").removeClass('ui-tabs-hide');
			}
			
			// rewrite the urls on the tabs 
			$("#WhenWhereTabs .ui-tabs-nav a").each(function(i, n) {
				n.href.replace((dir == "outbound") ? "inbound" : "outbound", dir);
			});
		}
		
		/**
		 * Setup the highlighting of the inbound or outbound panels. If a cookie
		 * has been set use that, otherwise default to the first link
		 *
		 * @todo should we be able to set inbound / outbound via url
		 */
		var direction = false;
		
		if($("#InboundOutboundSelector[title^=preselected]").length > 0) {
			var title = $("#InboundOutboundSelector").attr('title');
			
			direction = title.substr(title.indexOf('-') + 1);

			showDirection(direction);
		}
		else if($.cookie('direction') && $("#InboundOutboundSelector li").length > 1) {
			direction = $.cookie('direction');
			$("#InboundOutboundSelector a."+ direction).addClass('selected');

			showDirection(direction);
		}
		else {
			var first = $("#InboundOutboundSelector a:first").addClass('selected');

			if(first.hasClass('outbound')) {
				showDirection("outbound");
			}
			else {
				showDirection("inbound");
			}
		}

		/**
		 * Clicking a inbound or outbound option should trigger the replacement of the tabs
		 */
		$("#InboundOutboundSelector a").click(function() {
			if($(this).hasClass('selected')) { 
				return false;
			}
			
			$("#InboundOutboundSelector a.selected").removeClass('selected');
			$(this).addClass('selected');
			
			var mode = ($(this).hasClass('inbound')) ? 'inbound' : 'outbound';		
			$.cookie('direction', mode);
			
			showDirection(mode);
			
			return false;
		});
		
		// show the major stops by default (allows styling for switcher)
		$('#TimetablePage').addClass('major');

		// Tabs for timetables/route maps
		$('#WhenWhereTabs').tabs({
			ajaxOptions: { async: true },
			cache: true,
			load: function() {

				$('div.help').hide();

				$('.help').click(function(e) {
					$(e.target).parent().find('div.help').slideToggle("fast");
				});

				// hide minor stops for trains
				if ($('#timetableHeader div.train').length > 0) {
					$("#Timetable span.minortoggle").hide();
				}

				// hide icon for 'other' modes
				if ($('#timetableHeader div.other').length > 0) {
					$("#timetableHeader div.ico48").hide();
				}

				// Highlighting for table - rows 
				// for columns add colClass:'colhover'
				$('#Timetable table').tableHover({hoverClass:'hover'});

				// jump to links - can't use simple anchors as the base url of the ajax request
				// points to the absolute timetable location. The following is a simple workaround
				$(".jumpToCurrentTime").click(function() {
					window.location.hash = $(this).attr('rel');

					return false;
				});
				
				$("a.nb").tooltip({ 
					bodyHandler: function() {
						var tipId = $(this).attr("name");
						var htmlContent = $('#'+tipId,' div.Notes').html();
						
						var returnContent = "<div class='ttcontent'>"+htmlContent+"<img src='themes/gwmetlink/images/container/tttooltip.png' /></div>";
						
				        return returnContent;
				    },
					track: true,
					left: -80,
					top: 20,
				    showURL: false,
					delay: 0,
					extraClass: "tttooltip"
				});
				
				var direction = ($("#InboundOutboundSelector a.selected[href*='outbound']").length > 0) ? 'outbound' : 'inbound';
				
				showDirection(direction);
				
				// hide the loading indicator
				$(this).removeClass('loading');
			}
		});

		// Show major stops
		$('#ShowMajorStops,#ShowAllStops').live('click', function() {
			var timetablePage = $('#TimetablePage');
			var classCheck = 'all';
			
			if($(this).attr('id') == 'ShowMajorStops') {
				classCheck = 'major';
			} 
			
			if(timetablePage.hasClass(classCheck)) {
				return false;
			}
			var code = $('#ServiceCode')[0].value;
			var datestops = $('#DateAndStops')[0].value;
			var whenWhereTabs = $('#WhenWhereTabs');

			whenWhereTabs.tabs('url', 0, $('base').attr('href') + 'timetables/timetable/' + code + datestops);
			whenWhereTabs.tabs('load', 0);
			timetablePage.toggleClass('major').toggleClass('all');
			return false;
		});

		// show/hide full service update text
		$('a.showFullUpdate','div#RouteServiceUpdates div.update').live("click",function() {
			var updateID = $(this).attr('name');
			var pa = $(this).parent();
			if ( $('p.fullContent',pa).length > 0 ) {
				$('p.fullContent',pa).show();
				$('p.briefContent',pa).hide();
			}
			else {
				$('p.briefContent',pa).hide().after("<p class='fullContent'></p>");
				$('p.fullContent',pa).load("Ajax/getFullServiceUpdate?id=" + updateID).show();
			}
			
			$(this).html('Hide full update').removeClass('showFullUpdate').addClass('hideFullUpdate');
			return false;
		});

		$('a.hideFullUpdate','div#RouteServiceUpdates div.update').live("click",function(){
			var pa = $(this).parent();
			$('p.fullContent', pa).hide();
			$('p.briefContent', pa).show();
			$(this).html('Show full update').removeClass('hideFullUpdate').addClass('showFullUpdate');
			
			return false;
		});

		/* Toggle ui-btn for inbound/outbound maps */
		$('#MapTools a',"#TimetableMap").live("click", function(){
			$('#MapTools a').removeClass('active');
			$(this).addClass('active');
		});

		$(".AffectedLines").makeacolumnlists({
			cols: 3,
			colWidth: 300,
			equalHeight: false,
			startN: 1
		});
	});
})(jQuery);