﻿var mapucGMaps;

function InitmapucGMaps(mapsId, xmlPath, cacheKey, regionId) {
    mapucGMaps = new GMap2(document.getElementById(mapsId), { mapTypes: [G_NORMAL_MAP, G_PHYSICAL_MAP, G_SATELLITE_MAP] });
    mapucGMaps.setUIToDefault();
    mapucGMaps.addControl(new GLargeMapControl3D());
    mapucGMaps.addControl(new GMapTypeControl());
    mapucGMaps.addControl(new GOverviewMapControl());
    mapucGMaps.setCenter(new GLatLng(45.92098, -74.16044), 5);    
    
    mapucGMaps.disableScrollWheelZoom();

    var BufferRectBound = null;
    var IsFirstDisplay = true;
    var GMarkers = [];
    var ShowToolTipIsPossible = false;

    // ====== set up marker mouseover tooltip div ======
    var tooltip = document.createElement("div");
    document.getElementById(mapsId).appendChild(tooltip);
    tooltip.style.visibility = "hidden";

    function AjaxCallBack() {
        var center = mapucGMaps.getCenter();
        var bounds = mapucGMaps.getBounds();
        var ne = bounds.getNorthEast();
        var sw = bounds.getSouthWest();
        var topRight = mapucGMaps.fromContainerPixelToLatLng(new GPoint(-100, -100));    //new GLatLng(ne.lat(), sw.lng());
        var botLeft = mapucGMaps.fromContainerPixelToLatLng(new GPoint(780, 600));     //new GLatLng(sw.lat(), ne.lng());
        var meters = topRight.distanceFrom(center);
        var miles = meters * 0.000621371192;

        BufferRectBound = new GLatLngBounds(topRight, botLeft);
        showLoading(null, '#' + mapsId);

        if (miles < 1.0) { miles = 1.0; }

        $.get(xmlPath, { lat: center.lat(), lng: center.lng(),
            distance: miles,
            map_width: 880,
            map_height: 700,
            topLeftLat: topRight.lat(),
            topLeftLng: topRight.lng(),
            botRightLat: botLeft.lat(),
            botRightLng: botLeft.lng(),
            marker_width: 77,
            marker_height: 66,
            Cache: cacheKey,
            regionId: regionId
        },
              function(data, text) {
                  RefineMaps(GXml.parse(data));
              }, 'Text');

    }

    function CreateIcon(img, shadow, imgX, imgY, shadowX, shadowY, anchorX, anchorY) {
        var icon = new GIcon();
        icon.image = img;
        icon.iconSize = new GSize(imgX, imgY);
        icon.iconAnchor = new GPoint(anchorX, anchorY);
        icon.infoWindowAnchor = new GPoint(anchorX, anchorY);
        if (shadow != '') icon.shadow = shadow;
        if (shadowX != null && shadowY != null) icon.shadowSize = new GSize(shadowX, shadowY);
        return icon;
    }

    function createGroupingMarker(point, text, iconPath, count, xml) {
        if(count > 30)
            var icon0 = CreateIcon(iconPath, '', 77, 66, null, null, 20, 32);
        else
            var icon0 = CreateIcon(iconPath, '', 57, 48, null, null, 20, 32);
            
        var marker = new GMarker(point, { icon: icon0 });
        marker.tooltip = '<div style="border:1px solid #7aa443; background-color:#FFF; padding:2px 4px; font-size:11px; color:#5A3B17; font-family:Arial, Helvetica, sans-serif;">' + text + '</div>';
        marker.Xml = xml;
        GEvent.addListener(marker, "mouseover", function() {
            showTooltip(marker);
        });
        
        GEvent.addListener(marker, "mouseout", function() {
            tooltip.style.visibility = "hidden";
        });

        GEvent.addListener(marker, 'click', function() {
            ShowToolTipIsPossible = false;
            mapucGMaps.clearOverlays();
            var zoom = mapucGMaps.getZoom();
            //if (zoom < 15) zoom++;
            var bounds = new GLatLngBounds();
            var point1 = new GLatLng(parseFloat(marker.Xml.getAttribute("topLeftLat")), parseFloat(marker.Xml.getAttribute("topLeftLng")));
            var point2 = new GLatLng(parseFloat(marker.Xml.getAttribute("botRightLat")), parseFloat(marker.Xml.getAttribute("botRightLng")));
            
            bounds.extend(point1);
            bounds.extend(point2);
            
            var zoom = mapucGMaps.getBoundsZoomLevel(bounds);
            var clat = (bounds.getNorthEast().lat() + bounds.getSouthWest().lat()) / 2;
            var clng = (bounds.getNorthEast().lng() + bounds.getSouthWest().lng()) / 2;
            mapucGMaps.setCenter(new GLatLng(clat, clng), zoom);
            
            //mapucGMaps.setZoom(mapucGMaps.getBoundsZoomLevel(bounds));
            //mapucGMaps.setCenter(marker.getPoint(), zoom);

        });
        return marker;
    }

    function createMarker(point, text, iconPath, url) {
        var icon0 = CreateIcon(iconPath, '', 32, 32, null, null, 20, 32);
        var marker = new GMarker(point, { icon: icon0 });
        marker.tooltip = '<div style="width:250px;border:1px solid #7aa443; background-color:#FFF; padding:5px 10px; font-size:11px; color:#5A3B17; font-family:Arial, Helvetica, sans-serif;">' + text + '</div>';
        
        GEvent.addListener(marker, "mouseover", function() {
            showTooltip(marker);
        });

        GEvent.addListener(marker, "mouseout", function() {
            tooltip.style.visibility = "hidden";
        });

        GEvent.addListener(marker, 'click', function() {
            document.location = url;
        });

        return marker;
    }

    function RefineMaps(data) {

        hideLoading('#' + mapsId);
        if (data != null) {
            var bounds = new GLatLngBounds();
            var state = data.documentElement.getAttribute("State");
            if (state != "Valid") {
                document.location = '/';
            }

            var centerLatitude = data.documentElement.getAttribute("CenterLatitude");
            var centerLongitude = data.documentElement.getAttribute("CenterLongitude");
            var centerZoomLevel = data.documentElement.getAttribute("CenterZoomLevel");            

            GMarkers = [];

            var markers = data.documentElement.getElementsByTagName("Grouping");
            for (var i = 0; i < markers.length; i++) {
                var text = markers[i].getAttribute("Name");
                var imgPath = markers[i].getAttribute("icon");
                var count = markers[i].getAttribute("Count");
                var point = new GLatLng(parseFloat(markers[i].getAttribute("Latitude")), parseFloat(markers[i].getAttribute("Longitude")));
                var marker = createGroupingMarker(point, text, imgPath, count, markers[i]);
                mapucGMaps.addOverlay(marker);
                bounds.extend(point);
            }

            markers = data.documentElement.getElementsByTagName("Camping");
            for (var i = 0; i < markers.length; i++) {
                var text = markers[i].getAttribute("HtmlInfo");
                var imgPath = markers[i].getAttribute("icon");
                var url = markers[i].getAttribute("Url");
                var point = new GLatLng(parseFloat(markers[i].getAttribute("Latitude")), parseFloat(markers[i].getAttribute("Longitude")));
                var marker = createMarker(point, text, imgPath, url);
                mapucGMaps.addOverlay(marker);
                GMarkers.push(marker);
                bounds.extend(point);
            }
                        
            if (IsFirstDisplay) {
                IsFirstDisplay = false;
        
                if (centerLatitude != null && centerLongitude != null && centerZoomLevel != null) {
                    mapucGMaps.setCenter(new GLatLng(centerLatitude, centerLongitude), parseInt(centerZoomLevel));                    
                }
                else {
                    var clat = (bounds.getNorthEast().lat() + bounds.getSouthWest().lat()) / 2;
                    var clng = (bounds.getNorthEast().lng() + bounds.getSouthWest().lng()) / 2;
                    mapucGMaps.setCenter(new GLatLng(clat, clng), mapucGMaps.getBoundsZoomLevel(bounds));
                }
            }
            else {
                if (ShowToolTipIsPossible) {
                    for (var i = 0; i < GMarkers.length; i++) {
                        if (GMarkers[i].getLatLng().distanceFrom(mapucGMaps.getCenter()) < 2) {
                            showTooltip(GMarkers[i]);
                            break;
                        }
                    }
                }
            }

            ShowToolTipIsPossible = true;
                   
        }
    }

    function showTooltip(marker) {
        var posMarker = mapucGMaps.fromLatLngToContainerPixel(marker.getLatLng());
        var isLeft = (680 / 2) > posMarker.x ? true : false;
        var isTop = (500 / 2) < posMarker.y ? true : false;
        tooltip.innerHTML = marker.tooltip;

        var point = mapucGMaps.getCurrentMapType().getProjection().fromLatLngToPixel(mapucGMaps.getBounds().getSouthWest(), mapucGMaps.getZoom());
        var offset = mapucGMaps.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(), mapucGMaps.getZoom());
        var anchor = marker.getIcon().iconAnchor;
        var width = marker.getIcon().iconSize.width;
        var x = (offset.x - point.x - anchor.x + width); // - (marker.getIcon().iconSize.width / 2);
        var y = (-offset.y + point.y + anchor.y) - (marker.getIcon().iconSize.height / 2);

        if (!isLeft) {x = x - (tooltip.offsetWidth + marker.getIcon().iconSize.width); }
        if (!isTop) {y = y - (tooltip.offsetHeight < marker.getIcon().iconSize.height ? 0 : tooltip.offsetHeight); }        

        var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(x, y));
        pos.apply(tooltip);
        tooltip.style.visibility = "visible";
    }

    function RefreshMap() {
        mapucGMaps.clearOverlays();
        tooltip.style.visibility = "hidden";
        AjaxCallBack();
    }

    function AddGMapsEvents() {
        GEvent.addListener(mapucGMaps, "moveend", function() {
            if (BufferRectBound != null) {
                var bounds = mapucGMaps.getBounds();
                var ne = bounds.getNorthEast();
                var sw = bounds.getSouthWest();
                if (ne.lat() > BufferRectBound.getNorthEast().lat() &&
                ne.lat() < BufferRectBound.getSouthWest().lat() &&
                ne.lng() < BufferRectBound.getNorthEast().lng() &&
                ne.lng() > BufferRectBound.getSouthWest().lng() &&
                sw.lat() > BufferRectBound.getNorthEast().lat() &&
                sw.lat() < BufferRectBound.getSouthWest().lat() &&
                sw.lng() < BufferRectBound.getNorthEast().lng() &&
                sw.lng() > BufferRectBound.getSouthWest().lng())
                { }
                else
                    RefreshMap();
            }
            else
                RefreshMap();
        });

        GEvent.addListener(mapucGMaps, "zoomend", function() {
            RefreshMap();
        });
    }

    function GetMarker() {
        return GMarkers;
    }

    AddGMapsEvents();
    AjaxCallBack();

    return this;
}

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}

