/// <reference path="jquery-1.3.2-vsdoc2.js" />

var Tempo = {};

Tempo.storeMap = {
    instance: null,
    map: null,
    url: '/Templates/Public/WebServices/AjaxService.asmx/GetPageContent',
    overlay: null,
    baseIcon: null,
    markers: null,

    init: function() {
        instance = this;
        this.overlay = jQuery('#store-map-overlay');
        this.setCloseBehavior();
    },

    closeOverlay: function() {
        jQuery(instance.overlay).hide();
    },

    openOverlay: function() {
        jQuery(instance.overlay).show();
    },

    setCloseBehavior: function() {
        jQuery('#store-map-overlay .close').click(function(e) {
            e.preventDefault();
            instance.closeOverlay();
        });
    },

    getStoreInfo: function(id) {
        jQuery(instance.overlay).find('#ovl-content').html('');
        this.openOverlay();
        this.getData(id);
    },

    loadMap: function() {
        if (this.instance == null)
            this.init();
        if (GBrowserIsCompatible()) {
            this.baseIcon = new GIcon();
            this.baseIcon.shadow = '/media/images/map-shadow.png';
            this.baseIcon.shadowSize = new GSize(40, 32);
            this.baseIcon.iconSize = new GSize(29, 32);
            this.baseIcon.iconAnchor = new GPoint(14, 32);
            this.baseIcon.infoWindowAnchor = new GPoint(9, 2);

            this.map = new GMap2(document.getElementById('store-map'));
            this.map.addMapType(G_PHYSICAL_MAP);
            this.map.addControl(new GLargeMapControl3D());
            this.map.addControl(new GScaleControl());
            var mapControl = new GMenuMapTypeControl();
            this.map.addControl(mapControl);
            this.markers = [];
        }
    },

    createMarker: function(point, index, infoHTML, pageId) {
        var numberedIcon = new GIcon(this.baseIcon);
        if (index <= 5)
            numberedIcon.image = "/media/images/map-marker" + index + ".png";
        else {
            numberedIcon.image = "/media/images/map-marker.png";
            numberedIcon.iconSize = new GSize(21, 24);
            numberedIcon.shadow = "";
        }
        var infoText = infoHTML;
        markerOptions = { icon: numberedIcon };
        var marker = new GMarker(point, markerOptions);
        GEvent.addListener(marker, 'click', function() {
            //marker.openInfoWindowHtml(infoText);
            instance.getStoreInfo(pageId);
        });
        return marker;
    },

    addOverlay: function(point, index, infoHtml, pageId) {
        this.map.addOverlay(this.createMarker(point, index, infoHtml, pageId));
    },

    addClusterOverlay: function(point, index, infoHtml, pageId) {
        // Create marker without numbers
        this.markers.push(this.createMarker(point, 10, infoHtml, pageId));
    },

    getData: function(id) {
        jQuery.ajax({
            type: "POST",
            url: instance.url,
            data: "{'pageid':'" + id + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            processData: false,
            cache: false,
            success: function(msg, status) {
                jQuery(instance.overlay).find('#ovl-content').html(msg.d);
                $('.coda-slider').codaSlider({ autoSlide: true, dynamicTabs: false, dynamicArrowLeftText: '&#171;', dynamicArrowRightText: '&#187;' });
            },
            error: function(xhr, msg, e) {
                alert(msg + ', ' + e); //Error Callback
            }
        });
    }
};

jQuery(document).ready(function() {
    Tempo.storeMap.init();
});