﻿var JB_FindARetailerDirectionsObj = null;

// Trace Javascript execution.
// View contents using FireBug DOM menu item.
var JB_Trace = new Array();

// Define object for storing the Google map Marker object and store information.
function JB_FindARetailerDirections()
{
    this.City = "";
    this.MarkerObj = null;
    this.MouseOut = false;
    this.Phone = "";
    this.State = "";
    this.StoreName = "";
    this.StreetAddress = "";
    this.ZipCode = "";
}

// Google Map Mouse Over Event Listener
function JB_FindARetailerDirectionsMarkerMouseOver(MarkerObjIn, StoreNameIn, StreetAddressIn, CityIn, StateIn, ZipCodeIn, PhoneIn)
{
    return function () {
        var DirectionsObj;

        JB_Trace.push("MouseOver Begin");

        // Create new object to store Google map marker and store information.
        DirectionsObj = new JB_FindARetailerDirections();

        // Save object reference in global variable so other functions can reference.
        JB_FindARetailerDirectionsObj = DirectionsObj;

        JB_Trace.push("JB_FindARetailerDirectionsObj = ", JB_FindARetailerDirectionsObj);

        // Save the Google Map Pin Marker object and the store info in the object.

        DirectionsObj.MarkerObj = MarkerObjIn;

        DirectionsObj.City = CityIn;
        DirectionsObj.Phone = PhoneIn;
        DirectionsObj.State = StateIn;
        DirectionsObj.StoreName = StoreNameIn;
        DirectionsObj.StreetAddress = StreetAddressIn;
        DirectionsObj.ZipCode = ZipCodeIn;
        JB_Trace.push("JB_FindARetailerDirectionsObj = ", JB_FindARetailerDirectionsObj);

        // Problem: The mouse over event was occurring as soon as the user mouses over the map pin.
        // We want the user to stay on the map pin for a short period of time then pop up the dialog.
        // Solution: Delay calling the function to display the dialog.
        JB_Trace.push("MouseOver -setTimeout");

        // If the user mouses out of the map pin before time is up we'll cancel the dialog box.
        setTimeout("JB_FindARetailerDirectionsMarkerMouseOver2()", 500);

        JB_Trace.push("JB_FindARetailerDirectionsObj = ", JB_FindARetailerDirectionsObj);

        JB_Trace.push("MouseOver - End2");
    }
}

function JB_FindARetailerDirectionsMarkerMouseOut()
{
    return function ()
    {
        JB_Trace.push("MouseOut - Begin");

        // Problem: When we call AddListener for 'mouseout' this event handler is called.
        // Solution: We know AddListener was called because the JB_FindARetailerDirectionsObj will be null.
        // Therefore, just dismiss the event handler w/o doing anything.
        if (JB_FindARetailerDirectionsObj == null)
        {
            JB_Trace.push("MouseOut - End1");
            return;
        }
        
        JB_Trace.push("MouseOut - Here1");

        // Because JB_FindARetailerDirectionsObj is not null we know the user
        // moused over the map pin some time in the past.   
        // Now, the user just moused out of the map pin.
        // Record this fact in the current object.

        DirectionsObj = JB_FindARetailerDirectionsObj;
        JB_Trace.push("MouseOut - Here2");

        DirectionsObj.MouseOut = true;

        JB_Trace.push("MouseOut- End2");
    }
}

