$(document).ready(
	function(){

		if( $('#instructions ol li').length > 0 ) {
			$.getJSON('/as/', { 'r':rindices[0] }, function(data){
				if( data != null && data != undefined ) {
					var ca = 0, ta = 0, ba = 0;
					for( i in data ) {
						if( ca > 2 ) break;
						
						if($("*[id*="+i+"]").length > 0) {
							$("*[id*="+i+"]").before(data[i]);
							$("#"+i).animate({opacity: 'toggle', height: 'toggle'}, 500, function() {});
							ca++;
						} else if( ca < 3 & ta == 0 ) {
							$('#instructions ol li').first().before(data[i]);
							$("#"+i).animate({opacity: 'toggle', height: 'toggle'}, 500, function() {});
							ta = 1;
							ca++;
						} else if( ca < 3 & ba == 0 ) {
							$('#instructions ol li').last().after(data[i]);
							$("#"+i).animate({opacity: 'toggle', height: 'toggle'}, 500, function() {});
							ba = 1;
							ca++;
						}
					}
				}
			});
		}
	
		$('a.lp').live('mousedown', function(e) {$(this).attr("href", "/rd?a="+encodeURIComponent($(this).attr("href")));});

		if( $('#map_alt img').length > 0 )
			window.crm = $('#map_alt img')[0].src;

		/* Set default styles on input fields to distinguish the default text from user input */

		// 'From' field
		if( $("#from").val()== $("#from").attr('title') ) {
			$("#from").css({"color" : "#999"});
		} else {
			$("#from").css({"color" : "#222"});
		}

		// 'Postcode' field
		if( $("#postcode").val()== $("#postcode").attr('title') ) {
			$("#postcode").css({"color" : "#999"});
		} else {
			$("#postcode").css({"color" : "#222"});
		}

		// Enable low pollution option if available.
		// Disable it if it is not.
		enableDisableLowPollutionOption();

		// Hide or show the route-type options ('low pollution', 'incline' etc)
		// depending on which tab is active.
		if($("#atob-tab").hasClass("active")){
			$("#options").show();
		} else if($("#circular-tab").hasClass("active")){
			$("#options").hide();
		} else if($("#point-tab").hasClass("active")){
			$("#options").hide();
		}

		// All external links should open in a new window
		// NB the case when a non-external href can start with the letter j
		// is when it starts 'javascript:' (just in case you were wondering...)
		$("a").each(function() {
			if ($(this).attr("href")) {
				var c = $(this).attr("href").substring(0,1);
				var internal = ((c == "/" || c == "#" || c == "?" || c == "j") || (($(this).attr("href").indexOf("walkit.com") != -1)));
				if (!internal) {
					$(this).click(function() {
						return !window.open(this.href);
					});
				}
			}
		});
		
		// Show the city list when the 'explore out cities' button is clicked
		$('#explorecity').click(function(event){ 
				event.stopPropagation();
			
				/* If the city list is still contained within the city intro DIV, move it to 
				   be a direct child of the body (absolutely positioned in its initial place)
				    to prevent it being cropped by overflow:hidden on the city intro DIV */

				// Ensure the city list is a direct child of the body, and not within the city-intro div
				var citylist = $("#citylist");
				if (citylist.is("#city-intro #citylist")) {
					citylist.prependTo("body");
				}

				// Ensure the city list is positioned directly beneath the 'explore our cities' button
				// (do this every time the button is clicked so that the list is in the correct place
				// if the user resizes there font between clicks.  Unfortunately it will still be in the
				// wrong place if the user resizes their font while the list is showing.)
				var anchor = $("#explore");
				var offset = anchor.offset();
				$(citylist).css({"left":offset.left+"px", "top":(offset.top + anchor.height())+"px"});

				// Toggle showing / hiding the city list
				citylist.toggle();
		});
		
		// Hide the city list when any other part of the screen is clicked on
		$('body').click(function() {
			$('#citylist').hide();
		});


		// Allow tab changing by JavaScript
		// NB The "intIndex" is the loop 
		// iteration index on the current element.
		$( "#route-types li" ).each(function( intIndex ) {

			// Change tab when the tab is clicked
			$(this).bind ("click",function(){

				// hide all tooltips
				$(".tip1").fadeOut('fast');
				$(".tip2").fadeOut('fast');
				$(".tip3").fadeOut('fast');

				// Old value
				var def_title = '';
				if($("#atob-tab").hasClass("active")){
					old_val = $("#from").val();
					if( $("#from").attr('title') != undefined )
						def_title =  $("#from").attr('title');
				} else if($("#circular-tab").hasClass("active")){
					old_val = $("#postcode").val();
					if( $("#postcode").attr('title') != undefined )
						def_title =  $("#postcode").attr('title');
				} else if($("#point-tab").hasClass("active")){
					old_val = $("#pointpostcode").val();
					if( $("#pointpostcode").attr('title') != undefined )
						def_title =  $("#pointpostcode").attr('title');
				}

				if( old_val == def_title ) {
					old_val = null;
				}

				$("#route-types ul li[class]").removeClass("active");
				$(this).addClass('active');
				$("#nav").removeClass();
				$("#optionsHandle").removeClass();
				$('#nav').addClass('color-' + intIndex.toString());
				$('#optionsHandle').addClass('colordrop-' + intIndex.toString());
				
				
				$('#nav ul').removeClass('show-me');
				$('#nav ul').addClass('hide-me');

				$('.route-type-' + intIndex.toString()).addClass('show-me');
				
				$(".color-0 #optionsHandle").slideDown('fast');
				$(".color-1 #optionsHandle").slideUp('fast');
				$(".color-2 #optionsHandle").slideUp('fast');
				
				if($("#atob-tab").hasClass("active")){
					if($("#from").length > 0) {
						$(".rfinstruct").html("Walk in");
						$("#city").show();
						$("#route-go").show();
					} else {
						$(".rfinstruct").html("");
						$("#city").hide();
						$("#route-go").hide();
					}
					$("#options").show();
					$('#nav ul#vialist').removeClass('hide-me');
					$('#nav ul#vialist').addClass('show-me');
					
					if(old_val != null) {
						$("#from").val(old_val);
						$('#from').css({ "color" : "#222" });
					}
				} else if($("#circular-tab").hasClass("active")){
					if($("#postcode").length > 0) {
						$(".rfinstruct").html("Walk in");
						$("#city").show();
						$("#route-go").show();
					} else {
						$(".rfinstruct").html("");
						$("#city").hide();
						$("#route-go").hide();
					}
					$("#options").hide();
					if(old_val != null) {
						$("#postcode").val(old_val);
						$('#postcode').css({ "color" : "#222" });
					}
				}
					
			});
		});
		
		$('#route-types li a').click(function(e){
			e.preventDefault();
		});	

		// tabs on confirm page are inactive
		$('#route-types ul.hideactive li a').click(function(e) { 
			e.preventDefault();
			e.stopPropagation();
		});

		// When the 'from' field is typed in, hide the 'Enter your location' reminder
		$("#from").keyup(function() {
			$(".tip2").fadeOut("fast");
		});

		// When the 'to' field is typed in, hide the 'Enter your to address' reminder
		$("#to").keyup(function() {
			$(".tip3").fadeOut("fast");
		});

		
		// Actions to carry out when the 'city' dropdown is changed
		$("#city").change(function(event){					
			$(".tip1").fadeOut('fast');

			// If we are on the straightforward ('a to b' tab)...
  			if($("#atob-tab").hasClass("active")){

				// Hide the 'Please select a city' reminder if it is showing
				$(".tip1").fadeOut('fast');

				// Give the 'from' field foduc
				$("#from").focus();
			

			// If we're on the 'circular' tab...
			} else if($("#circular-tab").hasClass("active")){

				// Hide the 'Please select a city' reminder if it is showing
				$(".tip1").fadeOut('fast');

				// Give the 'postcode' field focus
				$("#postcode").focus();
			}
			
			// Enable low pollution option if available.
			// Disable it if it is not.
			enableDisableLowPollutionOption();
		});
			  

		/* Hovers for everyone (including IE6!) */
		
	      $('button').hover(function() {
	        $(this).addClass('button-hover');
	      }, function() {
	        $(this).removeClass('button-hover');
	      });
	
	      $('#explore h3 a').hover(function() {
	        $(this).addClass('hover');
	      }, function() {
	        $(this).removeClass('hover');
	      });
	
	
		// Count vias
		var num = $("#vialist li").size();

		// If there are any vias, remove the height constraint on the routefinder
		if (num > 0) {
			removeRouteFinderHeightContraint();
		}

		/* add remove vias */
		$('#add').click(function(){ 

			if (num == 3) { // 4 is the limit, but this test comes before the counter increment
				$('.addvia').toggle(); // hide('fast');
            }
			
			if (num < 4) {

				// Remove the height constraint on the routefinder element
				removeRouteFinderHeightContraint();

				// If there are no vias, add the UL that contains them
				if ($('#vialist').length == 0) {
					$("#fromaddress").after("<ul id='vialist'></ul>");

					// We need to have num >=1 as it is included in the element IDs, which cannot contain a zero
					//num = 1;
					// otherwise double increment after num++; below.
				}

				// Append a via and give it focus
				$('#vialist').append('<li id="livia'+num+'"><label for="via'+num+'">via ' + '</label><input type="text" id="via'+num+'" name="via"></input><a class="remove">&nbsp;</a></li>');
				$('#via'+num).focus();
				
				// Increment the via count
				num++;
			}
		});
		
		$('.remove').live("click",function(){ 
			num = num - 1;
			$(this).parent().hide('fast');
			$(this).parent().remove();
			
			if( num == 3 ) {
				$('.addvia').toggle();
			}

			// If there are no vias, put the height constraint back on the routefinder
			if (num == 0) {
				$("#nav").css({"height":"202px", "min-height":"0"});
			}
		});
			
		
		/* result page */
		
		/* map toolbar */
		$('#printd, #printmd').live('click', function(){
			$('.modal-close').trigger('click');
			if ($(this).is("#printd")) {
				$("body").addClass("hidemapwhenprinting");
			} else {
				$("body").removeClass("hidemapwhenprinting");
			}
			window.print();
			return false;
		});

		$('#printm').live('click', function(){
			$("#walkit_map").get(0).printMap();
			$('.modal-close').trigger('click');
			return false;
		});

		
		// form validation
		$('#validate').submit(function() {	
			
						
			// validate city
			var selected = $("#city option:selected"); 		
	
			if ((selected.val() == "none")) {
				// trigger first
				$(".tip1").fadeOut('fast');
				$(".tip2").fadeOut('fast');
				$(".tip3").fadeOut('fast');

				$(".tip1").fadeIn('fast');				
				return false;
			}
			// check which routetype
			if($("#atob-tab").hasClass("active")){ 
				
				// a to b validation
				if ($("#from").val().length == 0 || $("#from").val() == $("#from").attr('title')) {
					$(".tip1").fadeOut('fast');
					$(".tip2").fadeOut('fast');
					$(".tip3").fadeOut('fast');

					$(".tip2").fadeIn('fast');
					return false;
				}
				if ($("#to").val().length == 0) {
					$(".tip1").fadeOut('fast');
					$(".tip2").fadeOut('fast');
					$(".tip3").fadeOut('fast');

					$(".tip3").fadeIn('fast');
					return false;
				}				
			} else if($("#circular-tab").hasClass("active")){
				// circular
				if ($("#postcode").length < 1 )
					return false;
				
				$("#route_style").val("circular");
				
				if ($("#postcode").val().length == 0 || $("#postcode").val()== $("#postcode").attr('title')) {
					$(".tip1").fadeOut('fast');
					$(".tip2").fadeOut('fast');
					$(".tip3").fadeOut('fast');
					$("#postcode").focus();
					$(".tip2").fadeIn('fast');
					return false;
				}
			}

			// looks like everything is valid
			// filter off the form elements we don't want to send
			// disable all form elements

			 $("#validate input").attr("disabled", "disabled");
			 $("#validate select").attr("disabled", "disabled");
			
			// enable the ones we want to send	
			// and set route_style		
			if($("#atob-tab").hasClass("active")) {
				
				$("#city").removeAttr("disabled");
				$("#form-atob input").removeAttr("disabled");

				$("#d1, #d2, #d3").removeAttr("disabled");

				$("#route_style").removeAttr("disabled");							
				
				$("#route_style").val("linear");

				// required 
				var city = $("#city").val();
				if (city == "london" || city == "cambridge") {
					$('#d3').removeAttr('disabled');
					$("#d3_rl").css({"color" : "#222"});
				} else {
					if( $('#d3').attr('checked') == true || $('#d3').attr('checked') == "checked" ) {
									$('#d1').attr('checked', true);
					}
					$('#d3').attr('disabled', true);

					$("#d3_rl").css({"color" : "#5A92BC"});
				}

			} else if($("#circular-tab").hasClass("active")){
				
				$("#city").removeAttr("disabled");
				$("#postcode").removeAttr("disabled");
				$("#time").removeAttr("disabled");
				$("#route_style").removeAttr("disabled");
				$("#pace").removeAttr("disabled");

				$("#route_style").val("circular");
			
			} else if($("#point-tab").hasClass("active")){ 
				$("#city").removeAttr("disabled");
				$("#pointpostcode").removeAttr("disabled");
				$("#route_style").removeAttr("disabled");
				
				$("#route_style").val("map");
			}
			
		});
		
	
		// small function for default clearing textboxes
		
		$.fn.search = function() {
			return this.focus(function() {
				if( this.value == this.defaultValue && this.defaultValue == this.title ) {
				//if( this.value == this.defaultValue ) {
					this.value = "";
				}
			});
		};

		$.fn.searchstyle = function() {
			return this.focus(function() {
					$(this).css({
						 "color" : "#222"
					});
					
			}).blur(function() {
				if( this.value == this.defaultValue && this.defaultValue == this.title ) {
					$(this).css({
							 "color" : "#777"
					});
				} else {
					$(this).css({
							 "color" : "#222"
					});
				}
			});
		};

			$.fn.clear = function() {
				return this.focus(function() {
					if( this.value == this.defaultValue ) {
						this.value = "";
					}
				}).blur(function() {
					if( !this.value.length ) {
						this.value = this.defaultValue;
					}
				});
			};

		$("#name").clear();
		$("#ndjg-ndjg").clear();
		

		// routefinder
		$("#from").search();
		$("#from").searchstyle();
		$("#postcode").search();
		$("#postcode").searchstyle();

		$(".clickablestep").click(function() {
			$(".clickablestep").removeClass("instrfocus");
			$(this).addClass("instrfocus");
			
			var nidr = $(this).attr("id");

			if( nidr == undefined || nidr == null || nidr == "" )
				return;

			var narr = nidr.split("_");

			var leg = narr[0].substr(1);
			var nid = narr[1];

			$("#walkit_map").get(0).showRouteStep( "rtids="+rindices[parseInt(leg)]+"&snid="+nid+"&enid=" );
		});
		
		// Activate modal dialog
		$('.modal').live('click', function(e) {

			e.preventDefault();
			e.stopPropagation();
			
			// Hide the black overlay and the content of the modal dialog
			$('#modal-content').hide(); // #modal-black
			
			// If this button has an href attribute, open that link in the modal dialog
			var src = $(this).attr('href');
			var _id = $(this).attr('id');
			if(src && src != "#"){
				$.get(src, { modal: 1 }, function(data){
					$('#modal-content').html($.trim(data));
					$('#modal-content').append('<a href="javascript:void(0)" class="modal-close">x</a>');		
					$('#modal-black, #modal-content').show();
					$("#modal-content input[type='text']:first").focus();
				});
			
			// If not, find the contents of a div with class 'modal-inline-content' + any id on the clicked element
			// and add them to the modal dialog instead
			}else{
				// global search context
				mod_content = $('.modal-inline-content-'+_id);
			
				// local search context
				if( mod_content.length == 0 )
					mod_content = $(this).find('.modal-inline-content');
					
				if( mod_content.length == 0 )
					return false;
					
				$('#modal-content').html(mod_content.html());
				$('#modal-content').append('<a href="javascript:void(0)" class="modal-close">x</a>');
				$('#modal-content').addClass('modal-inline-content-'+_id);
				$('#modal-black, #modal-content').show();
				$("#modal-content input[type='text']:first").focus();
			}

			// Style the modal dialog using javascript (IE only)
			if (!browserSupportsPositionFixed()) {
				$("#modal-black").css({height:$(document).height(), width:$(document).width(), position:"absolute", top:0, left:0});
				$("#modal-content").css({position:"absolute", top:$(window).height() / 2 - ($(this).height()/2), left:$(window).width() / 2 - ($(this).width()/2)});

				// In IE, select boxes tend to appear on top of over elements
				// (even if their z-index is lower) so hide them
				$("select:visible").addClass("modalhidden").hide();
				$("#bank_speed").removeClass("modalhidden").show();
			}
		});

		// activate modal dialog on doc ready
		// requires .modal click event to have been bound!
		if($('.modal-display-on-ready').length > 0) {
			$('.modal-display-on-ready').trigger('click');
		}
		
		$("#modal-content.modal-inline-content-showlink input[type='text']").live('click', function(){
			$(this).focus();
			$(this).select();
		});

		$('#modal-black, .modal-close').live('click', function(){
			$('#modal-black, #modal-content').toggle();

				$('#modal-content').removeClass();// remove all classes

			// Show any select boxes that were hidden (for IE6) when the modal was displayed
			$("select.modalhidden").removeClass("modalhidden").show();
		});
		
		/* Banking route */
		
		$('.unbanked a').live('click', function(e){
			e.preventDefault();
			
			var route_id = $(this).parents('li').attr('id').replace('metai-', '').replace('route-', '');
			
			var parent = $(this).parent();
			
			$.getJSON('/bank-statistics/', { 'metai': route_id, 'walked': 1, 'city': $('#city option:selected').val() }, function(data){
				if(data.banked == true){
					parent.attr('class', 'banked').html('Banked <a href="/bank-statistics/?metai=' + route_id + '&walked=0">unbank</a>');
				}
			});
		});

		$('.toggle-control').click(function(){
			$(this).toggleClass('collapsed');
			$(this).parents('.panel').siblings('.panel').find('.toggle-content').hide(500);
			$(this).parents('.panel').siblings('.panel').find('h3').removeClass('collapsed');
			$(this).siblings('.toggle-content').slideToggle(500);
		});
		
		$('.panel.active .toggle-content').show(500);
		
		// From header
		var COOKIE_ONE = 'walkit_saved_city';
		var COOKIE_TWO = 'walkit_saved_city_id';

		$('.expand-result').click(function(e){
			if( $(this).hasClass('modal') || $(this).children().hasClass('modal') )
				return;

			e.preventDefault();
			if( $(this).html().indexOf("More") == 0 ) {
				$(this).html( $(this).html().replace("More", "Fewer") );
			} else if( $(this).html().indexOf("Fewer") == 0 ) {
				$(this).html( $(this).html().replace("Fewer", "More") );
			}
			if( e.altKey ) {
				$('.'+$(this).attr('class').replace(' ','.')).next('div').slideToggle(300);
			} else {
				$(this).next('div').slideToggle(300);
			}
		});

		$('.close-result').click(function(e){
			e.preventDefault();
			$('div.expanded-content2').slideToggle(300);
		});

		//toggle the componenet with class msg_body
		$('.expand-result-toggle').click(function(e){
			e.preventDefault();

			$(this).next('div').slideToggle(300);
			$(this).find('img').toggle();
		});
		

		$('a#set').live("click", function() { // set cookie by number of days
			var c_id = $(this).attr('class').split("_");
			$.cookie(COOKIE_ONE, c_id[0], { path: '/', expires: 365, domain: '.walkit.com' });
			$.cookie(COOKIE_TWO, c_id[1], { path: '/', expires: 365, domain: '.walkit.com' });
			$('a#set').html('Saved as home city');
			$('a#set').animate({opacity: 0.0}, 800);
			$('a#set').css("background-color","#e2ffce");
			$('a#set').css("color","#3d6d1d");
			$('a#set').animate({opacity: 1.0}, 800);
			$('a#nuke').animate({opacity: 1.0}, 800);
			
			return false;
		});

		$('a#get').eq(2).click(function() { // get cookie
				alert($.cookie(COOKIE_NAME));
				return false;
		});
		$('a#nuke').click(function() { // delete cookie
			$.cookie(COOKIE_ONE, null, { path: '/' });
			$.cookie(COOKIE_TWO, null, { path: '/' });

			$('a#nuke').html('Home city removed');
			$('a#nuke').animate({opacity: 0.0}, 800);
			$('a#nuke').css("background-color","#e2ffce");
			$('a#nuke').css("color","#3d6d1d");
			$('a#nuke').animate({opacity: 1.0}, 800);
			$('a#set').animate({opacity: 1.0}, 800);
			return false;
		});
		
		// Support for 'Search again...' in confirm.
		$('.validate').click (function() {	

			$("#"+this.id.substr(4,this.id.length)).remove();				
			$('#_'+this.id.substr(4,this.id.length)).show().focus();	
			$('.notice'+this.id.substr(4,this.id.length)).html('Please type an alternative location in the box above.');
		});
	
		$('#bank').click(function(){
			var action;
			
			if ($('button#motivation').hasClass('unbank')) { // bank-mot
				action = 'unbank';
			} else {
				action = 'bank';
			}
			
			if( ($(this).children().attr('id') != 'motivation' && $(this).attr('id') != 'motivation') || action == "unbank" ) {
				
				$.getJSON('/mywalkit/'+action+'-statistics/', { 'metai': metai, 'walked': 1, 'city': $('#city option:selected').val() }, function(json){
					if(json.banked == true){
						$('button#motivation').removeClass('unbank'); // bank-mot
						$('button#motivation').addClass('unbank'); // bank-mot
						$('button#motivation').removeClass('modal');
						// $('button#motivation').hide();
					} else if(json.unbanked == true) {
						$('button#motivation').removeClass('unbank'); // bank-mot
						$('button#motivation').removeClass('modal');
						$('button#motivation').addClass('modal');
						//$('button#motivation').show();
					} else {
						$(this).parent().append('<p class="inline-error">Error</p>');
					}
				});
			}
		});
		
		$('#mot-go').live('click', function(e){
			e.preventDefault();
			e.stopPropagation();
			var action = 'bank';
			var alt = '';
			if ($("#modal-content input[name='switch']:checked").length == 1) {
				alt = $("input[name='switch']:checked").val();
			}
			
			if( window._bankcbfunc == undefined ) {
				$.getJSON('/mywalkit/'+action+'-statistics/', { 'metai': metai, 'walked': 1, 'alt': alt, 'speed': $("#bank_speed").val(), 'city': $('#city option:selected').val() }, function(json){
					if(json.banked == true){
						$('button#motivation').removeClass('unbank'); // bank-mot
						$('button#motivation').addClass('unbank'); // bank-mot
						$('button#motivation').removeClass('modal');
						// $('button#motivation').hide();
					}else{
						$(this).parent().append('<p class="inline-error">Error</p>');
					}
				});
			} else {
				$.getJSON('/mywalkit/'+action+'-statistics/', { 'metai': metai, 'walked': 1, 'alt': alt, 'speed': $("#bank_speed").val(), 'city': window.bcity }, window._bankcbfunc );
				window._bankcbfunc = null;
			}
			$('.modal-close').trigger('click');
		});
	
	
		if($('#page-register').length > 0 && (window.Recaptcha != undefined) && $('#_recaptcha').length > 0) { Recaptcha.create("6LfduwkAAAAAAINJ0rKYJdDgK0vm3NnBoholaZqs", "_recaptcha", { theme: "white", callback: Recaptcha.focus_response_field }); }
	}
);

