﻿function googleMapLoad(searchwhere, uLat, uLon, nearbyCities)
 {
     if (GBrowserIsCompatible()) {
         var map = new GMap2(document.getElementById("map"), { size: new GSize(422, 261) });


         // map.removeMapType(G_HYBRID_MAP);
         map.setCenter(new GLatLng(uLat, uLon), 11);

         map.addControl(new GMapTypeControl());
         map.addControl(new GLargeMapControl());

         // Create our "tiny" marker icon
         //        var tinyIcon = new GIcon();
         //        tinyIcon.image = "images/mm_20_red.png";
         //        tinyIcon.shadow = "images/mm_20_shadow.png";
         //        tinyIcon.iconSize = new GSize(12, 20);
         //        tinyIcon.shadowSize = new GSize(22, 20);
         //        tinyIcon.iconAnchor = new GPoint(6, 20);
         //        tinyIcon.infoWindowAnchor = new GPoint(5, 1);
         // Set up our GMarkerOptions object literal
         // markerOptions = { icon:tinyIcon };

         // var point = new GLatLng(38.94557,  -92.32386); 

         map.clearOverlays();

         var sidebar = document.getElementById('sidebar');
         sidebar.innerHTML = '';
         if (nearbyCities.length == 0) {
             sidebar.innerHTML = 'No results found.';
             return;
         }

         var bounds = new GLatLngBounds();

         var city = searchwhere;
         var point = new GLatLng(uLat, uLon);
         var markerImage = "../Images/Home_Blue_Star_Large.png";

         var marker = createMarker(point, city, markerImage, nearbyCities);
         map.addOverlay(marker);

         bounds.extend(point);


         //map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));

         map.enableDoubleClickZoom();

     }
}


function createMarker(point, city, markerImage, nearbyCities) {


    // Create  marker icon
    var tinyIcon = new GIcon();
    tinyIcon.image = markerImage;
    tinyIcon.iconSize = new GSize(32, 21);
    tinyIcon.iconAnchor = new GPoint(9,34);
    tinyIcon.infoWindowAnchor = new GPoint(14,5);
    tinyIcon.infoShadowAnchor = new GPoint(18, 25);
    // Set up our GMarkerOptions object literal
    markerOptions = { icon: tinyIcon };

    var marker = new GMarker(point, markerOptions);
    var html = "<table><tr><td valign=\"top\"><img src=\"" + "../Images/Home_Blue_Star_Large.png" + "\" /></td><td><b>" + city + '</b><br/></td></tr></table>';
    GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html);
    });

    var sidebar = document.getElementById('sidebar');
    
    var sidebarHeader = createSidebarheader();
    sidebar.appendChild(sidebarHeader);

    var sidebarEntry;
    
    if (nearbyCities.length > 9) {
        for (var i = 0; i < 9; i++) {
            var srcLowercaseWithoutSpace = nearbyCities[i].replace(" ", "").toLowerCase();
            var targetLowercaseWithoutSpace = city.replace(" ", "").toLowerCase();
            
            if (srcLowercaseWithoutSpace == targetLowercaseWithoutSpace)
             {
                 sidebarEntry = createSidebarEntry(marker, nearbyCities[i]);
            }
            else {
                sidebarEntry = createSidebarEntryWithoutMarker(nearbyCities[i]);
            }
            sidebar.appendChild(sidebarEntry);
        }

        //var sidebarFooter = createSidebarFooter();
        //sidebar.appendChild(sidebarFooter);
    }
    else {
        for (var i = 0; i < nearbyCities.length; i++) {
            var srcLowercaseWithoutSpace = nearbyCities[i].replace(" ", "").toLowerCase();
            var targetLowercaseWithoutSpace = city.replace(" ", "").toLowerCase();

            if (srcLowercaseWithoutSpace == targetLowercaseWithoutSpace) {
                sidebarEntry = createSidebarEntry(marker, city);
            }
            else {
                sidebarEntry = createSidebarEntry(nearbyCities[i]);
            }
            sidebar.appendChild(sidebarEntry);
        }
    }
    
    return marker;
}

function createSidebarFooter() {
    var div = document.createElement('div');
    var html = "<div style=\"font-size:14px; padding:4px 8px; font-family:helvetica; color:#3e91ba; font-weight:600;\">Wisconsin - All Cities<div>";
    div.innerHTML = html;
    div.style.cursor = 'pointer';

    GEvent.addDomListener(div, 'click', function() {
        // GEvent.trigger(marker, 'click');
        alert("Click footer");
    });
    return div;
}

function createSidebarheader() {
    var div = document.createElement('div');
    var html = "<div style=\"font-size:16px; padding:8px; font-family:helvetica;\"><b>Your Community</b><div>";
    div.innerHTML = html;
    div.style.cursor = 'pointer';
    return div;
}

function createSidebarEntryWithoutMarker(city) {
    var div = document.createElement('div');
    var html = "<div style=\"font-size:14px; padding:4px 8px; font-family:helvetica;\">" + city + "<div>";
    div.innerHTML = html;
    div.style.cursor = 'pointer';
    GEvent.addDomListener(div, 'click', function() {

    var citySplitResult = city.split(",");
    var newCity = citySplitResult[0].replace(" ", "-") + "," + citySplitResult[1].replace(" ", "");
 
        var lowerLocationIndex = window.location.href.toLowerCase().indexOf("localscout.com")
        if (lowerLocationIndex > -1) {

            window.location = "http://www.localscout.com/" + newCity;
        }
        else {
            window.location = "../Default.aspx?lo=" + newCity;
        }



    });
    GEvent.addDomListener(div, 'mouseover', function() {
        div.style.backgroundColor = '#eee';
    });
    GEvent.addDomListener(div, 'mouseout', function() {
        div.style.backgroundColor = '';
    });
    return div;
}

function createSidebarEntry(marker, city) {
    var div = document.createElement('div');
    var html = "<div style=\"font-size:14px; padding:4px 8px; font-family:helvetica;\">" + city + "<div>";
    div.innerHTML = html;
    div.style.cursor = 'pointer';
    GEvent.addDomListener(div, 'click', function() {
       GEvent.trigger(marker, 'click');
    });
    GEvent.addDomListener(div, 'mouseover', function() {
        div.style.backgroundColor = '#eee';
    });
    GEvent.addDomListener(div, 'mouseout', function() {
        div.style.backgroundColor = '';
    });
    return div;
}


