﻿
// Regions/Cities/Dates logic

// Arrays
var cityCount = 0; 
var data = new Array(); 
function Link(region, cities, available_dates)
{  
    this.region          = region;
    this.cities          = cities;
    this.available_dates = available_dates; 
} 

// SHOW/HIDE SECTIONS /////////////////////////////////////////////////////////////////////////////////

function ShowHideSections(sectionNumber)
{    
    // Determine if we need to show or hide the "lower" sections
    var curSpanSection = document.getElementById("spanSection" + sectionNumber);  
    
    if (curSpanSection.style.display == "none")
    { 
        // The current section's items are visible and "lower" sections are hidden
        
        // Hide the items for the current section
        if (sectionNumber == 1)
        {  
            var spanRegions = document.getElementById("spanRegions");  
            spanRegions.style.display = "none";
            spanRegions.style.visibility = "hidden"; 
        }
        else if (sectionNumber == 2)
        {  
            var spanCities = document.getElementById("spanCities");  
            spanCities.style.display = "none";
            spanCities.style.visibility = "hidden"; 
        }
        else if (sectionNumber == 3)
        {  
            var spanAirports = document.getElementById("spanAirports");  
            spanAirports.style.display = "none";
            spanAirports.style.visibility = "hidden"; 
        }
        else if (sectionNumber == 4)
        {  
            var spanYears = document.getElementById("spanYears");  
            spanYears.style.display = "none";
            spanYears.style.visibility = "hidden"; 
            var spanMonths = document.getElementById("spanMonths");  
            spanMonths.style.display = "none";
            spanMonths.style.visibility = "hidden"; 
        }
        
        // Show all sections
        for (var i = 1; i <= 4; i++)
        {
            var spanSection = document.getElementById("spanSection" + i);
            spanSection.style.display = "inline";
            spanSection.style.visibility = "visible";
        }
    }
    else
    { 
        // The current section's items are hidden and "lower" sections are visible
        
        // Show the items for the current section
        if (sectionNumber == 1)
        {  
            // Check if the city items are being displayed
            var spanCities = document.getElementById("spanCities");  
            if (spanCities.style.display == "inline") return;            
            
            var spanRegions = document.getElementById("spanRegions");  
            spanRegions.style.display = "inline";
            spanRegions.style.visibility = "visible"; 
        }
        else if (sectionNumber == 2)
        {  
            // Check to see if a region has been selected
            var tbRegion = document.getElementById("tbRegion"); 
            var region = tbRegion.value; 
            if ((region == "") || (region == "Region"))
            {
                SetMessage("Please select a Region."); 
                return false; 
            }

            var spanCities = document.getElementById("spanCities");  
            spanCities.style.display = "inline";
            spanCities.style.visibility = "visible"; 
        }
        else if (sectionNumber == 3)
        {   
            var spanAirports = document.getElementById("spanAirports");  
            spanAirports.style.display = "inline";
            spanAirports.style.visibility = "visible"; 
        }
        else if (sectionNumber == 4)
        {    
            // Check to see if a region and/or city/destination has been selected
            var tbRegion = document.getElementById("tbRegion"); 
            var region = tbRegion.value; 
            if ((region == "") || (region == "Region"))
            {
                SetMessage("Please select a Region."); 
                return false; 
            } 
            var tbCity = document.getElementById("tbCity"); 
            var city = tbCity.value; 
            if ((city == "") || (city == "City/Destination"))
            {
                SetMessage("Please select a City/Destination."); 
                return false; 
            } 

            var spanYears = document.getElementById("spanYears");  
            spanYears.style.display = "inline";
            spanYears.style.visibility = "visible"; 
            var spanMonths = document.getElementById("spanMonths");  
            spanMonths.style.display = "inline";
            spanMonths.style.visibility = "visible"; 
        }
        
        // Hide the "lower" sections 
        for (var i = sectionNumber; i <= 4; i++)
        {
            var spanSection = document.getElementById("spanSection" + i); 
            spanSection.style.display = "none";
            spanSection.style.visibility = "hidden";
        }
    } 
    
}

function SetMessage(theMessage)
{
    var labelMessage = document.getElementById("labelMessage");  
    labelMessage.innerHTML = theMessage;  
}
 
// REGIONS ////////////////////////////////////////////////////////////////////////////////////////////
 
function GetRegions()
{ 
    //
    var usedRegions = "";
    var items = "";

    // Loop through the data  
    var itemIndex = 1;
    for ( var i = 0 ; i < data.length ; i++ )
    {  
        // Validate the data
        if (data[i].region == null) continue; 

        // Add only unique regions
        if (usedRegions.indexOf("|" + data[i].region + "|") >= 0) continue;
        usedRegions += "|" + data[i].region + "|";

        // Create the clickable region item
        var jsMethod = "javascript:RegionClick(\"" + data[i].region + "\"); return false;";
        items += "<div class='region_item' onclick='" + jsMethod + "'>";
        items += data[i].region;
        items += "</div>"; 
        itemIndex ++; 
    } 

    // Create the dropdown html
    var html = "";
    html = "<table width='247px' border='0'>"; 
    html += "<tr>"; 
    html += "<td rowspan='2' width='240px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>"; 
    html += "<td width='7px' style='text-align:left; vertical-align:top; padding-left:5px;'>";
    html += "&nbsp"; 
    html += "</td>"; 
    html += "</tr>";  
    html += "</table>";

    return html; 
} 
 
