var map;

function BindCategoriesOnMap(categories) {
    for (var i = 0; i < categories.length; i++) {
        if ((categories[i].Latitude != null) && (categories[i].Longitude != null)) {
            var point = new GLatLng(categories[i].Latitude, categories[i].Longitude);
            var marker = createMarker(categories[i], point, GetHtmlWindowForItem(categories[i]));
            map.addOverlay(marker);
        }
    }

    if (myItinerary != null) {
        for (var i = 0; i < myItinerary.length; i++) {
            if ((myItinerary[i].Latitude != null) && (myItinerary[i].Longitude != null)) {
                var point = new GLatLng(myItinerary[i].Latitude, myItinerary[i].Longitude);
                var marker = createMarker(myItinerary[i], point, GetHtmlWindowForItem(myItinerary[i]));
                map.addOverlay(marker);
            }
        }
    }
}

function ClearMapMarkers() {
    map.clearOverlays();
}

function DisplayMarkerPopup(item) {

    var point = new GLatLng(item.Latitude, item.Longitude);

    map.setCenter(point, 13);
    map.setZoom(9);

    map.openInfoWindow(point, GetHtmlWindowForItem(item));
    
}
function CloseMarker() {

    marker.closeInfoWindow();
}

function createMarker(item, point, html) {

    // Set icon for item in itinerary
    var inItinenaryIcon = new GIcon();
    inItinenaryIcon.image = "/graphics/pin_red.png";
    inItinenaryIcon.shadow = "/graphics/mm_20_shadow.png";
    inItinenaryIcon.iconAnchor = new GPoint(6, 20);
    inItinenaryIcon.infoWindowAnchor = new GPoint(8, 20);

    // Set icon for item not in itinerary
    var notInItinenaryIcon = new GIcon();
    notInItinenaryIcon.image = "/graphics/pin_green.png";
    notInItinenaryIcon.shadow = "/graphics/mm_20_shadow.png";
    notInItinenaryIcon.iconAnchor = new GPoint(6, 20);
    notInItinenaryIcon.infoWindowAnchor = new GPoint(8, 20);

    if (item.IsInUserItinerary) {
    
        markerOptions = { icon: inItinenaryIcon };
    }
    else
        markerOptions = { icon: notInItinenaryIcon };

    var marker = new GMarker(point, markerOptions);


    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml(html);
    });
    return marker;

}

function GetHtmlWindowForItem(item) {
    var html = GetBasicHtmlWindow(item);

    if (item.IsInUserItinerary == false) {
        html += "<div class='btn-yellow-map' >";
        html += "<div class='btn-yellow-map-inner'>";
        html += "<a href='javascript:AddToItinerary(" + item.Id + ");RefreshSelectedData();' >ADD TO ITINERARY</a>";
        html += "</div></div>";
    }
    else {
        html += "<div class='btn-orange-map' >";
        html += "<div class='btn-orange-map-inner'>";
        html += "<a href='javascript:RemoveFromItinerary(" + item.Id + ");RefreshSelectedData();' >REMOVE FROM ITINERARY</a>";
        html += "</div></div>";
    }

    html += "</div>";
    return html;
}

function GetBasicHtmlWindow(item) {
    var html = "<div class='map'>";
    html += "<p>" + item.Title + "<br />";
    if (item.SiteUrl == null) item.SiteUrl = "";
    html += '<a href="http://' + item.SiteUrl + '" target="_blank" onclick="window.open(this.href, this.target);return false;">' + item.SiteUrl + '</a></p>';
    return html;
}

function LoadMap() {
    if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(41.494539, -82.832393), 13);
        //add the north-south and zoom button overlays
//        var ZBMapCtrl = new GSmallMapControl;
//        map.addControl(ZBMapCtrl);
        //add the satellite/hybrid/map buttons
//        var MTMapCtrl = new GMapTypeControl;
//        map.addControl(MTMapCtrl);
        //add the overview section
//        var OvMapCtrl = new GOverviewMapControl;
//        map.addControl(OvMapCtrl);
        //enable scroll wheel zoom
        map.enableScrollWheelZoom();
        //set zoom level
        map.setZoom(9);

        map.setUIToDefault();
    }
}