﻿// JScript File

// Declare Variables
var map, cluster, m6Cluster;
var geocoder = null;
var markers = [];   
var m6Markers = [];  
var directionsPanel;
var directions;
var m6MarkersArray=[], markersArray=[];
var currentPoint = null;
var currentZoom = null;

// SETTINGS
var defaultM6Icon = "/images/Motel6.png";
var defaultM6IconWidth = 25;
var defaultM6IconHeight = 51;
var defaultM6ClusterIcon = "/images/Motel6_cluster.png";
var defaultM6ClusterIconWidth = 48;
var defaultM6ClusterIconHeight = 51;
var defaultAttIcon = "images/marker_star.png";
var defaultAttIconShadow = "images/marker_shadow.png";
var defaultAttIconWidth = 20;
var defaultAttIconHeight = 29;
var defaultAttIconShadowWidth = 38;
var defaultAttIconShadowHeight = 29;
var defaultM6PickIcon = "images/marker_star.png";
var defaultM6PickIconShadow = "images/marker_shadow.png";
var defaultM6PickIconWidth = 20;
var defaultM6PickIconHeight = 29;
var defaultM6PickIconShadowWidth = 38;
var defaultM6PickIconShadowHeight = 29;

function showAddress(address) 
{
    document.getElementById("m_RouteContainer").style.display="none";
    document.getElementById("m_M6PickContainer").style.display="none";
    if(directions)
    {
        directions.clear();
    }
    if (geocoder) 
    {
        geocoder.getLatLng(
            address,    
            function(point){
                if (!point) 
                {
                    showAddress("United States");
                }
                else
                {
                    var stateListStr = stateList.toString();
                    if(address=="United States")
                    {
                        currentPoint = point;
                        map.setCenter(point, 3);
                        document.getElementById("m_AttContainer").style.display="none";
                    }
                    else if(stateListStr.indexOf(address) > 0)
                    {
                        currentPoint = point;
                        map.setCenter(point, 6);
                        document.getElementById("m_AttContainer").style.display="none";
                    }
                    else
                    {
                        currentPoint = point;
                        map.setCenter(point, 10);
                        document.getElementById("m_AttContainer").style.display="block";
                        updateMap();
                    }
                }
            }
        );
    }
} 

function showDirections(fromAddy,toAddy)
{
    directionsPanel = document.getElementById("m_RouteDiv");
    if(directions)
    {
        directions.clear();
    }
    directions = new GDirections(map, directionsPanel);
    directions.load(fromAddy + " to " + toAddy);
    document.getElementById("m_RouteContainer").style.display="block";
    document.getElementById("m_AttContainer").style.display="none";
    document.getElementById("m_M6PickContainer").style.display="none";
    clearYelpMarkers();
    clearM6PicksMarkers();
}

function MapLoad() 
{
	if (GBrowserIsCompatible()) 
	{
		map=new GMap2(document.getElementById('m_MapDiv'));
		map.setCenter(new GLatLng(37.09024, -95.712891), 3, G_NORMAL_MAP);
		map.addControl(new GLargeMapControl(), new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7)));
		//map.addControl(new GMapTypeControl(), new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7)));
        geocoder = new GClientGeocoder();  
		      
        var qryStringLoc = getQueryString('loc');
        if(qryStringLoc!='')
        {
            document.getElementById("m_AttSearch").value = qryStringLoc;
            setTimeout("showAddress('" + qryStringLoc + "')",300);
        }
        else
        {
            setTimeout("showAddress('United States')",300);
        }
		
		var m6icon = new GIcon();
		m6icon.iconSize = new GSize(defaultM6IconWidth, defaultM6IconHeight);
		m6icon.iconAnchor = new GPoint(14, 48);
		m6icon.infoWindowAnchor = new GPoint(17, 5);
		
		var m6marker, marker, newIcon;
		
	    GDownloadUrl("Motel6Markers.xml", function(data) {
            var xml = GXml.parse(data);
            var m6markerlist = "";
            m6Markers = xml.documentElement.getElementsByTagName("marker"); 
            for (var i = 0; i < m6Markers.length; i++) 
            {
                var latlng = new GLatLng(parseFloat(m6Markers[i].getAttribute("lat")), parseFloat(m6Markers[i].getAttribute("lng")));
                var markerName = m6Markers[i].getAttribute("name");
                newIcon = new GIcon(m6icon, defaultM6Icon);
                m6marker = newM6Marker(latlng, i, newIcon);
                m6MarkersArray.push(m6marker);
            }
        });
		
		m6Cluster = new M6ClusterMarker(map, { m6Markers:m6MarkersArray } );
		m6Cluster.refresh();
		
		map.savePosition();
        
        document.getElementById("m_AttSearch").focus();
		
		var html2 = "<p><a href=\"http://www.yelp.com/\"><img src=\"http://static.px.yelp.com/i/new/developers/reviewsFromYelpWHT.gif\" alt=\"Reviews from Yelp\" style=\"border:0px;vertical-align:bottom;\" /></a></p>";
		var control2=new HtmlControl(html2);		
		map.addControl(control2, new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(5,5)));
	}
}

