/*
*/

var map = null;
var strcentre = "";
var geocoder = null;
var baseIcn = null;
var isLoaded = false;
var alphaArr = new Array('A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');

function Qs() {
    var qs = document.location.search.substring(1);
    var qsArr = qs.split("&");
    var strLocation = "";
    for (var i = 0; i < qsArr.length; i++) {
        var sOpt = qsArr[i].split("=");
        if (sOpt[0] == "q") {
           strLocation = unescape(sOpt[1]);
        }
    } //for
    if (strLocation != "") { searchWithString(strLocation); }
}

function LoadMap() {
    if (GBrowserIsCompatible) {
        map = new GMap2(document.getElementById("Map"));
        var DefaultZoomLevel = 4;
        //var NewYork = new GLatLng(40.6926210, -74.0897160);
        var UnitedStates = new GLatLng(37.0902400, -95.7128912);
        map.setCenter(UnitedStates, DefaultZoomLevel);
        //map.addControl(new GLargeMapControl());
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        geocoder = new GClientGeocoder();

        baseIcn = new GIcon();
        baseIcn.shadow = "images/mapicons/shadow50.png";
        baseIcn.iconAnchor = new GPoint(9, 34);
        baseIcn.infoWindowAnchor = new GPoint(9, 2);
        baseIcn.infoShadowAnchor = new GPoint(40,25);
    } else {
        //error. The user's browser is not compatible with Google Maps
    }
    document.getElementById("tbl-loading").style.display = "none";
    document.getElementById("tbl-retailers").style.display = "none";
    document.getElementById("tbl-error").style.display = "none";
}

function SetMarker(mapPoint, iconMrkr, winInfo) {
    var mrkr = new GIcon(baseIcn);
    mrkr.image = iconMrkr;
    var marker = new GMarker(mapPoint, mrkr);
    if (winInfo != "") {
        GEvent.addListener(marker, "click", function() {
            marker.openInfoWindowHtml(winInfo);
        });
    }
    return marker;
}


function SetMapCentre(intLat, intLong) {
    var centrepoint = new GLatLng(intLat, intLong);
    map.setCenter(centrepoint, 10);
}

//This mimics the functionality of search() below.
function searchWithString(param) {
    document.getElementById("tbl-error").style.display = "none";

    if (param == "") {
        document.getElementById("tbl-loading").style.display = "none";
        document.getElementById("tbl-retailers").style.display = "none";
        document.getElementById("tbl-error").style.display = "inline";
        return false;
    }

    document.getElementById("tbl-loading").style.display = "inline";
    document.getElementById("tbl-retailers").style.display = "none";
    document.getElementById("tbl-error").style.display = "none";

    var tblBody = document.getElementById("tblbody-results");
    if (tblBody.hasChildNodes) { $("#tblbody-results").html(""); } //IE8 has a problem with innerHTML. So use JQuery to replace the values.
    strcentre = param;
    getlocations(param, "zip");
}

function search(obj) {
    var addrType = "";
    var strcity = "";
    var strstate = "";
    var strzip = "";
    
    strcity = obj.txtCity.value;
    strstate = obj.selState.options[obj.selState.selectedIndex].value;
    strzip = obj.txtZip.value;
    strcentre = "";

    document.getElementById("tbl-error").style.display = "none";

    if (strstate == "NO" || strstate == "Other") {
        strstate = "";
    }

    if (strcity == "" && strstate == "" && strzip == "") {
        document.getElementById("tbl-loading").style.display = "none";
        document.getElementById("tbl-retailers").style.display = "none";
        document.getElementById("tbl-error").style.display = "inline";
        return false;
    }

    if (strcity != "" && strstate != "") {
        strcentre = strcity + "," + strstate;
        addrType = "default";
    } else if (strcity != "") {
        strcentre = strcity;
        addrType = "city";
    } else if (strstate != "") {
        strcentre = strstate;
        addrType = "state";
    }

    if (strcentre == "") {
        strcentre = strzip;
        addrType = "zip";
//        if (strzip != "" && strcentre != "") {
//            strcentre += "," + strzip;
//            addrType = "default";
//        } else if (strzip != "") {
//            strcentre = strzip;
//            addrType = "zip";
//        }
    }
    
    document.getElementById("tbl-loading").style.display = "inline";
    document.getElementById("tbl-retailers").style.display = "none";
    document.getElementById("tbl-error").style.display = "none";

    var tblBody = document.getElementById("tblbody-results");
    //if (tblBody.hasChildNodes) { tblBody.innerHTML = ""; }
    if (tblBody.hasChildNodes) {$("#tblbody-results").html("");} //IE8 has a problem with innerHTML. So use JQuery to replace the values.

    getlocations(strcentre,addrType);
}

