// JScript File
//<![CDATA[
var map
var markers = new Array();
var markerNodes = new Array();
var AUTO_ZOOM = 0;
var zoomIncrement = 0;
var zoomLevel = 12;
var zoomThreshold = 13;
var currentZoom
var mapPoint
var xml
var overLay
var contentNodes
var baseIcon = new GIcon();
var baseIcon2 = new GIcon();
var host = imageServer + "corporate/usercontrols";
var West_Bounding_Coordinate = -124.211606;
var East_Bounding_Coordinate = -67.158958;
var North_Bounding_Coordinate = 49.384359;
var South_Bounding_Coordinate = 25.837377;
baseIcon.iconSize = new GSize(19, 19);
baseIcon.shadowSize = new GSize(24, 19);
baseIcon.iconAnchor = new GPoint(19, 19);
baseIcon.infoWindowAnchor = new GPoint(19, 0);
var greenIcon = new GIcon(baseIcon, host + "/images/green_dot.png", null, host + "/images/shadow_angles.png");
var blueIcon = new GIcon(baseIcon, host + "/images/blu_dot.png", null, host + "/images/shadow_angles.png");

// A Rectangle is a simple overlay that outlines a lat/lng bounds on the
// map. It has a border of the given weight and color and can optionally
// have a semi-transparent background color.
function Rectangle(bounds, content, opt_weight, opt_color, opt_bgColor) {
    this.bounds_ = bounds;
    this.weight_ = opt_weight || 2;
    this.color_ = opt_color || "#888888";
    this.backgroundColor_ = opt_bgColor || "#ffffff";
    this.content_ = content;
}
Rectangle.prototype = new GOverlay();

// Creates the DIV representing this rectangle.
Rectangle.prototype.initialize = function(map) {
    // Create the DIV representing our rectangle
    var div = document.createElement("div");
    div.style.position = "absolute";
    div.style.backgroundColor = this.backgroundColor_;
    div.style.padding = "0px";
    div.innerHTML = this.content_;

    // Our rectangle is flat against the map, so we add our selves to the
    // MAP_PANE pane, which is at the same z-index as the map itself (i.e.,
    // below the marker shadows)
    map.getPane(G_MAP_FLOAT_PANE).appendChild(div);

    this.map_ = map;
    this.div_ = div;
}

// Remove the main DIV from the map pane
Rectangle.prototype.remove = function() {
    this.div_.parentNode.removeChild(this.div_);
}

// Copy our data to a new Rectangle
Rectangle.prototype.copy = function() {
    return new Rectangle(this.bounds_, this.content_, this.weight_, this.color_,
                       this.backgroundColor_, this.opacity_);
}

// Redraw the rectangle based on the current projection and zoom level
Rectangle.prototype.redraw = function(force) {
    // We only need to redraw if the coordinate system has changed
    if (!force) return;

    // Calculate the DIV coordinates of two opposite corners of our bounds to
    // get the size and position of our rectangle
    var c1 = this.map_.fromLatLngToDivPixel(this.bounds_.getSouthWest());
    var c2 = this.map_.fromLatLngToDivPixel(this.bounds_.getNorthEast());

    // Now position our DIV based on the DIV coordinates of our bounds
    this.div_.style.width = Math.abs(c2.x - c1.x) + "px";
    this.div_.style.height = "auto";
    this.div_.style.left = (Math.min(c2.x, c1.x) - this.weight_) + "px";
    this.div_.style.top = (Math.min(c2.y, c1.y) - this.weight_) + "px";
}