function newMarker(markerLocation, markerId, markerIcon) 
{	
	var marker = new GMarker(markerLocation, {title:markers[markerId].getAttribute("name"), icon:markerIcon});
	GEvent.addListener(marker, 'click', function() {
	    var markerInfo = '';
        markerInfo = '<div style="width:250px;">'; //allow word wrap
        markerInfo += '<strong>' + markers[markerId].getAttribute("name") + '</strong><br/>'
        + markers[markerId].getAttribute("address") + "<br />" 
        + markers[markerId].getAttribute("city") + ", " 
        + markers[markerId].getAttribute("state") + " " 
        + markers[markerId].getAttribute("zip") + " " 
        + markers[markerId].getAttribute("country");
        markerInfo += '</div>';
		marker.openInfoWindowHtml(markerInfo);
	});
	return marker;
}

function newM6Marker(markerLocation, markerId, markerIcon) 
{
	var m6marker = new GMarker(markerLocation, {title:m6Markers[markerId].getAttribute("name"), icon:markerIcon});
	GEvent.addListener(m6marker, 'click', function() {
	    var DateFrom = "Check-In";
	    var DateTo = "Check-Out";
	    var m6Info = '';
        m6Info = '<div style="width:250px;">'; //allow word wrap
        
        m6Info += "<table><tr><td style='width:27px;'><img src='" + defaultM6Icon + "'></td><td>";
        m6Info += '<a href="http://www.motel6.com/reservations/motel_detail.aspx?num=' + m6Markers[markerId].getAttribute("propertyid") + '" class="popAnchor"><strong>' + m6Markers[markerId].getAttribute("name") + '</strong></a><br/>'
        + m6Markers[markerId].getAttribute("address") + "<br />" 
        + m6Markers[markerId].getAttribute("city") + ", " 
        + m6Markers[markerId].getAttribute("state") + " " 
        + m6Markers[markerId].getAttribute("zip") + " " 
        + m6Markers[markerId].getAttribute("country") + "<br />" 
        + m6Markers[markerId].getAttribute("phone");
        
        m6Info += "</td></tr></table>";
        m6Info += '</div>';
        m6Info += '<br>';
        m6Info += '<table>';
        m6Info += '   <tr>';
        if (m6Markers[markerId].getAttribute("AmenityAirport") != "false")
        {
            m6Info += '       <td>';
            m6Info += '           <img src="images/icons/amenities_airport.gif" alt="Airport Nearby" title="Airport Nearby">';
            m6Info += '       </td>';
        }
        if (m6Markers[markerId].getAttribute("AmenityPool") != "false")
        {
            m6Info += '       <td>';
            m6Info += '           <img src="images/icons/amenities_pool.gif" alt="Pool" title="Pool">';
            m6Info += '       </td>';
        }
        if (m6Markers[markerId].getAttribute("AmenityFood") != "false")
        {
            m6Info += '       <td>';
            m6Info += '           <img src="images/icons/amenities_food.gif" alt="Restaurant w/in 1 Mile" title="Restaurant w/in 1 Mile">';
            m6Info += '       </td>';
        }
        if (m6Markers[markerId].getAttribute("AmenityWifi") != "false")
        {
            m6Info += '       <td>';
            m6Info += '           <img src="images/icons/amenities_wifi.gif" alt="Highspeed Wireless Internet" title="Highspeed Wireless Internet">';
            m6Info += '       </td>';
        }
        m6Info += '   </tr>';
        m6Info += '</table>';              
        var d = new Date();
        var m1 = d.getMonth()+1;
        var d1 = d.getDate();
        var d2 = d.getDate()+1;
        var y1 = d.getFullYear();
        var myFStartDate = y1 + '-' + m1 + '-' + d1;
        var myFEndDate = myFStartDate;
        m6Info += '<br>';
        m6Info += '<input type="text" id="m_StartDate" name="m_StartDate" class="m_datetime" style="width:75px" value="'+DateFrom+'" readonly /> <a href="#" onClick="new CalendarPopup(\'calDiv\').select(document.forms[\'m_FrmMain\'].m_StartDate,\'m_Anchor1\',\'M/d/yyyy\',document.forms[\'m_FrmMain\'].m_fStartDate); return false;" TITLE="Click to select date." NAME="m_Anchor1" ID="m_Anchor1"><IMG align="absmiddle" border=0 src="/images/calendar/calendar_small5.gif"></a>&nbsp;&nbsp;&nbsp;&nbsp;';
        m6Info += '<input type="text" id="m_EndDate" name="m_EndDate" class="m_datetime" style="width:75px" value="'+DateTo+'" readonly /> <a href="#" onClick="new CalendarPopup(\'calDiv\').select(document.forms[\'m_FrmMain\'].m_EndDate,\'m_Anchor2\',\'M/d/yyyy\',document.forms[\'m_FrmMain\'].m_fEndDate); return false;" TITLE="Click to select date." NAME="m_Anchor2" ID="m_Anchor2"><IMG align="absmiddle" border=0 src="/images/calendar/calendar_small5.gif"></a>';
        m6Info += "<br />";
        m6Info += '<input type="hidden" name="PropID" value="' + m6Markers[markerId].getAttribute("propertyid") + '">';
        m6Info += '<input type="hidden" name="m_fStartDate" value="' + myFStartDate + '">';
        m6Info += '<input type="hidden" name="m_fEndDate" value="' + myFEndDate + '">';
        m6Info += '<a id="mkRes" href="http://www.motel6.com/ms/check-availability.do?property=' + m6Markers[markerId].getAttribute("propertyid") + '&arrivalDate=' + myFStartDate + '&departureDate=' + myFEndDate + '" class="popAnchor">Check Rates and Availability</a>';          
        m6Info += "<br /><br />";
        m6Info += '<div id="divAttractionInfoWindow">';
        m6Info +=   'Get Directions:&nbsp;&nbsp;';
        m6Info +=   '<input type="hidden" id="hidPOIAddress" value="Motel6 - ' + m6Markers[markerId].getAttribute("name") + ', ' + m6Markers[markerId].getAttribute("address") + ', ' + m6Markers[markerId].getAttribute("city") + ', ' + m6Markers[markerId].getAttribute("state") + ' ' + m6Markers[markerId].getAttribute("zip") + ((m6Markers[markerId].getAttribute("lat")!="" && m6Markers[markerId].getAttribute("lon") != "")?' @ ' + m6Markers[markerId].getAttribute("lat") + ',' + m6Markers[markerId].getAttribute("lng"):"") + '">';
        m6Info +=   '<a href="javascript:showDirectionsFrom()" class="popAnchor">To Here</a> | ';   
        m6Info +=   '<a href="javascript:showDirectionsTo()" class="popAnchor">From Here</a>';
        var markerAddy =  m6Markers[markerId].getAttribute("address") + ', ' + m6Markers[markerId].getAttribute("city") + ', ' + m6Markers[markerId].getAttribute("state") + ' ' + m6Markers[markerId].getAttribute("zip") + ' @ ' + m6Markers[markerId].getAttribute("lat") + ',' + m6Markers[markerId].getAttribute("lng");
        m6Info +=   '<div id="m_divBubbleForm" class="m_divBubbleForm">';
        m6Info +=       '<div id="m_divBubbleFormStart" style="display:none;vertical-align:middle;">From:&nbsp;&nbsp;<input name="m_DirBubbleStart" id="m_DirBubbleStart" type="text" class="m_bubbleSearchCell" value="" onkeydown="if(event.keyCode==13)directionsBubbleClick(\'from\',\'' + markerAddy + '\');"> <input type="button" id="m_BtnBubbleDirections" value="GO" class="m_bubbleButton" onclick="directionsBubbleClick(\'from\',\'' + markerAddy + '\');" /></div>';
        m6Info +=       '<div id="m_divBubbleFormEnd" style="display:none;vertical-align:middle;">To:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input name="m_DirBubbleEnd" id="m_DirBubbleEnd" type="text" class="m_bubbleSearchCell" value="" onkeydown="if(event.keyCode==13)directionsBubbleClick(\'to\',\'' + markerAddy + '\');"> <input type="button" id="m_BtnBubbleDirections" value="GO" class="m_bubbleButton" onclick="directionsBubbleClick(\'to\',\'' + markerAddy + '\');" /></div>';
        m6Info +=   '</div>';
        m6Info += '</div><br />';
		m6marker.openInfoWindowHtml(m6Info);
	});
	return m6marker;
}