function getlocations(param1, param2) {
    //alert(param2);
    $.ajax({
        type: "POST",
        url: "AppService/GeoLookup.asmx/FindRetailers",
        data: "point=" + param1 + "&addressType=" + param2,
        dataType: "html",
        success: function(msg) {
            // $("#returnmsg").html(msg);
            // $("textarea").text(msg);
            HandleResponse(msg);
        },
        error: function(e) {
            PostError();
        }
    });
}

function PostError() {
    document.getElementById("tbl-loading").style.display = "none";
    document.getElementById("tbl-retailers").style.display = "inline";
    
    var tblBody = document.getElementById("tblbody-results");
    var tr = document.createElement("tr");
    var td = document.createElement("td");
    td.innerHTML = "Could not find any locations in your area.";
    tr.appendChild(td);
    tblBody.appendChild(tr);
}

function HandleResponse(list) {
    document.getElementById("tbl-loading").style.display = "none";
    document.getElementById("tbl-retailers").style.display = "inline";

    if (isLoaded) {
        //clear the current map layouts
        map.clearOverlays();
    }

    var temp = "";
    var arrRows = list.split("\n");

    if (arrRows.length < 3) {
        PostError();
        return;
    }

    var tblBody = document.getElementById("tblbody-results");
    if (tblBody.hasChildNodes) { $("#tblbody-results").html(""); }

    var bounds = new GLatLngBounds();

    //Loop through and build both table and json.
    for (var i = 0; i < arrRows.length - 1; i++) {
        var arrCols = arrRows[i].split("|");
        if (i == 1) {
            var mapCentrePoint = new GLatLng(arrCols[2], arrCols[1]);
            map.setCenter(mapCentrePoint, 10);
            var dummyvar = SetMarker(mapCentrePoint, "http://chart.apis.google.com/chart?chst=d_map_pin_icon_withshadow&chld=home|b085bc|000000", "Your approximate location.");
            map.addOverlay(dummyvar);
			bounds.extend(mapCentrePoint);
            //SetMapCentre(arrCols[2],arrCols[1]);
            //var dummyvar = SetMarker(arrCols[2], arrCols[1], "images/mapicons/defaultmarker.png", "Your approximate location.");
            //map.addOverlay(dummyvar);
            //SetMarker(arrCols[2], arrCols[1], "images/mapicons/defaultmarker.png", "");
        } else if (i > 1) {
        
            var tr = document.createElement("tr");
            var td = document.createElement("td");
                        
            var arrIndex = (i - 2);
            //var icnImage = "images/mapicons/marker" + alphaArr[arrIndex] + ".png";
			var icnImage = "http://chart.apis.google.com/chart?chst=d_map_pin_letter_withshadow&chld=" + alphaArr[arrIndex] + "|b085bc|000000";

            var div = document.createElement("div");
            div.setAttribute("id", "store_" + arrIndex);
            div.setAttribute("class", "storeListing");

            //var pTag = document.createElement("p");
            //pTag.setAttribute("class", "storeName");
            
            //strReturn+="ID|Long|Lat|Name|Address|City|State|Distance";
            //td.innerHTML = "<div class='retail-name'><a href=''>" + arrCols[3] + "</a></div><div class='street-addr'>" + arrCols[4] + "</div><div class='city-state'>" + arrCols[5] + ", " + arrCols[6] + " [zipcode]" + "</div><div class='phone'>[phone]</div><div class='distance'>Distance: " + arrCols[8] + " mi</div><br><br>";
            //var strStoreListing = "<div class='storeListing'><p class='storeName'> " + alphaArr[arrIndex] + " <span>" + arrCols[3] + "</span></p><p class='storeAddress'>" + arrCols[4] + "<br />" + arrCols[5] + ", " + arrCols[6] + " " + arrCols[7] + "<br />";
            //if (arrCols[8] != "") {
            //    strStoreListing += "Phone: " + arrCols[8] + "</p>";
            //}
            //var strInfoWinData = strStoreListing + "</div>";
            //var itemEvent = SetMarker(arrCols[2], arrCols[1], icnImage, strInfoWinData);
            //strStoreListing += "<p class='storeDirections'>Distance:" + arrCols[9] + " mi<br />";
            //strStoreListing += "<!--<a href='#'>Get Directions</a>--></p></div>";

            var strInfoWin = "";
            var strStoreListing = "";

//            strStoreListing = "<p class=\"storeName\"><span class=\"alphaLetter\">" + alphaArr[arrIndex] + "</span><span>" + arrCols[3] + "</span></p>";
//            strStoreListing += "<p class=\"storeAddress\">" + arrCols[4] + "<br />" + arrCols[5] + ", " + arrCols[6] + " " + arrCols[7] + "<br />";
//            if (arrCols[8] != "") {strStoreListing += "Phone: " + arrCols[8] + "</p>";}
//            strStoreListing += "<p class=\"storeDirections\">Distance: " + arrCols[9] + " mi<br />";
//            strStoreListing += "<a href=\"store-locator-directions.aspx?t=" + escape(arrCols[4]) + "+" + escape(arrCols[5]) + "+" + escape(arrCols[6]) + "+" + escape(arrCols[7]) + "&f=" + escape(strcentre) + "\">Get Directions</a></p>";

            //Store listings to print on right panel.
            //"ID|Long|Lat|Name|Address|City|State|Distance";
            strStoreListing = "<p style='background:transparent url(../images/bg-store-pin.gif) no-repeat scroll 0 0; font-weight:bold; padding:0 0 0 5px; font-size:11px; float:left;'><span style='width:20px; margin:0; text-decoration:none; float:left;'>" + alphaArr[arrIndex] + "</span><span style='text-decoration:underline; margin:0; display:block; float:left; width:200px;'>" + arrCols[3] + "</span></p>";
            strStoreListing += "<p style='margin:0 0 0 25px; float:left; display:inline; width:90%;'>" + arrCols[4];
            if (arrCols[5] != "") {strStoreListing += "<br>" + arrCols[5]; }
            strStoreListing += "</p>";
            strStoreListing += "<p style='margin:0 0 0 25px; float:left; display:inline; width:90%;'>" + arrCols[6] + ", " + arrCols[7] + " " + arrCols[8] + "</p>";
            if (arrCols[9] != "") { strStoreListing += "<p style='margin:0 0 0 25px; float:left; display:inline; width:90%;'>Phone: " + arrCols[9] + "</p>"; }
            if (arrCols[11] != "") { strStoreListing += "<p style='margin:0 0 0 25px; float:left; display:inline; width:90%;'><a rel='external'  href='http://"+ removeSpace(arrCols[11])+ "'>" + removeSpace(arrCols[11]) + "</a></p>"; }
            strStoreListing += "<p style='float:left; padding:5px 0; font-size:9px; clear:both; margin:0 0 0 25px; width:90%; display:inline;'>Distance: " + arrCols[10] + " mi<br />";
           
            strStoreListing += "<a style='font-size:9px;' href=\"store-locator-directions.aspx?t=" + escape(arrCols[4]) + "+" + escape(arrCols[6]) + "+" + escape(arrCols[7]) + "+" + escape(arrCols[8]) + "&f=" + escape(strcentre) + "\">Get Directions</a></p>";

            //Store info for the pins.
            strInfoWin = "<p class=\"storeName\"><span><b>" + arrCols[3] + "</b></span></p>";
            strInfoWin += "<p class=\"storeAddress\">" + arrCols[4];
            if (arrCols[5] != "") { strInfoWin += "<br>" + arrCols[5]; }
            strInfoWin += "<br />" + arrCols[6] + ", " + arrCols[7] + " " + arrCols[8] + "<br />";
            if (arrCols[9] != "") { strInfoWin += "Phone: " + arrCols[9] + "</p>"; }
            if (arrCols[11] != "") { strInfoWin += removeSpace(arrCols[11]) + "</p>"; } 
            strInfoWin += "<p class=\"storeDirections\">Distance: " + arrCols[10] + " mi<br />";
            strInfoWin += "<!--<a href='#'>Get Directions</a>--></p>";

            var storePoint = new GLatLng(arrCols[2], arrCols[1]);
            var storeMarker = SetMarker(storePoint, icnImage, strInfoWin);
            map.addOverlay(storeMarker);
            bounds.extend(storePoint);
            
              //Click event does not work. There is a bug that keeps the info of the last store in the array. Review needed.
//            GEvent.addDomListener(div, "click", function() {
//                GEvent.trigger(storeMarker, "click");
//                //map.panTo(storeMarker.getPoint());
//            });
            div.innerHTML = strStoreListing;
            
            td.appendChild(div);
            tr.appendChild(td);
            tblBody.appendChild(tr);
         }
     } //end for loop
	 
	 // Set the center point and zoom level (with an extra step zoom-out for better viewing)
	 map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds) - 1);
     setExternalLinks();
     //variable to track that the map has results listed.
     isLoaded = true;
 }

function removeSpace(word){

    return word.replace(/\s/,"");

}

function setExternalLinks() {
    $("a[rel='external']").click(function() {
        window.open($(this).attr("href"), "", "");
        return false;
    });
}