function load(dataSource) {
    if (GBrowserIsCompatible()) {
        var position
        map = new GMap2(document.getElementById('areaMap'), { size: new GSize(651, 400) });
        map.addControl(new GLargeMapControl());
        position = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(5, 25));
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl(), position);

        GDownloadUrl(dataSource, function(data, responseCode) {
            xml = GXml.parse(data);
            var lat = xml.documentElement.getAttribute("lat");
            var lng = xml.documentElement.getAttribute("lng");

            if (lat != null && lng != null) {
                var point = new GLatLng(lat, lng);
                var communityName = xml.documentElement.getAttribute("name");
                map.setCenter(point, zoomLevel);
                var marker = new GMarker(point, { icon: blueIcon, title: communityName });
                markers.push(marker);
                markerNodes.push(xml.documentElement);
            }

            if (xml.documentElement.getAttribute("mapZoomIncrement").length != 0 &&
                !isNaN(xml.documentElement.getAttribute("mapZoomIncrement"))) {
                zoomIncrement = parseInt(xml.documentElement.getAttribute("mapZoomIncrement"));
            }

            getMarkers();
            resizeMap();
            zoomLevel = map.getZoom();

            loadMarkers();
            loadListeners();
        });
    }
}
function getMarkers() {
    var amenityNodes = xml.documentElement.getElementsByTagName("amenity");

    var marker;
    var point;

    for (i = 0; i < amenityNodes.length; i++) {
        point = new GLatLng(parseFloat(amenityNodes[i].getAttribute("lat")),
                        parseFloat(amenityNodes[i].getAttribute("lng")));
        if (isWithinUSBounds(point)) {
            var amenityName = amenityNodes[i].getAttribute("name");
            marker = new GMarker(point, { icon: greenIcon, title: amenityName });
            markers.push(marker);
            markerNodes.push(amenityNodes[i]);
        }
    }
}
function isWithinUSBounds(point) {
    var swPoint = new GLatLng(South_Bounding_Coordinate, West_Bounding_Coordinate);
    var nePoint = new GLatLng(North_Bounding_Coordinate, East_Bounding_Coordinate);
    var usBounds = new GLatLngBounds(swPoint, nePoint);
    return usBounds.contains(point);
}
function findOnMap(markerTitle) {
    for (i = 1; i < markerNodes.length; i++) {
        title = markerNodes[i].getAttribute("name");
        if (title == markerTitle) {
            GEvent.trigger(markers[i], "mouseover");
        }
    }
}
function loadMarkers() {
    for (i = 0; i < markers.length; i++) {
        var marker = markers[i];
        map.addOverlay(marker);
    }
}
function resizeMap() {
    map.setZoom(zoomLevel);
    var bottom = 20;
    var left = 45;
    var right = 20;
    var top = 20;

    // Create new bounds object
    var bounds = map.getBounds(); //new GLatLngBounds();

    // Loop through the points, extending the bounds as necessary
    for (var i = 0; i < markers.length; i++) {
        bounds.extend(markers[i].getPoint());
    }

    var mapType = map.getCurrentMapType();
    var port = map.getSize();
    var virtualBounds = new GSize(port.width - left - right, port.height - top - bottom);

    // Get the bounds zoom level
    zoomLevel = mapType.getBoundsZoomLevel(bounds, virtualBounds) + zoomIncrement;
    map.setZoom(zoomLevel);

    var xOffs = (left - right) / 2;
    var yOffs = (top - bottom) / 2;
    var bPxCenter = map.fromLatLngToDivPixel(bounds.getCenter());
    var newCenter = map.fromDivPixelToLatLng(new GPoint(bPxCenter.x - xOffs, bPxCenter.y - yOffs));
    map.setCenter(newCenter);

    zoomThreshold = zoomLevel + 2;
}
function loadListeners() {
    for (i = 1; i < markers.length; i++) {
        var marker = markers[i];
        var amenityNode = markerNodes[i];
        var point;
        addMarkerEvents(marker, amenityNode);
    }
}
function addMarkerEvents(marker, amenityNode) {
    var mouseOver = GEvent.addListener(marker, "mouseover", function() {
        var street2 = amenityNode.getAttribute("street2");
        var street3 = amenityNode.getAttribute("street3");
        var city = amenityNode.getAttribute("city");
        var phone = amenityNode.getAttribute("phone");
        var content = "<table id='amenityInfo' border='0' cellpadding='0' cellspacing='10' class='amenityTable'><tr id='amenityHeader'><td class=amenityHeader colspan=2>" + amenityNode.getAttribute("name") + "</td></tr>";
        var address = "<tr id='amenityAddress'><td id='address' valign='top'><b>Address</b>:</td><td><table border='0' cellpadding='0' cellspacing='0'><tr><td class='amenityBody'>" + amenityNode.getAttribute("street1") + "</td></tr>";
        if (street2) address += "<tr><td>" + street2 + "</td></tr>";
        if (street3) address += "<tr><td>" + street3 + "</td></tr>";
        if (city) address += "<tr><td>" + city + "</td></tr>"
        address += "</table></td></tr>";
        if (address.length > 0) content += address;
        if (phone) content += "<tr><td><b>Phone</b>:</td><td>" + phone + "</td></tr>"
        content += "</table>";
        marker.openInfoWindowHtml(content);
    });
}
//]]>