/*************************************************************************** * * Copyright (C) Telegraph Media Group Ltd. * All Rights Reserved. No use, copying or distribution of this work may be * made. This notice must be included on all copies, modifications and * derivatives of this work. **************************************************************************** * Author: L Dyson Date: 31/03/2008 * * Description: * jQuery code to render the Travel Dropdown Menu (see travelDestinationMenu.jsp) * **************************************************************************** * $Id: travelDestinationMenu.js,v 1.2 2008/07/02 17:41:28 dysonl Exp $ ***************************************************************************/ jQuery.fn.outerHTML = function() { return $('

').append( this.eq(0).clone() ).html(); }; var travelDestinationSelector = "

Select a destination

"; $(function() { $("#travelDestinationsSelector").html(travelDestinationSelector); $("#travelDestinationsSelector").removeClass("hide"); $("#travelDestinationsSelector select[class*='hide']").removeClass("hide").hide(); // function to kill all special characters function removeSpecChar(str) { var specChar = /\$|\s|,|@|#|~|`|\%|\*|\^|\&|\(|\)|\+|\=|\[|\_|\]|\}|\{|\;|\:|\'|\<|\>|\?|\||\\|\/|\!|\./g; // remove special characters like "$" and "," etc... return str.replace(specChar, ""); } /* Check to see if we are on a page accessible through the Travel Dropdown Navigation. * If we are, select the relevant options in the selectors */ /**************** START: SORT REGION SELECT LIST ****************/ var checkRegion = $("#regionSelector > option").get(); var select1Region = new Array(); var select1Country = new Array(); var passSeperator = false; for (i in checkRegion) { if ($(checkRegion[i]).html() != "Select a region") { if ($(checkRegion[i]).html() != "" || $(checkRegion[i]).html() != null) { if (!passSeperator) { select1Region[$(checkRegion[i]).html()] = $(checkRegion[i]).attr("value"); } else { select1Country[$(checkRegion[i]).html()] = $(checkRegion[i]).attr("value"); } } if ($(checkRegion[i]).html() == "" || $(checkRegion[i]).html() == null) { var passSeperator = true; } } } var select1RegionKeys = new Array(); for(k in select1Region) { select1RegionKeys.push(k); } select1RegionKeys.sort(); var select1RegionOptions = ""; for (var i = 0; i < select1RegionKeys.length; i++) { if (select1Region[select1RegionKeys[i]] != undefined) { select1RegionOptions += "\n"; } } var select1CountryKeys = new Array(); for(k in select1Country) { select1CountryKeys.push(k); } select1CountryKeys.sort(); var select1CountryOptions = ""; for (var i = 0; i < select1CountryKeys.length; i++) { if (select1Country[select1CountryKeys[i]] != undefined) { select1CountryOptions += "\n"; } } var regionSelector = ""; regionSelector += $("#regionSelector > option:eq(0)").outerHTML()+"\n"+select1RegionOptions; if (select1CountryOptions.length > 0) { regionSelector += "\n"+select1CountryOptions; } $("#regionSelector").html(regionSelector); checkRegion = $("#regionSelector > option").get(); /**************** END: SORT REGION SELECT LIST ****************/ /**************** START: SORT DESTINATION LISTS ****************/ for (i in checkRegion) { if ($(checkRegion[i]).html() != "Select a region") { if ($(checkRegion[i]).html() != "" || $(checkRegion[i]).html() != null) { var regionSelect = $(checkRegion[i]).html(); regionSelect = removeSpecChar(regionSelect); var select2Options = $("#"+regionSelect+" > option").get(); var select2OptionsPreSort = new Array(); var select2OptionsOpener = ""; for (i in select2Options) { if ($(select2Options[i]).html() != "Select a destination" && $(select2Options[i]).html() != "Select a City") { select2OptionsPreSort[$(select2Options[i]).html()] = $(select2Options[i]).attr("value"); } else { select2OptionsOpener = $(select2Options[i]).outerHTML()+"\n"; } } select2OptionsKeys = new Array(); for(k in select2OptionsPreSort) { select2OptionsKeys.push(k); } select2OptionsKeys.sort(); var select2Options = select2OptionsOpener; for (var i = 0; i < select2OptionsKeys.length; i++) { select2Options += "\n"; } $("#"+regionSelect).html(select2Options); } } } /**************** END: SORT DESTINATION LISTS ****************/ /**************** START: RENDER EVENTS AND SHOW ****************/ var destinationListToShow = ""; for (i in checkRegion) { var winLoc = window.location+""; if (winLoc.indexOf($(checkRegion[i]).attr("value")) > -1) { $(checkRegion[i]).attr("selected","true"); // We're in a region, so hide the generic destination selector for the appropriate one destinationListToShow = removeSpecChar($(checkRegion[i]).text()); // Enable the submit button $("#travelDestinationsSelector > #travelDestinationNav > input[type='submit']").removeClass("subBtnInactive").addClass("subBtnActive").attr("disabled",false); } } if (destinationListToShow != "") { $("#none").hide(); $("#"+destinationListToShow).show(); alert("showing "+destinationListToShow); // As with the region, check to see if we're on a destination and select accordingly var checkDestination = $("#"+destinationListToShow+" > option").get(); for (i in checkDestination) { if (winLoc.indexOf($(checkDestination[i]).attr("value")) > -1) { $(checkDestination[i]).attr("selected","true"); } } } // If a user selects a region, show the destination selector appropriate for the region $("#regionSelector").change(function(){ var regionSelected = $(this).find(":selected").text(); regionSelected = removeSpecChar(regionSelected); $("select:not(#regionSelector)").hide(); if (regionSelected != "" && regionSelected != "SelectaRegionorCountry") { $("#travelDestinationsSelector > #travelDestinationNav > input[type='submit']").removeClass("subBtnInactive").addClass("subBtnActive").attr("disabled",false); if ($("#"+regionSelected).length > 0) { $("#"+regionSelected).show(); } else { $("#none").show(); } } else { $("#travelDestinationsSelector > #travelDestinationNav > input[type='submit']").removeClass("subBtnActive").addClass("subBtnInactive").attr("disabled",true); $("#none").show(); } }); // If the user wants to navigate to their chosen region, forward them to it $("#travelDestinationsSelector > #travelDestinationNav > input[type='submit']").click(function(){ $("#travelDestinationsSelector > #travelDestinationNav > input[type='submit']").removeClass("subBtnActive").addClass("subBtnInactive").attr("disabled",true); var regionSelected = $("#regionSelector > option[value^='http://']:selected").text(); regionSelected = removeSpecChar(regionSelected); if (regionSelected != null && regionSelected.length > 0) { var destinationSelected = $("#"+regionSelected+" > option[value^='http://']:selected").text(); if (destinationSelected.length != null && destinationSelected.length > 0) { window.location = $("#"+regionSelected+" > option[value^='http://']:selected").attr("value"); } else { window.location = $("#regionSelector > option[value^='http://']:selected").attr("value"); } } return false; }); /**************** START: RENDER EVENTS AND SHOW ****************/ });