﻿Type.registerNamespace("Mcw.Rijksoverheid.GoogleMaps");

Mcw.Rijksoverheid.GoogleMaps.Marker = function (element) {
    Mcw.Rijksoverheid.GoogleMaps.Marker.initializeBase(this, [element]);

    this._element = element;
    this._node = null;
    this._intID = null;
    this._strName = null;
    this._intPageID = null;
    this._strHtml = null;
    this._strHref = null;
    this._flLat = null;
    this._flLng = null;
    this._map = null;
    this._marker = null;
    this._blShowMarkerOnMap = null;
    this._strImgUrl = null;
    this._strImgHighlightUrl = null;
    this._markerGroup = null;
    this._blIsActive = false;
}

Mcw.Rijksoverheid.GoogleMaps.Marker.prototype = {
    initialize: function () {
        Mcw.Rijksoverheid.GoogleMaps.Marker.callBaseMethod(this, 'initialize');
    },
    dispose: function () {
        Mcw.Rijksoverheid.GoogleMaps.Marker.callBaseMethod(this, 'dispose');
    },
    setProperties: function () {
        // Set properties.
        this._intID = parseInt(this._node.getAttribute("id"));
        this._strName = this._node.getAttribute("name");
        this._intPageID = parseInt(this._node.getAttribute("pageId"));
        this._strHref = this._node.getAttribute("href");
        this._flLat = parseFloat(this._node.getAttribute("lat"));
        this._flLng = parseFloat(this._node.getAttribute("lng"));
        this._map = Mcw.Rijksoverheid.GoogleMaps.MapViewerControl.Instance.get_Map();
        this._blShowMarkerOnMap = false;
    },
    /// 
    determineImageUrls: function () {
        switch (this._markerGroup._intID) {
            case 1:
                this._strImgUrl = "/_images/googleMaps/marker1.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker1Selected.png";
                break;
            case 2:
                this._strImgUrl = "/_images/googleMaps/marker2.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker2Selected.png";
                break;
            case 3:
                this._strImgUrl = "/_images/googleMaps/marker3.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker3Selected.png";
                break;
            case 4:
                this._strImgUrl = "/_images/googleMaps/marker4.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker4Selected.png";
                break;
            case 5:
                this._strImgUrl = "/_images/googleMaps/marker5.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker5Selected.png";
                break;
            case 6:
                this._strImgUrl = "/_images/googleMaps/marker6.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker6Selected.png";
                break;
            case 7:
                this._strImgUrl = "/_images/googleMaps/marker7.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker7Selected.png";
                break;
            case 8:
                this._strImgUrl = "/_images/googleMaps/marker8.png";
                this._strImgHighlightUrl = "/_images/googleMaps/marker8Selected.png";
                break;
        }
    },
    /// Function which handles the positioning of the marker on the google map.
    initMarkerOnMap: function () {
        var context = this;

        // Create point.
        var point = new google.maps.LatLng(this._flLat, this._flLng);

        // Create marker instance.
        var marker = new google.maps.Marker({ position: point, map: this._map, icon: this._strImgUrl });

        // Add event listeners.
        google.maps.event.addListener(marker, "click", function (event) {
            switch (Mcw.Rijksoverheid.GoogleMaps.MapViewerControl.Instance._markerBehavior) {
                case 0: // Link.
                    if (context._strHref != null && context._strHref != "")
                        window.location = context._strHref;
                    break;
                case 1: // Pop-Up
                    context.showTooltip(marker.getPosition(), context._strHtml);
                    break;
                default:
                    break;
            }
        });
        google.maps.event.addListener(marker, "mouseover", function (event) {
            context.showTooltip(marker.getPosition(), context._strName);
        });
        google.maps.event.addListener(marker, "mouseout", function () {
            $("#tooltipContainer").fadeOut();
        });

        // Set Marker property value.
        this._marker = marker;

        // Add marker to map.
        this.showMarkerOnMap(true);
    },
    showTooltip: function (latLng, strHtml) {
        var tooltip = $("#tooltipContainer");

        // Set the html of the tooltip.
        tooltip.html(strHtml);

        // Get the offset for the tooltip in pixels according to marker latlong values.
        var intScale = Math.pow(2, this._map.getZoom());

        var nw = new google.maps.LatLng(
            this._map.getBounds().getNorthEast().lat(),
            this._map.getBounds().getSouthWest().lng()
        );

        var pointWorldNW = this._map.getProjection().fromLatLngToPoint(nw);
        var pointWorldMarker = this._map.getProjection().fromLatLngToPoint(latLng);
        var point = new google.maps.Point(
            Math.floor((pointWorldMarker.x - pointWorldNW.x) * intScale),
            Math.floor((pointWorldMarker.y - pointWorldNW.y) * intScale)
        );

        // Fade in tooltip at the right position.
        tooltip.fadeIn().css({ top: (point.y) + "px", left: (point.x - (tooltip.width() / 2)) + "px" });
    },
    showMarkerOnMap: function (blShowMarkerOnMap) {
        if (blShowMarkerOnMap == this._blShowMarkerOnMap)
            return;

        // Show/hide marker.
        if (blShowMarkerOnMap)
            this._marker.setMap(this._map);
        else
            this._marker.setMap(null);

        this._blShowMarkerOnMap = blShowMarkerOnMap;
    },
    activate: function () {
        // Set highlight image for marker.
        this._marker.setIcon(this._strImgHighlightUrl);

        // Center marker.
        this._map.panTo(this._marker.getPosition());

        // Set boolean.
        this._blIsActive = true;
    },
    deactivate: function () {
        // Set default image for marker.
        this._marker.setIcon(this._strImgUrl);

        // Set boolean.
        this._blIsActive = false;
    },

    get_Node: function () {
        return this._node;
    },
    set_Node: function (value) {
        this._node = value;

        // Get properties from node and set them as instance property values.
        this.setProperties();
    },
    get_MarkerGroup: function () {
        return this._markerGroup;
    },
    set_MarkerGroup: function (value) {
        this._markerGroup = value;

        // Determine marker image urls according to group.
        this.determineImageUrls();

        // Add marker to the GMap.
        this.initMarkerOnMap();
    },
    get_IsActive: function () {
        return this._blIsActive;
    },
    set_IsActive: function (value) {
        this._blIsActive = value;

        if (value)
            this.activate();
        else
            this.deactivate();
    }
}

Mcw.Rijksoverheid.GoogleMaps.Marker.registerClass("Mcw.Rijksoverheid.GoogleMaps.Marker", Sys.UI.Control);