function toggleMotel6Markers(_boolean) 
{
    if(_boolean==false)
    {
        m6Cluster.removeMarkers();
    }
    else
    {
        m6Cluster.addMarkers(m6MarkersArray);
        map.setCenter(currentPoint, currentZoom);   
    }
	m6Cluster.refresh();
}

function showDirectionsTo()
{   
    document.getElementById("m_divBubbleFormStart").style.display = "none";
    document.getElementById("m_divBubbleFormEnd").style.display = "block";
    document.getElementById("m_DirBubbleEnd").focus();
}

function showDirectionsFrom()
{   
    document.getElementById("m_divBubbleFormStart").style.display = "block";
    document.getElementById("m_divBubbleFormEnd").style.display = "none";
    document.getElementById("m_DirBubbleStart").focus();
}

function directionsBubbleClick(val, markerAddy)
{
    if(val=='from')
    {
        document.getElementById("m_DirFromSearch").value=document.getElementById("m_DirBubbleStart").value;
        document.getElementById("m_DirToSearch").value=markerAddy;
    }
    else
    {
        document.getElementById("m_DirFromSearch").value=markerAddy;
        document.getElementById("m_DirToSearch").value=document.getElementById("m_DirBubbleEnd").value;
    }
    selectMashupTopTab("m_Tab2");
    showDirections(document.getElementById("m_DirFromSearch").value,document.getElementById("m_DirToSearch").value);
}
    
