﻿/**********************************************************************************/
/******************************* GOOGLE MAPS CODE *********************************/
/**********************************************************************************/
/******************** DEPENDENCY ON CONFIG FILE: config_?.js **********************/
/**********************************************************************************/

google.load("maps", "2");

var businesses = new Array();
var mapSettings = {};

var map = null;
var baseIcon = null;
var myIcon = null;
var myOffsetIcon = null;
var bBrowserCompatible = false;

function DrawMap() {
    
    if (!GBrowserIsCompatible())
        return;

    // map type options
    var mapTypes = [G_NORMAL_MAP];  //G_DEFAULT_MAP_TYPES;

    //base icon
    baseIcon = new GIcon(G_DEFAULT_ICON);
    baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
    baseIcon.iconSize = new GSize(20, 34);
    baseIcon.shadowSize = new GSize(37, 34);
    baseIcon.iconAnchor = new GPoint(9, 34);
    baseIcon.infoWindowAnchor = new GPoint(9, 2);

    //marker icon
    myIcon = new GIcon(baseIcon);
    myIcon.iconSize = new GSize(32, 46);
    myIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
    myIcon.shadowSize = new GSize(58, 42);
    myIcon.iconAnchor = new GPoint(18, 46);
    myIcon.infoWindowAnchor = new GPoint(18, 5);
    myIcon.imageMap = [0, 0, 30, 0, 30, 32, 0, 32];
    myIcon.image = config_Marker;

    //offset marker icon - used on exact overlapping markers
    myOffsetIcon = new GIcon(baseIcon);
    myOffsetIcon.iconSize = new GSize(46, 32);
    myOffsetIcon.shadow = null;
    myOffsetIcon.iconAnchor = new GPoint(46, 18);
    myOffsetIcon.infoWindowAnchor = new GPoint(32, 8);
    myOffsetIcon.imageMap = [0, 0, 30, 0, 30, 32, 0, 32];
    myOffsetIcon.image = config_MarkerRight;

    //map size
    var objMap = document.getElementById("mapall");
    var parentWidth = objMap.parentNode.offsetWidth;
    if (!parentWidth) parentWidth = 520;
    // margins should be 20, so deduct.
    var mapSize = new GSize(parentWidth - 20, 400); 

    //draw map
    map = new google.maps.Map2(objMap, { mapTypes: mapTypes, logoPassive: true, size: mapSize });
    //map.enableScrollWheelZoom();
    map.addControl(new GLargeMapControl());
    
    //map bounds
    var mapBounds = new GLatLngBounds();

    // set start location
    map.setCenter(new GLatLng(mapSettings.lat, mapSettings.lng), mapSettings.zoom);
    map.clearOverlays();
    //add points
    for (var i = 0; i < businesses.length; i++) {
        var marker = createMarker(i);
        map.addOverlay(marker);
        businesses[i].marker = marker;
        mapBounds.extend(marker.getLatLng());
    }

    // extend to bounds
    if (businesses.length > 0) {
        var boundsZoom = map.getBoundsZoomLevel(mapBounds);
        var boundsZoom = (boundsZoom > 15 && businesses.length < 5) ? 15 : boundsZoom; // set max initial zoom if few stores and too close zoom
        map.setZoom(boundsZoom);
        map.setCenter(mapBounds.getCenter());
    }

    //set scale max/min resolution - min zoom depends on points spread
    //var currentZoom = map.getZoom();
    //var minZoom = (currentZoom <= (12 + 1)) ? currentZoom - 2 : 12;
    for (var j = 0; j < mapTypes.length; j++) {
        mapTypes[j].getMaximumResolution = function(latlng) { return 17; };
        mapTypes[j].getMinimumResolution = function(latlng) { return 8; }; // 8 = approx 75 mile radius
    }
    //var container = document.getElementById("storelocatormap");
    //container.style.display = "block";

    return true;
}

var arrExistingMarkers;
function createMarker(ind) {
    var business = businesses[ind];
    var LatLng = new GLatLng(business.lat, business.lng);
    
    var markerOptions = { icon: myIcon };

    if (existsMarker(LatLng)) {
        markerOptions = { icon: myOffsetIcon };
    }
    
    var marker = new GMarker(LatLng, markerOptions);
    marker.bindInfoWindowHtml(getBusinessInfoWindowContent(business).join(''));

    return marker;
}

//function to search existing markers, if we have duplicate point then draw alternate offset marker
function existsMarker(objLatLng) {
    for (var i = 0; i < businesses.length; i++) {
        var marker = businesses[i].marker;
        if (marker) {
            if (marker.getLatLng().lat() == objLatLng.lat() && marker.getLatLng().lng() == objLatLng.lng()) {
                return true;
            }
        }
    }
}