function RegionClick(clickedRegion)
{  
    SetMessage("");
    
    var tbRegion = document.getElementById("tbRegion"); 
    if (clickedRegion == "")
        tbRegion.value = "Region";
    else
        tbRegion.value = clickedRegion;
    
    if (clickedRegion != "") 
    {
        SetCities();
        ResetYearMonth();
        ShowHideSections(1);
    }
} 

// CITIES ////////////////////////////////////////////////////////////////////////////////////////////

function SetCities()
{ 
    // Clear any error/warning messages
    SetMessage(""); 
        
    // Get the selected region
    var tbRegion = document.getElementById("tbRegion"); 
    var region = tbRegion.value;  
    
    // Get the City text box (fake dropdown)
    var tbCity = document.getElementById("tbCity"); 
    tbCity.value = "City/Destination";
    
    // Get the region where the cities will go
    var labelCities = document.getElementById("labelCities");  
    labelCities.innerHTML = "";     
      
    // Create (get) an array of cities that belong to this region
    var cityString = ""; 
     
    // Loop thru the data from the js file
    for ( var i = 0 ; i < data.length ; i++ )
    {  
        // Check if this region matches our selected region
        if (data[i].region == null) continue; 
        if (data[i].region != region) continue; 
        
        // Check if there is only one city in this row 
        if (data[i].cities.indexOf("|") < 0) 
        {    
            // Add the city to the list of cities
            if (cityString.indexOf(":" + data[i].cities + ":") < 0) 
                cityString += ":" + data[i].cities + ":";  
        }
        else
        {
            // There are more than one city in this row - loop through each
            var citySubArray = data[i].cities.split('|');
            for (var j = 0; j < citySubArray.length ; j++)
            {    
                if (cityString.indexOf(":" + citySubArray[j] + ":") < 0) 
                    cityString += ":" + citySubArray[j] + ":"; 
            }
        } 
    }  
    cityString = cityString.replace(/::/g, ':'); 
    var cityArray = cityString.split(':'); 
    cityArray.sort();  
    
    var itemIndex = 1;
    var itemArray = new Array();
     
    for ( var i = 0 ; i < cityArray.length ; i++ )
    {
        if (cityArray[i] == null) continue;
        if (cityArray[i] == "") continue;
        
        cityArray[i] = cityArray[i].replace(/'/g, '`');
    
        var tempItem = "";
        var jsMethod = "javascript:CityClick(" + itemIndex + ", \"" + cityArray[i] + "\"); return false;";
        tempItem += "<div id='option-" + itemIndex + "-' class='cbx-input' onclick='" + jsMethod + "' ";
        //tempItem += "onmouseover='this.style.backgroundColor=\"#cccccc\";' onmouseout='this.style.backgroundColor=\"White\";'";
        tempItem += "style='width:100%;white-space:nowrap;'>";
        tempItem += cityArray[i];  
        tempItem += "</div>"; 
        
        itemArray[itemIndex - 1] = tempItem;
        
        itemIndex ++; 
    }            
    
    cityCount = itemIndex - 1;
     
    // Begin creating the inner html for the cities label
    var html = "";
    
    // Check how many cities we have
    if (itemArray.length <= 10)
    {
        var items = "";
        for ( var i = 0 ; i < itemArray.length ; i++ )
        {
            items += itemArray[i];
        }
         
        html += "<div style='width:425px; background-color: White; position: absolute; z-index:5; border:solid 1px #484848;'>"; 
        html += "<table width='100%'>"; 
        html += "<tr>"; 
        html += "<td width='250px' style='vertical-align:top;'>"; 
        html += "<div id='cbx_test' class='clearfix' style='width:250px;'>" + items + "</div>"; 
        html += "</td>"; 
        html += "<td width='170px' style='text-align:left; vertical-align:top; padding-right:8px;'>";
        html += "Select&nbsp;one&nbsp;or&nbsp;more<br/>";
        html += "locations&nbsp;to&nbsp;begin<br/>";
        html += "planning&nbsp;your&nbsp;trip.";
        html += "<br/><br/>";
        html += "<a href='javascript:;'><img src='/user/images/booking/buttons/buttonContinue.jpg' border='0' alt='' onclick='ShowHideSections(2);' /></a>"; 
        html += "</td>"; 
        html += "</tr>";  
        html += "</table>";
        html += "</div>";
    }
    else if ((itemArray.length > 10) && (itemArray.length <= 25))
    {
        var items1 = "";
        var items2 = "";
        for ( var i = 0 ; i < itemArray.length ; i++ )
        {
            if (i < (itemArray.length/2))
                items1 += itemArray[i];
            else
                items2 += itemArray[i]; 
        }
        
        html += "<div style='width:502px;background-color: White; position: absolute; z-index:5; border:solid 1px #484848;'>"; 
        html += "<table width='100%' border='0'>"; 
        html += "<tr>";  
        html += "<td width='330px' style='padding-top:8px;text-align:left; vertical-align:top; padding-left:10px; font-weight:bold;'>"; 
        html += "Select&nbsp;one&nbsp;or&nbsp;more&nbsp;locations&nbsp;to&nbsp;begin&nbsp;planning&nbsp;your&nbsp;trip.";
        html += "</td>"; 
        html += "<td width='170px' style='text-align:left; vertical-align:top; padding-top:10px; padding-right:8px;'>";  
        html += "<a href='javascript:;'><img src='/user/images/booking/buttons/buttonContinue.jpg' border='0' alt='' onclick='ShowHideSections(2);' /></a>"; 
        html += "</td>"; 
        html += "</tr>"; 
        html += "<tr style='height:1px;'><td colspan='2' style='vertical-align:top; padding-left:5px; padding-right:5px;'><hr style='height:1px;' /></td></tr>"; 
        html += "</table>"; 
        html += "<table width='100%' border='0'>"; 
        html += "<tr>"; 
        html += "<td width='250px' style='vertical-align:top;'>" + items1 + "</td>";  
        html += "<td width='250px' style='vertical-align:top;'>" + items2 + "</td>"; 
        html += "</tr>"; 
        html += "</table>"; 
        html += "</div>"; 
    }
    else
    {
        var items1 = "";
        var items2 = "";
        var items3 = ""; 
        for ( var i = 0 ; i < itemArray.length ; i++ )
        {
            if (i < (itemArray.length/3))
                items1 += itemArray[i];
            else if (i > (2*itemArray.length/3))
                items3 += itemArray[i];
            else
                items2 += itemArray[i]; 
        }
        
        html += "<div style='width:753px;background-color: White; position: absolute; z-index:5; border:solid 1px #484848;'>"; 
        html += "<table width='100%' border='0'>"; 
        html += "<tr>";  
        html += "<td width='330px' style='padding-top:8px; text-align:left; vertical-align:top; padding-left:10px; font-weight:bold;'>";  
        html += "Select&nbsp;one&nbsp;or&nbsp;more&nbsp;locations&nbsp;to&nbsp;begin&nbsp;planning&nbsp;your&nbsp;trip.";
        html += "</td>"; 
        html += "<td width='420px' style='text-align:left; vertical-align:top; padding-top:10px; padding-right:8px;'>";  
        html += "<a href='javascript:;'><img src='/user/images/booking/buttons/buttonContinue.jpg' border='0' alt='' onclick='ShowHideSections(2);' /></a>"; 
        html += "</td>"; 
        html += "</tr>"; 
        html += "<tr style='height:1px;'><td colspan='2' style='vertical-align:top; padding-left:5px; padding-right:5px;'><hr style='height:1px;' /></td></tr>"; 
        html += "</table>"; 
        html += "<table width='100%' border='0'>"; 
        html += "<tr>"; 
        html += "<td width='250px' rowspan='2' style='vertical-align:top;'>" + items1 + "</td>";  
        html += "<td width='250px' rowspan='2' style='vertical-align:top;'>" + items2 + "</td>"; 
        html += "<td width='250px' rowspan='2' style='vertical-align:top;'>" + items3 + "</td>";  
        html += "</tr>";   
        html += "</table>"; 
        html += "</div>";
    }
     
    labelCities.innerHTML = html;  
} 

function CityClick(cityIndex, clickedCity)
{ 
    // Example: clickedCity = "Paris, France"
    SetMessage(""); 
    
	// Check or UnCheck
	var interestClickedDiv = document.getElementById('option-' + cityIndex + '-');
	var interestName = interestClickedDiv.innerHTML; 
	
	if (interestClickedDiv.className == 'cbx-input disabled')
	    return;
	 
	if (interestClickedDiv.className == 'cbx-input clicked')  
		interestClickedDiv.className = 'cbx-input'; 
	else  
		interestClickedDiv.className = 'cbx-input clicked';	
		
    // Init
    var selectedCities = "";
    var selectedCities2 = "";
    var firstCity = "";

    // Loop through the cities in the dropdown to get the selected cities
    for ( var c = 1 ; c <= cityCount ; c++ ) 
    {   
        var city = document.getElementById("option-" + c + "-"); 
        if (city == null) continue;  
	    if (city.className != 'cbx-input clicked') continue;  
        selectedCities += city.innerHTML + "; ";  // "London, England; Paris, France; "
        selectedCities2 += city.innerHTML + "|";  // "London, England|Paris, France|"
        if (firstCity == "") firstCity = city.innerHTML;
    }   
    
    // Reset the Year and Month
    ResetYearMonth();
    
    // Set the cities in the city textbox
    var tbCity = document.getElementById("tbCity"); 
    if (selectedCities == "")
    {
        tbCity.value = "City/Destination"; 
    }
    else
    { 
        selectedCities = selectedCities.substring(0, selectedCities.length - 2);
        selectedCities2 = selectedCities2.substring(0, selectedCities2.length - 1);
        tbCity.value = selectedCities; 
    } 
    
    // Get the current region
    var tbRegion = document.getElementById("tbRegion"); 
    var region = tbRegion.value; 

    // Loop through the cities in the dropdown
    for ( var c = 1 ; c <= cityCount ; c++ )
    {  
        // Get the current city checkbox 
        var city = document.getElementById("option-" + c + "-");
        if (city == null) continue;  
	    if (city.className == 'cbx-input clicked') continue;  
	    
        // Allow this city?
        if (AllowCity(city.innerHTML, firstCity, selectedCities2) == "true")
        { 
            city.disabled = false;
            //city.parentElement.disabled = false;
            city.className = 'cbx-input';
        }
        else
        { 
            //city.disabled = "disabled"; 
            city.className = 'cbx-input disabled';
        }
    }
} 

function AllowCity(cityName, firstCity, selectedCities) 
{
    // Example: "Amsterdam, Netherlands", "London, England", "London, England|Paris, France"
    
    // Replace ", " with "&#44;&#32;" (the codes are used in the .js data file)
    cityName = cityName.replace(/, /g, '&#44;&#32;'); 
    firstCity = firstCity.replace(/, /g, '&#44;&#32;'); 
    selectedCities = selectedCities.replace(/, /g, '&#44;&#32;'); 
    
    // Init   
    if (firstCity == "") return "true";
    var tbRegion = document.getElementById("tbRegion"); 
    var region = tbRegion.value; 
    
    var selectedArray = selectedCities.split('|');  
        
    // Loop thru the region/city data
    for ( var d = 0 ; d < data.length ; d++ )
    {
        if (data[d].region == null) continue; 
        if (data[d].region != region) continue; 
        if (data[d].cities.indexOf("|") < 0) continue;  
            
        // cityName:        Amsterdam&#44;&#32;Netherlands
        // selectedCities:  London&#44;&#32;England|Paris&#44;&#32;France
        // data[d].cities:  London|Paris|Amsterdam&#44;&#32;London|Paris|Nice&#44;&#32;London|Paris|Rome
        // return:          "false"
        
        // Get an array of cities in this combo and in the selected cities
        var comboArray = data[d].cities.split('|');  
                
        // Make sure this combo goes to all of the selected cities
        var comboGoesToSelected = "true";
        for (var s = 0; s < selectedArray.length; s++)
        {
            var selectedIsInCombo = "false";
            for (var c = 0; c < comboArray.length; c++)
            {
                // Check if this selected city is in the combo array
                if (selectedArray[s] == comboArray[c]) selectedIsInCombo = "true";
            }
            if (selectedIsInCombo == "false") comboGoesToSelected = "false";
        }
        if (comboGoesToSelected == "false") continue;
        
        // To get here, the cities in the selected array go to the cities in this combo   
        
        // Check if the current city is in these cities 
        var allCities = "|" + data[d].cities + "|";
        if (allCities.indexOf("|" + cityName + "|") >= 0) return "true"; 
    }
    
    return "false";  
}  

// AIRPORTS /////////////////////////////////////////////////////////////////////////////////////////

function GetAirports(countryCode)
{
    // Init
    if (airportData == null) alert("No Airport Data");
    var items = "";  
    
    // Add a "remove airport" option 
    var jsMethod1 = "javascript:AirportClick(\" \"); return false;";
    items += "<div class='region_item' style='padding-left:5px;' onclick='" + jsMethod1 + "'>";
    items += "&nbsp;";
    items += "</div>"; 

    // Loop through the airports  
    var itemIndex = 1;
    for ( var i = 0 ; i < airportData.length ; i++ )
    {  
        // Validate the airport 
        if (airportData[i] == null) continue; 
        if (airportData[i] == "") continue;  
        if (airportData[i].countryCode != countryCode) continue;   
        
        var airportCity = airportData[i].airportCity;
        airportCity = airportCity.replace(/'/g, '`'); 

        var jsMethod = "javascript:AirportClick(\"" + airportCity + " (" + airportData[i].airportCode + ")" + "\"); return false;";
        items += "<div class='region_item' style='padding-left:5px;' onclick='" + jsMethod + "'>";
        items += airportCity + " (" + airportData[i].airportCode + ")";
        items += "</div>"; 
        itemIndex ++; 
    }  

    var html = "";
    html = "<table width='215px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='215px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html; 
} 
 
function AirportClick(clickedAirport)
{  
    SetMessage("");
    
    var tbAirport = document.getElementById("tbAirport"); 
    if (clickedAirport == "")
        tbAirport.value = "";
    else
        tbAirport.value = clickedAirport;
    
    if (clickedAirport != "") 
    { 
        ShowHideSections(3);
    }
} 

// YEAR AND MONTH ///////////////////////////////////////////////////////////////////////////////////////////

function ResetYearMonth()
{
    var tbYear = document.getElementById("tbYear"); 
    tbYear.value = "Year";
    var tbMonth = document.getElementById("tbMonth"); 
    tbMonth.value = "Month";
    var labelMonths = document.getElementById("labelMonths");
    labelMonths.innerHTML = "";
}

function GetYears()
{
    var items = "";
     
    items += "<div class='region_item' onclick='javascript:YearClick(\"2010\"); return false;'>2010</div>";
    items += "<div class='region_item' onclick='javascript:YearClick(\"2011\"); return false;'>2011</div>";
      
    var html = "";
    html = "<table width='60px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='55px' style='padding-left: 3px; padding-right: 3px; vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html;  
} 

function YearClick(clickedYear)
{ 
    SetMessage("");
    
    var tbYear = document.getElementById("tbYear"); 
    var tbMonth = document.getElementById("tbMonth"); 
    tbMonth.value = "Month";
    if (clickedYear == "")
    {
        tbYear.value = "Year";
    }
    else
    {
        tbYear.value = clickedYear; 
        ShowMonths();
    }
    
    ShowHideSections(4);
}

function ShowMonths()
{
    var tbYear = document.getElementById("tbYear"); 
    var year = tbYear.value;
    if ((year == "") || (year == "Year"))
    { 
        SetMessage("Please select a Year.");  
        return false; 
    }  
    
    var labelMonths = document.getElementById("labelMonths");
    labelMonths.innerHTML = GetMonths();
}

function AreAllCitiesIncluded(subCities, allCities)
{
    // Check if all of the sub cities are in the all cities list
    // London|Nice & London|Paris|Nice
    
    // Validate
    if (subCities == "") return "true";
    if (allCities == "") return "false";
    
    // Split the sub cities
    var subCityArray = subCities.split('|');

    // Loop thru the split sub cities (London, Nice) 
    for (var i = 0; i < subCityArray.length; i++)
    {
        // Check if this city exists in the all Cities list
        tempString = "|" + allCities + "|";
        if (tempString.indexOf("|" + subCityArray[i] + "|") < 0)
            return "false"; 
    }
    
    return "true";
}

function GetMonths()
{
    var tbRegion = document.getElementById("tbRegion"); 
    var region = tbRegion.value; 
    var tbCity = document.getElementById("tbCity");
    var cities = tbCity.value; 
    cities = cities.replace(/; /g, '|'); 
    cities = cities.replace(/, /g, '&#44;&#32;'); 
    var tbYear = document.getElementById("tbYear"); 
    var year = tbYear.value; 
    var items = ""; 
    
    // Loop thru the months
    for (var month = 1; month <= 12; month++)
    {
        // Check if ALL selected city(s) operate in this month
        // London|Paris|Nice
        
        // Init
        var monthName = "";
        if (month == "1") monthName = "January";
        if (month == "2") monthName = "February";
        if (month == "3") monthName = "March";
        if (month == "4") monthName = "April";
        if (month == "5") monthName = "May";
        if (month == "6") monthName = "June";
        if (month == "7") monthName = "July";
        if (month == "8") monthName = "August";
        if (month == "9") monthName = "September";
        if (month == "10") monthName = "October";
        if (month == "11") monthName = "November";
        if (month == "12") monthName = "December";
        var foundCities = "false";
        
        // Loop thru the data
        for ( var d = 0 ; d < data.length ; d++ )
        {
            if (data[d].region == null) continue; 
            if (data[d].region != region) continue; 
    
            // Check if all selected cities are included in this data element
            var retval = AreAllCitiesIncluded(cities, data[d].cities);
            if (retval == "true") 
            {
                // Check if the year/month of this data element is the same as the current month
                var curYrmo = "" + month + year;
                if (month < 10) curYrmo = "0" + curYrmo;  
                if (data[d].available_dates.indexOf(curYrmo) >= 0) foundCities = "true"; 
            }
        }
        
        if (foundCities == "true") 
            items += "<div class='region_item' onclick='javascript:MonthClick(\""+month+"\"); return false;'>"+monthName+"</div>"; 
        else 
            items += "<div class='region_item_disabled'>"+monthName+"</div>";  
    } 
      
    var html = "";
    html = "<table width='140px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='135px' style='padding-left: 3px; padding-right: 3px; vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html;  
} 
  
function MonthClick(month)
{ 
    SetMessage("");
    
    var tbMonth = document.getElementById("tbMonth"); 
    tbMonth.value = "Month";

    var monthName="";
    
    if (month == "1") monthName = "January";
    if (month == "2") monthName = "February";
    if (month == "3") monthName = "March";
    if (month == "4") monthName = "April";
    if (month == "5") monthName = "May";
    if (month == "6") monthName = "June";
    if (month == "7") monthName = "July";
    if (month == "8") monthName = "August";
    if (month == "9") monthName = "September";
    if (month == "10") monthName = "October";
    if (month == "11") monthName = "November";
    if (month == "12") monthName = "December";
    
    tbMonth.value = monthName;
    
    ShowHideSections(4);
    
    return; 
}

// PASSENGERS /////////////////////////////////////////////////////////////////////////////////////

function GetAdults()
{
    var items = "";
    
    for (var i=1; i<=7; i++)
    {
        items += "<div class='region_item' onclick='javascript:AdultClick(\""+i+"\"); return false;'>&nbsp;"+i+"</div>";
    }
      
    var html = "";
    html = "<table width='33px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='33px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html;  
}

function ShowAdults()
{  
    // Check if the children, ages or room items are currently displayed 
    if (document.getElementById("spanChildren").style.display == "inline") return;    
    for (var i = 1; i <= 5; i++)   
        if (document.getElementById("spanChildAge" + i).style.display == "inline") return;
    if (document.getElementById("spanRooms").style.display == "inline") return;    
    
    var spanAdults = document.getElementById("spanAdults");   
    if (spanAdults.style.display == "inline")
    {
        spanAdults.style.display = "none";
        spanAdults.style.visibility = "hidden";   
    }
    else
    {
        spanAdults.style.display = "inline";
        spanAdults.style.visibility = "visible";  
    } 
    
}

function AdultClick(adults)
{  
    SetMessage("");
    
    var tbAdults = document.getElementById("tbAdults");
    tbAdults.value = adults;  
    ShowAdults();
    
    // Reset the room value and items   
    var labelRooms = document.getElementById("labelRooms");
    labelRooms.innerHTML = GetRooms();  
}

function GetChildren()
{
    var items = "";
    
    for (var i=0; i<=5; i++)
    {
        items += "<div class='region_item' onclick='javascript:ChildrenClick(\""+i+"\"); return false;'>&nbsp;"+i+"</div>";
    }
      
    var html = "";
    html = "<table width='33px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='33px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html;  
}

function ShowChildren()
{  
    // Check if the adult, ages or room items are currently displayed 
    if (document.getElementById("spanAdults").style.display == "inline") return;    
    for (var i = 1; i <= 5; i++)   
        if (document.getElementById("spanChildAge" + i).style.display == "inline") return;
    if (document.getElementById("spanRooms").style.display == "inline") return;     

    var spanChildren = document.getElementById("spanChildren");   
    if (spanChildren.style.display == "inline")
    {
        spanChildren.style.display = "none";
        spanChildren.style.visibility = "hidden";  
    }
    else
    {
        spanChildren.style.display = "inline";
        spanChildren.style.visibility = "visible";  
    }  
}

function ChildrenClick(children)
{   
    SetMessage("");
    
    var tbChildren = document.getElementById("tbChildren");
    tbChildren.value = children;
    
    for (var i = 1; i <= 5 ; i++)
    {
        var divAge = document.getElementById("divAge" + i);
        divAge.style.display = "none";
        divAge.style.visibility = "hidden";  
    } 
    
    for (var i = 1; i <= children ; i++)
    {
        var divAge = document.getElementById("divAge" + i);
        divAge.style.display = "inline";
        divAge.style.visibility = "visible";  
    }  
       
    var trChildAges = document.getElementById("trChildAges");   
    if (children <= 0) 
    {
        trChildAges.style.display = "none";
        trChildAges.style.visibility = "hidden";  
    }
    else
    {
        trChildAges.style.display = "inline";
        trChildAges.style.visibility = "visible";  
    }   
     
    ShowChildren();
    
    GetRooms();
}

function ShowChildAge(child)
{
    // Check if the adults, children, (other) ages or room items are currently displayed 
    if (document.getElementById("spanAdults").style.display == "inline") return;    
    if (document.getElementById("spanChildren").style.display == "inline") return;    
    for (var i = 1; i <= 5; i++)   
    {
        if (i == child) continue;
        if (document.getElementById("spanChildAge" + i).style.display == "inline") return;
    }
    if (document.getElementById("spanRooms").style.display == "inline") return; 
    
    var spanChildAge = document.getElementById("spanChildAge" + child);   
    if (spanChildAge.style.display == "inline")
    {
        spanChildAge.style.display = "none";
        spanChildAge.style.visibility = "hidden";  
    }
    else
    {
        spanChildAge.style.display = "inline";
        spanChildAge.style.visibility = "visible";  
    }  
}

function GetChildAges(childIndex)
{ 
    var items = "";
    
    for (var i=2; i<=17; i++)
    {
        items += "<div class='region_item' onclick='javascript:ChildAgeClick(\""+childIndex+"\", \""+i+"\"); return false;'>&nbsp;"+i+"</div>";
    }
      
    var html = "";
    html = "<table width='26px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='26px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";

    return html;  
}

function ChildAgeClick(childIndex, childAge)
{ 
    SetMessage("");
    
    var tbChildAge = document.getElementById("tbChildAge" + childIndex);
    tbChildAge.value = childAge; 
         
    ShowChildAge(childIndex);
}

// ROOMS /////////////////////////////////////////////////////////////////////////////////////

function ShowRooms()
{   
    // Check if the adult, ages or room items are currently displayed 
    if (document.getElementById("spanAdults").style.display == "inline") return; 
    if (document.getElementById("spanChildren").style.display == "inline") return;    
    for (var i = 1; i <= 5; i++)   
        if (document.getElementById("spanChildAge" + i).style.display == "inline") return;
    
    // Get the room items based on the number of adults 
    var tbAdults = document.getElementById("tbAdults");
    var adults = tbAdults.value;
    
    if ((adults == "") || (adults == "0"))
    { 
        SetMessage("Please select at least one Adult.");  
        return false; 
    } 
    
    var labelRooms = document.getElementById("labelRooms");
    labelRooms.innerHTML = GetRooms();    
    
    var spanRooms = document.getElementById("spanRooms");   
    if (spanRooms.style.display == "inline")
    {
        spanRooms.style.display = "none";
        spanRooms.style.visibility = "hidden";  
    }
    else
    {
        spanRooms.style.display = "inline";
        spanRooms.style.visibility = "visible";  
    }  
}

function GetRooms()
{
    var items = "";
    
    // Get the number of adults and children
    var tbAdults = document.getElementById("tbAdults");
    var adults = tbAdults.value;
    var tbChildren = document.getElementById("tbChildren");
    var children = tbChildren.value;
    
    var minRoomCount = 1;
    var totalPax = parseInt(adults) + parseInt(children);
    if (adults > 4) minRoomCount = 2; 
    
    for (var i = minRoomCount; i <= adults; i++)
    {
        items += "<div class='region_item' onclick='javascript:RoomsClick(\""+i+"\"); return false;'>&nbsp;"+i+"</div>";
    }
      
    var html = "";
    html = "<table width='33px' border='0' cellpadding='0' cellspacing='0'>"; 
    html += "<tr>"; 
    html += "<td width='33px' style='vertical-align:top; white-space:nowrap;'>" + items + "</td>";  
    html += "</tr>";  
    html += "</table>";
    
    // Reset the number of rooms (if too large)
    var tbRooms = document.getElementById("tbRooms");
    rooms = tbRooms.value;
    if (rooms > adults)  
        tbRooms.value = "" + minRoomCount;
    if (rooms < minRoomCount)  
        tbRooms.value = "" + minRoomCount;

    return html; 
}

function RoomsClick(rooms)
{
    SetMessage("");
    
    var tbRooms = document.getElementById("tbRooms");
    tbRooms.value = rooms;
    
    ShowRooms();
}

// SUBMIT /////////////////////////////////////////////////////////////////////////////////////////
 
function SubmitSearch()
{  
    SetMessage("");
    
    // Get the selected region (handle spaces and ampersands)
    var tbRegion = document.getElementById("tbRegion"); 
    var region = tbRegion.value;
    region = region.replace(/ /g, '%20').replace(/&/g, '%26');
    if ((region == "") || (region == "Region"))
    {
        SetMessage("Please select a Region.");  
        return false; 
    } 
    
    // Cities: London|Paris|Nice
    var tbCity = document.getElementById("tbCity"); 
    var cities = tbCity.value;
    cities = cities.replace(/; /g, '|');
    // Validate
    if ((cities == "City/Destination") || (cities == ""))
    {
        SetMessage("Please select a City/Destination.");  
        return false; 
    }
    // Strip off the countries and states (convert "London, United Kingdom|Paris, France" to "London|Paris")
    var tempCities = "";
    var cityArray = cities.split('|');
    for (var i=0; i<cityArray.length; i++)
        tempCities += cityArray[i].substring(0, cityArray[i].indexOf(",")) + "|"; 
    cities = tempCities.substring(0, tempCities.length - 1);  
    
    // Check if this region and location(s) allow quads
    var quadsAllowed = "false";
    if (region == "Canada") quadsAllowed = "true";
    if (region == "United%20States") quadsAllowed = "true";
//    if (region == "North%20America") quadsAllowed = "true"; 

    // Departure airport: airport code (DEN)
    var tbAirport = document.getElementById("tbAirport"); 
    var airport = tbAirport.value;
    if (airport != "") 
    {
        // Get the airport code (CODE) NAME
        var pos1 = airport.indexOf("(") + 1;
        var pos2 = airport.indexOf(")");
        airport = airport.substring(pos1, pos2); 
    } 
    
    // Year and month (yyyy & m)
    var tbYear = document.getElementById("tbYear"); 
    var year = tbYear.value;
    if ((year == "Year") || (year == ""))
    {
        SetMessage("Please select a Year.");  
        return false; 
    }
    var tbMonth = document.getElementById("tbMonth"); 
    var month = tbMonth.value;
    if ((month == "Month") || (month == ""))
    {
        SetMessage("Please select a Month.");  
        return false; 
    }
    // Convert the month name to a number
    if (month == "January") month = 1;
    if (month == "February") month = 2;
    if (month == "March") month = 3;
    if (month == "April") month = 4;
    if (month == "May") month = 5;
    if (month == "June") month = 6;
    if (month == "July") month = 7;
    if (month == "August") month = 8;
    if (month == "September") month = 9;
    if (month == "October") month = 10;
    if (month == "November") month = 11;
    if (month == "December") month = 12;
            
    // Pax
    var tbAdults = document.getElementById("tbAdults"); 
    var adults = tbAdults.value;
    if ((adults == "0") || (adults == ""))
    {
        SetMessage("Need at least one Adult.");  
        return false; 
    }
    var tbChildren = document.getElementById("tbChildren"); 
    var children = tbChildren.value;
    
    // Check if we have a group 
    var paxCount = parseInt(adults) + parseInt(children);
    if (paxCount >= 8)
    {
        document.location = "/Groups/"; 
        return;
    }
    
    // Get the child ages (if any)
    var childAge1 = 0;
    var childAge2 = 0;
    var childAge3 = 0;
    var childAge4 = 0; 
    var childAge5 = 0; 
    if ((children != "0") && (children != ""))
    {
        // Get the child ages
        for (var i=1; i<=5; i++)
        {
            var tbChildAge = document.getElementById("tbChildAge" + i);  
            if (tbChildAge == null) break;
            
            if (i==1) { childAge1 = tbChildAge.value; if (childAge1 == "1st") childAge1 = 0; }
            if (i==2) { childAge2 = tbChildAge.value; if (childAge2 == "2nd") childAge2 = 0; }
            if (i==3) { childAge3 = tbChildAge.value; if (childAge3 == "3rd") childAge3 = 0; }
            if (i==4) { childAge4 = tbChildAge.value; if (childAge4 == "4th") childAge4 = 0; }
            if (i==5) { childAge5 = tbChildAge.value; if (childAge5 == "5th") childAge5 = 0; } 
        }
    } 
     
    // Validate 
    if (children >= 1)
    {
        if (childAge1 == 0)
        {
            SetMessage("Need an age for Child 1."); 
            return false; 
        }
        if (children >= 2)
        {
            if (childAge2 == 0)
            {
                SetMessage("Need an age for Child 2.");
                return false; 
            }
            if (children >= 3)
            {
                if (childAge3 == 0)
                {
                    SetMessage("Need an age for Child 3."); 
                    return false; 
                }
                if (children >= 4)
                {
                    if (childAge4 == 0)
                    {
                        SetMessage("Need an age for Child 4."); 
                        return false; 
                    }
                    if (children >= 5)
                    {
                        if (childAge5 == 0)
                        {
                            SetMessage("Need an age for Child 5."); 
                            return false; 
                        }  
                    }
                }
            }
        }
    }
    
    // Rooms
    var tbRooms = document.getElementById("tbRooms"); 
    var rooms = tbRooms.value;
    if ((rooms == "0") || (rooms == ""))
    {
        SetMessage("Please select at least one Room."); 
        return false; 
    } 
    
    // Check if we have too many pax in a room
    if (quadsAllowed == "true") 
    {
        // North America
        if ( ((rooms == 1) && (paxCount > 4)) || ((rooms == 2) && (paxCount > 8)) )
        {
            SetMessage("Only 4 people allowed per room.");  
            return false; 
        } 
    }
    else
    {
        // Not North America
        if ( ((rooms == 1) && (paxCount > 3)) || ((rooms == 2) && (paxCount > 6)) )
        {
            SetMessage("Only 3 people allowed per room.");  
            return false; 
        } 
    }
      
    // Parms
    var allParms = "";
    allParms += "jump=packages&";
    allParms += "region=" + region + "&";
    allParms += "locations=" + cities + "&";
    allParms += "departing_city=" + airport + "&";
    allParms += "month=" + month + "&";
    allParms += "year=" + year + "&";
    allParms += "adults=" + adults + "&";
    allParms += "kids=" + children + "&";
    allParms += "kid1=" + childAge1 + "&";
    allParms += "kid2=" + childAge2 + "&";
    allParms += "kid3=" + childAge3 + "&";
    allParms += "kid4=" + childAge4 + "&";
    allParms += "kid5=" + childAge5 + "&"; 
    allParms += "rooms=" + rooms; 
    
    // User type?
    var tbUserType = document.getElementById("tbUserType");
    if (tbUserType != null)
        allParms += "&agent=" + tbUserType.value; 
    
    // Canada?
    var docLoc = document.location + ""; 
    if (docLoc.toLowerCase().indexOf("monogramstravel.ca") >= 0) 
    {
        allParms += "&ca=true";
    }
    else
    {
        var tbIsCanadian = document.getElementById("tbIsCanadian");
        if (tbIsCanadian != null)
            allParms += "&ca=true"; 
    }
        
    // Display the hidden loading graphic
    displayLoadingGraphic();
    
    // Check if they left off the www.
    if (docLoc.indexOf("http://monogramstravel.com") >= 0)
    {
        document.location = "http://www.monogramstravel.com/booking.aspx?" + allParms;
        return;
    }
    
    // Redirect into the booking flow
    document.location = "/booking.aspx?" + allParms;
}

function displayLoadingGraphic()
{ 
    var theLoadingDiv = document.getElementById("div_loading_page");
    if (theLoadingDiv == null) return; 
    theLoadingDiv.style.display = "inline";
    setTimeout('document.images["pbar"].src = "/user/images/booking/loading2.gif"', 200);   
}  

function CreateDropDown(tableWidth, tbWidth, labelStyle, tbName, ddlbShowMethod, spanName, labelName, dataRows, defaultValue)
{
    var html = "";
    
    html += "<table width='"+tableWidth+"' cellpadding='0' cellspacing='0' style='padding-top: 4px;'>";
    html += "<tr>";
    html += "<td style='vertical-align: top; cursor: pointer;'>";
    html += "<input type='text' id='"+tbName+"' readonly='readonly' value='"+defaultValue+"' style='width:"+tbWidth+";' onclick='"+ddlbShowMethod+"' />";
    html += "</td>";
    html += "<td style='width:2px;'>";
    html += "</td>";
    html += "<td style='vertical-align: top; padding-top: 6px; cursor: pointer;'>";
    html += "<img src='/user/images/booking/DDImageDown.bmp' border='0' alt='' onclick='"+ddlbShowMethod+"' />";
    html += "</td>";
    html += "</tr>";
    html += "</table>";
    html += "<div id='"+spanName+"' style='display: none; visibility: hidden; font-weight: normal;'>";
    html += "<div id='"+labelName+"' style='"+labelStyle+"'>"; 
    html += dataRows; 
    html += "</div>";
    html += "</div>";
    
    return html;
} 