// Function to detect availability of position:fixed (for modal dialogs in IE6)
// from http://yura.thinkweb2.com/cft/#IS_POSITION_FIXED_SUPPORTED
function browserSupportsPositionFixed() {
 var isSupported = null;
 if (document.createElement) {
     var el = document.createElement("div");
     if (el && el.style) {
         el.style.width = "1px";
         el.style.height = "1px";
         el.style.position = "fixed";
         el.style.top = "10px";
         var root = document.body;
         if (root && root.appendChild && root.removeChild) {
             root.appendChild(el);
             isSupported = el.offsetTop === 10;
             root.removeChild(el);
         }
         el = null;
     }
 }
 return isSupported;
}

// Change the CSS 'height' on the routefinder, to a 'min-height'
// (except in IE6, where min-height is not supported but the browser
// treats height as min-height)
function removeRouteFinderHeightContraint() {
	var nav = $("#nav");
	if (nav.length > 0 && !($.browser.msie && $.browser.version.substring(0, 1) == "6")) {
		nav.css({"height":"auto", "min-height":"200px"});
	}
}

// Show / hide the lines that mark out the widget areas on the 
// widget arrangement screen (also toggles min-height on the widget areas)
function toggleMarkOutWidgetRegions(el) {

	// Show markings if hidden
	if (jQuery(".rearrangeinterfacenotmarkedout").length) {
		jQuery(".rearrangeinterfacenotmarkedout").addClass("rearrangeinterface").removeClass("rearrangeinterfacenotmarkedout");
		jQuery(el).text("Hide guide lines");

	// Hide markings if shown
	} else {
		jQuery(".rearrangeinterface").addClass("rearrangeinterfacenotmarkedout").removeClass("rearrangeinterface");
		jQuery(el).text("Show guide lines");
	}
	jQuery(el).blur();
}

// Enable or disable the 'low pollution' option depending on whether or not it
// is available in the current city.
function enableDisableLowPollutionOption() {

	if( $("#validate #city").length == 0 )
		return;

	// Enable low pollution option if available
	if ($("#city option:selected").hasClass("supportsroutelowpollution")) {
		$('#d3').removeAttr('disabled');
		$("#d3_rl").css({"color" : "#222"});

	// Disable the low pollution option if it is not available
	} else {

		// Untick the low pollution option if it is ticked, and tick the 'direct' option instead
		if( $('#d3').attr('checked') == true || $('#d3').attr('checked') == "checked" ) {
			$('#d1').attr('checked', true);
		}

		// Disable the option
		$('#d3').attr('disabled', true);
		$("#d3_rl").css({"color" : "#5A92BC"});
	}
}