function findMarker(ind) {
    var business = businesses[ind];
    var marker = business.marker;
    if (marker) {
        map.setCenter(marker.getLatLng(), 15);
        marker.openInfoWindowHtml(getBusinessInfoWindowContent(business).join(''));
    }
    //document.location = '#';
    var container = map.getContainer();
    if (container) {
        var objMap = document.getElementById("mapall");
        if (!IsInViewPort(objMap)) {
            container.scrollIntoView(true);
        }
    };
}

function getBusinessInfoWindowContent(business) {
    return ['<b>', business.name, '</b><br>',
                 business.street, '<br> ', business.city, ',',
                 business.state, ' ', business.zip, '<br>',
                 business.phone, '<br><br>',
                 '<a target="_blank" ',
                 'href="http://maps.google.com/maps?saddr=&daddr=',
                 formatAddressForMaps(business), '">Get Directions</a>'
    //'<a target="_blank" ',
    //'href="http://maps.google.com/maps?saddr=',
    //formatAddressForMaps(business), '&daddr=', '"> from here '
               ];
}

function formatAddressForMaps(business) {
    var address = business.street + ' ' + business.city + ' ' + business.state + ' ' + business.zip;
    return escape(address.replace(' ', '+'));
}

/**********************************************************************************/
/*********************************** AJAX CODE ************************************/
/**********************************************************************************/

function getResults() {

    // hide output pane
    $("#storelocatormap").hide();

    // clear list of results and hide
    $("#divresults").empty();

    //clear message and hide
    $("#divMessage").empty();
    $("#divMessage").hide();

    //clear map - remove attributes added by google maps
    $("#mapall").empty();
    $("#mapall").removeAttr("style");

    //show progress bar and fade output pane in
    $("#mapall").addClass("working");
    $("#mapall").show();
    $("#storelocatormap").fadeIn(1000);

    //construct request
    var request = {};
    var inner = {};
    inner.__type = "StoreLocator.Server.LocatorRequest";
    inner.zip = $("#Zip").val();
    if ($("#productfilter").length) { //exists
        inner.flavorid = $("#productfilter").val();
    };
    //also check company
    if ($("#companyid").length) { //exists
        inner.companyid = $("#companyid").val();
    }
    request.request = inner;

    /// <reference path="clientscript/jquery-1.2.3.min.js" />
    /// <reference path="clientscript/jquery.json-1.3.min.js" />
    $.ajax({
        type: "POST",
        url: "Server/Geoservice.asmx/findBusinessesByZipJSON",
        data: $.toJSON(request),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data) {
            //DrawError(data);
            response = data.d;
            if (response.result == 0) {
                mapSettings = response.MapSettings;
                businesses = response.Businesses;
                //if (businesses.length > 0) {
                DrawMessage(response.message);

                if (DrawMap()) {
                    DrawResults();
                }
                //}
            }
            else {
                DrawError(response.message);
            }
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {

            DrawError("Sorry the service is busy, please try again later."); //XMLHttpRequest.responseText
        }
    });

}

function DrawError(msg) {
    DrawMessage(msg);
    $("#divMessage").addClass("error");
}

function DrawMessage(msg) {
    if (msg == "" || msg == null) return;

    $("#divMessage").removeClass("error");
    $("#mapall").removeClass("working");

    var p = document.createElement("p");
    txt = document.createTextNode(msg);
    p.appendChild(txt);

    //$("#mapall").fadeOut("fast");
    $("#divMessage").empty();
    $("#divMessage").append(p);
    $("#divMessage").fadeIn(1000);

}