function m6ListClick(i)
{
    try
    {
        var zoomLvl = 8;
        map.setCenter(new GLatLng(m6Markers[i].getAttribute("lat"), m6Markers[i].getAttribute("lng")), zoomLvl);
        setTimeout("GEvent.trigger(m6Markers["+i+"],'click');",100);        
    }
    catch(err)
    {
        alert("The motel you have selected cannot be mapped.  Please select another motel.");
    }
}

function selectMashupTopTab(val)
{
    if(val=="m_Tab1")
    {
        document.getElementById("m_Tab1").style.background = "url(/images/BlueTab_AttractionFinder_On.gif)";
        document.getElementById("m_Tab1Div").style.display = "block";
        
        document.getElementById("m_Tab2").style.background = "url(/images/BlueTab_GetDirections_Off.gif)";
        document.getElementById("m_Tab2Div").style.display = "none";
        
        document.getElementById("m_Tab3").style.background = "url(/images/BlueTab_Motel6Picks_Off.gif)";;
        document.getElementById("m_Tab3Div").style.display = "none";
        
        document.getElementById("m_AttSearch").focus();
    }
    else if(val=="m_Tab2")
    {
        document.getElementById("m_Tab1").style.background = "url(/images/BlueTab_AttractionFinder_Off.gif)";
        document.getElementById("m_Tab1Div").style.display = "none";
        
        document.getElementById("m_Tab2").style.background = "url(/images/BlueTab_GetDirections_On.gif)";
        document.getElementById("m_Tab2Div").style.display = "block";
        
        document.getElementById("m_Tab3").style.background = "url(/images/BlueTab_Motel6Picks_Off.gif)";
        document.getElementById("m_Tab3Div").style.display = "none";
        
        document.getElementById("m_DirFromSearch").focus();
    }
    else if(val=="m_Tab3")
    {
        document.getElementById("m_Tab1").style.background = "url(/images/BlueTab_AttractionFinder_Off.gif)";
        document.getElementById("m_Tab1Div").style.display = "none";
        
        document.getElementById("m_Tab2").style.background = "url(/images/BlueTab_GetDirections_Off.gif)";
        document.getElementById("m_Tab2Div").style.display = "none";
        
        document.getElementById("m_Tab3").style.background = "url(/images/BlueTab_Motel6Picks_On.gif)";
        document.getElementById("m_Tab3Div").style.display = "block";
    }
}

function getQueryString(name)
{
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( window.location.href );
    if( results == null )
        return "";
    else
        return results[1];
}