// Description:
// This function is executed when the timer expires that was set in JB_FindARetailerDirectionsMarkerMouseOver.
// 
// 1. Put the store name and address in the Directions dialog box.
// 2. Compute the X & Y position of the dialog box.
// 3. Open the dialog box.
// 
// If the user wants directions to this store they will:
// 1. Enter a starting address into the text box at the bottom of the dialog box.
// 2. Click on GO button in the dialog box.
//
function JB_FindARetailerDirectionsMarkerMouseOver2(Param1)
{
    var Debug = false;
    var Debug2 = true;
    var DirectionsObj = null;
    
    JB_Trace.push("JB_FindARetailerDirectionsObj = ", JB_FindARetailerDirectionsObj);

    JB_Trace.push("MouseOver2 - Begin");

    DirectionsObj = JB_FindARetailerDirectionsObj;

    // Defensive coding - just in case object is not available.
    if (DirectionsObj == null)
    {
        JB_Trace.push("MouseOver - End1");
        return;
    }

    // If the user moused out of the map pin then don't display the dialog.
    if (DirectionsObj.MouseOut == true)
    {
        JB_Trace.push("MouseOver - End2");
        return;
    }

    // Put the store info in the dialog box
    var Obj = document.getElementById("JB_FindARetailerDirections_StoreName");
    Obj.innerHTML = DirectionsObj.StoreName;

    var Obj = document.getElementById("JB_FindARetailerDirections_StreetAddress");
    Obj.innerHTML = DirectionsObj.StreetAddress;

    var Obj = document.getElementById("JB_FindARetailerDirections_CityStateZipCode");
    Obj.innerHTML = DirectionsObj.City + ", " + DirectionsObj.State + " " + DirectionsObj.ZipCode;

    var Obj = document.getElementById("JB_FindARetailerDirections_Phone");
    Obj.innerHTML = DirectionsObj.Phone;

    // Save the individual address components (hidden) in the dialog
    // to be used for composing the destination address to be sent to Google maps.
    var Obj = document.getElementById("JB_FindARetailerDirections_City");
    Obj.innerHTML = DirectionsObj.City;

    var Obj = document.getElementById("JB_FindARetailerDirections_State");
    Obj.innerHTML = DirectionsObj.State;

    var Obj = document.getElementById("JB_FindARetailerDirections_ZipCode");
    Obj.innerHTML = DirectionsObj.ZipCode;

    // Default X&Y position when we skip the DialogX and DialogY computations.
    DialogX = 100;
    DialogY = 100;

    if (Debug2)
    {
        // X & Y position code snippet from:
        // http://snippets.aktagon.com/snippets/377-How-to-find-a-Google-Map-marker-s-exact-position
        var p = m_GoogleMapOverlay.getProjection().fromLatLngToDivPixel(DirectionsObj.MarkerObj.getPosition());

        // map world relative to map container
        var container = m_GoogleMapOverlay.getPanes().mapPane.parentNode;
        var MarkerX = p.x + parseInt(container.style.left);
        var MarkerY = p.y + parseInt(container.style.top);

        // Get the X & Y position of the Google Map DIV
        Obj = document.getElementById("GoogleMap_Canvas");
        MapX = JB_X(Obj);
        MapY = JB_Y(Obj);

        // Compute X position of dialog
        // Problem: Dialog will overlay map pin.
        // Solution: shift dialog to the right a few pixels.
        DialogX = MapX + MarkerX + 20;

        // Problem: Dialog top edge will be at map pin position
        // Solution: Move dialog up 1/2 the dialog height.
        Obj = document.getElementById("JB_FindARetailerDirectionsDialog");
        DialogOffset = Obj.offsetHeight / 2;

        // Compute dialog Y position plus offset so mid-point of dialog is at map pin.
        DialogY = MapY + MarkerY - DialogOffset;

        JB_Trace.push("MarkerX = " + MarkerX + "; MarkerY = " + MarkerY);
        JB_Trace.push("MapX = " + MapX + "; MapY = " + MapY);
        JB_Trace.push("DialogX = " + DialogX + "; DialogY = " + DialogY);
    }

    // Display the dialog
    $(document).ready(function ()
    {
        $('#JB_FindARetailerDirectionsDialog').dialog({ autoOpen: true, closeText: 'X', modal: false, position: [DialogX,DialogY], resizable: false, width: 186 });
    });

    JB_Trace.push("MouseOver2 - End3");       
}

// Description:
// User clicked on GO button in Directions dialog.
// Get the starting address and ending point addresses
// and open a second window with a Google Map with
// directions between those two points.
function JB_FindARetailerDirectionsGo() {
    var CityStateZipCode;
    var DestinationAddress;
    var SourceAddress;
    var StoreName;
    var StreetAddress;
    var Url;
    var WindowName;

    // Get the starting point for the directions - entered by the user.
    Obj = document.getElementById("JB_FindARetailerDirections_SourceAddress");
    SourceAddress = Obj.value;

    // If user did not type in any address then disregard click on GO button.
    if (SourceAddress == '') return;   

    // Google doesn't like single quotes in the address - remove any.
    SourceAddress = SourceAddress.replace("'", "");

    // Google doesn't like some special chars in the address - remove any.    
    SourceAddress = JB_AddressFix(SourceAddress);

    // Compose the ending point address
    Obj = document.getElementById("JB_FindARetailerDirections_StoreName");
    StoreName = Obj.innerHTML;

    Obj = document.getElementById("JB_FindARetailerDirections_StreetAddress");
    StreetAddress = Obj.innerHTML;

    Obj = document.getElementById("JB_FindARetailerDirections_City");
    City = Obj.innerHTML;

    Obj = document.getElementById("JB_FindARetailerDirections_State");
    State = Obj.innerHTML;

    Obj = document.getElementById("JB_FindARetailerDirections_ZipCode");
    ZipCode = Obj.innerHTML;    

    DestinationAddress = StoreName + '+' + StreetAddress + '+' + City + "+" + State + "+" + ZipCode;

    DestinationAddress = JB_AddressFix(DestinationAddress);

    // Compose URL for Google Maps so Google picks up the addresses in the query string,
    // computes the directions and displays a map.
    // Assuming user keyed in a good address Google should compute good directions.
    Url = "http://maps.google.com/?" + 'saddr=' + SourceAddress + "&daddr=" + DestinationAddress;    

    // Open Google Map in separate window.
    window.open(Url, "_blank");    
}

function JB_AddressFix(Address)
{
    Address = Address.replace("&amp;", "");
    Address = Address.replace("&amp;", "");
    Address = Address.replace("&#034;", "");

    Address = Address.replace("'", "");
    Address = Address.replace("&", "");
    Address = Address.replace("#", "");
    return Address;
}