function DrawResults() {

    var ul = document.createElement("ul");
    ul.id = "storelocatorresults";
    ul.style.display = "none";
    $("#divresults").append(ul);

    var containerWidth = ul.parentNode.offsetWidth;
    if (!containerWidth) parentWidth = 550;

    // maximages to be shown is (container_Width - space_for_address) / image_width_inc_padding
    var maxImages = parseInt((containerWidth - 230) / 35);
    
    var txt = "";
    var br = "";
    var oB = null;

    for (var i = 0; i < businesses.length; i++) {

        var oP = null;

        oB = businesses[i];
        oP = oB.products;

        var li = document.createElement("li");
        li.id = "result" + i;
        li.className = "post";
        li.onclick = function(val) {
            return function() { findMarker(val); }
        } (i);

        var h2 = document.createElement("h2");
        txt = document.createTextNode(oB.name);
        h2.appendChild(txt);

        var p = document.createElement("p");
        txt = document.createTextNode(oB.street);
        br = document.createElement("br");
        p.appendChild(txt);
        p.appendChild(br);
        txt = document.createTextNode(oB.city);
        br = document.createElement("br");
        p.appendChild(txt);
        p.appendChild(br);
        txt = document.createTextNode(oB.state + ' ');
        br = document.createElement("br");
        p.appendChild(txt);
        txt = document.createTextNode(oB.zip);
        br = document.createElement("br");
        p.appendChild(txt);
        p.appendChild(br);
        //txt = document.createTextNode(oB.phone);
        //p.appendChild(txt);

        // Products
        // note:    products array arrives sorted by importance, we pick the top x to show and then sort by our Image display order defined in arrayProductList
        if (oP != null) {
            var divp = document.createElement("div");
            divp.className = "productList";
            var validCount = 0;
            var imageLength = 0;
            var arrValidProducts = new Array();

            // the logic from here on is slightly incorrect:
            // currently we are losing products greater than "maxImages" depending on the order they appear in oP - (importance order from the database)
            // need to sort the oP array by "Image Sort" first, and then discard when greater > "maxImages".  once done we can remove the order by from uGetStoreProducts.
            
            //first check if we searched for a specific product, if so move to highest display priority (note: not sort priority)
            if ($("#productfilter").length) { //exists
                var priorityProduct = $("#productfilter").val();
                if (priorityProduct != "") {
                    if (oP.indexOf(priorityProduct) > -1) {
                        oP.splice(oP.indexOf(priorityProduct), 1); //remove existing
                        oP.unshift(priorityProduct);
                    }
                }
            };
            
            //second check if valid product - only show certain products as defined in arrayProductList
            for (var j = 0; j < oP.length; j++) {
                var bFound = false;
                for (var k = 0; k < arrayProductList.length; k++) {
                    if (arrayProductList[k][0] == oP[j]) {
                        // don't show this product if more then maxImages image lengths and move onto next product
                        if (imageLength + arrayProductList[k][2] <= maxImages) {
                            bFound = true;
                            arrValidProducts.push(arrayProductList[k]);
                            imageLength = imageLength + arrayProductList[k][2];
                        }
                    }
                }
                if(!bFound) oP.splice(j, 1); //remove products not in arrayProductList
            }

            // sort array of valid products based on Image Sort
            arrValidProducts.sort(ImageSort);
            
            //debug if
            if (i == 0) {
                var salert = '';
                for (var k = 0; k < arrValidProducts.length; k++) {
                    salert = salert + arrValidProducts[k][0] + ',';
                }
                //alert(salert);
            }
            
            
            for (var k = 0; k < arrValidProducts.length; k++) {
                //validCount++;
                //if (j > 0 & validCount % 8 == 0) { // new line if too many images (8 per line)
                //    br = document.createElement("br");
                //    divp.appendChild(br);
                //}
                var img = document.createElement("img");
                img.setAttribute("src", "images/products/" + arrValidProducts[k][0] + ".jpg");
                img.setAttribute("alt", arrValidProducts[k][1] + " " + "\u2122");
                img.setAttribute("title", img.alt);

                img.className = "product";

                divp.appendChild(img);
            }

            li.appendChild(divp);
        };

        var diva = document.createElement("div");
        diva.className = "address";

        diva.appendChild(h2);
        diva.appendChild(p);
        li.appendChild(diva);

        // show more products message
        if (oP.length > arrValidProducts.length) {
            var d22 = document.createElement("div");
            var h22 = document.createElement("h2");
            d22.className = "productmore";
            txt = document.createTextNode("More products available at this location than are shown.");

            h22.appendChild(txt);
            d22.appendChild(h22);
            li.appendChild(d22);
        }
        
        ul.appendChild(li);
        $(ul).fadeIn(1000);
    }
}

function ImageSort(a, b) {
    var n1 = a[3];
    var n2 = b[3];
    return n1 - n2;
}

function PopulateFindProductSelectBox() {

    if (arrayProductList.length > 0) {

        var select = document.createElement("select");
        select.id = "productfilter";

        var opt = document.createElement("option");
        opt.value = "";  //0;
        var txt = document.createTextNode("Any " + config_ProductName + " products");
        opt.appendChild(txt);
        select.appendChild(opt);

        for (var i = 0; i < arrayProductList.length; i++) {
            var opt = document.createElement("option");
            opt.value = arrayProductList[i][0];
            var txt = document.createTextNode(arrayProductList[i][1]);
            opt.appendChild(txt);
            select.appendChild(opt);
        }

        $("#findproducts").append(select);
    }
    else {
        $("#findproducts").hide();
    }
}

var arrayProductList = config_ProductList;