﻿

geodata.maptips.MapTipWindow = function () {
    this.hoverDivId = "MapTipHoverContainerDiv";
    this.hoverContentId = "MapTipHoverContentCell";
    this.currentItem = null;
    this.prevRouteLinksPanelId = null;
    this.clickHandlerFrom = null;
    this.clickHandlerTo = null;
    this.clickHandlerVia = null;


    this.createDivs = function () {
        var s = '<div onmouseout="return gdMapTipHoverInfoMouseOut(event);" id="' + this.hoverDivId + '" class="GDMapTipBodyStyle">';
        s += '      <div class="GDMapTipContentsStyle"  id="' + this.hoverContentId + '" >';
        //	    Content Content Content Content Content
        s += '      </div>';
        s += '</div>';
        this.addDiv("MapTipPanelHolder", s, 0, 0, 1, 1, "visible", "background-color: transparent; position: absolute;")
    }

    this.setPosition = function (maptipItem) {
        var mp = geodata.maptips.currentMapTipsLayer.map;
        var mapx = (mp.position ? mp.position.x : mp._pos.x); // 1.2 / 1.3 version of JSAPI
        var mapy = (mp.position ? mp.position.y : mp._pos.y); // 1.2 / 1.3 version of JSAPI
        if (maptipItem.selected) {
            // Selected maptip may have been cached on client, so screen coordinates produced serverside are not necessarily correct.
            var s = mp.toScreen(new esri.geometry.Point(maptipItem.X, maptipItem.Y, null));
            maptipItem.screenX = s.x;
            maptipItem.screenY = s.y;
        }

        var footerHeigth = 0;
        var footer = dojo.byId("map_fullscreen_footer");
        if (footer)
            footerHeigth = dojo.position(footer).h;

        var x = mapx + maptipItem.screenX;
        var y = mapy + maptipItem.screenY;
        var right = mapx + mp.width - 5;
        var bottom = mapy + mp.height - footerHeigth - 5;

        var boxDim = dojo.position(this.hoverDivId);

        if (x + boxDim.w > right) {  // check if box floats over right edge
            x = right - boxDim.w;
            if ((dojo.byId(this.prevRouteLinksPanelId)) && (gdClientData.hasRoutePlanner)) {
                var p = dojo.position(this.prevRouteLinksPanelId);
                x -= p.w;  // make room for route links panel
            }
        }
        if (y + boxDim.h > bottom)  // check if box floats over bottom edge
            y = bottom - boxDim.h;

        dojo.style(this.hoverDivId, "left", x + "px");
        dojo.style(this.hoverDivId, "top", y + "px");
    }

    this.show = function (item) {  // display poi popup/mouseover window in map

        if (!item)
            return;

        this.currentItem = item;

        dojo.byId(this.hoverContentId).innerHTML = item.htmlContent;  // setter nytt html innhold i popup-div

        this.addRouteStopLinks(dojo.byId('maptips_footer'), item);  // puts route stop links in popup footer (single product popup)            


        if (item.contentByCategory) {  // grouped/complex list
            var product = item.contentByCategory[0].products[0];
            mapHoverFunctions.multiCatMouseOver(0, item.index, product.productId);  // trigger mouseover on first group-category manually.. (this will also show route links panel popout)
        }

        else {  // simple list or "Zoom in"-message (too many products to show in list)
            var searchText = "mapmultilistview_pid";

            if (item.productId == 0) {
                var start = item.htmlContent.indexOf(searchText);  // HACK: have to find the id for the first product in the list...
                if (start > -1) {
                    var end = item.htmlContent.indexOf("'", start);
                    if (end > -1)
                        item.productId = item.htmlContent.substring(start + searchText.length, end);
                }
            }

            var rowId = searchText + item.productId
            geodata.maptips.MapTipListMouseOver(rowId, "", 0, 0, item.productId, false);
        }

        this.setPosition(this.currentItem);   // positions popup in map
        dojo.style(this.hoverDivId, "visibility", "visible");
        geodata.maptips.hoverVisible = true;
    }

    this.showRouteLinksPopup = function (rowDivId, name, x, y, productId, routeLinksDivBaseId) {

        if (!gdClientData.hasRoutePlanner)
            return;

        var panelId = routeLinksDivBaseId + productId;
        var panel = dojo.byId(panelId);

        if ((name != '') && (x > 0) && (y > 0))
            this.setupStopLinkEvents(name, x, y, "maptips_list_route_from", "maptips_list_route_to", "maptips_list_route_via");

        if ((panelId == this.prevRouteLinksPanelId) && (panel.innerHTML != ''))  // this panel is already showing
            return;

        this.setupRouteLinksPanel(panelId, rowDivId, name);
    }

    this.setupRouteLinksPanel = function (panelId, parentRow, productName) {

        if (!gdClientData.hasRoutePlanner)
            return;

        var prevPanel = dojo.byId(this.prevRouteLinksPanelId);
        if (prevPanel)
            prevPanel.innerHTML = "";  // empty previous links panel

        var travelToTitle = gdGetText("/map/routeplanner/alt/findrouteto") + " " + productName;
        var travelFromTitle = gdGetText("/map/routeplanner/alt/findroutefrom") + " " + productName;
        var travelViaTitle = gdGetText("/map/routeplanner/alt/findroutevia") + " " + productName;

        var panel = dojo.byId(panelId);
        if (panel) {
            var s = "";
            s += "<div class='maptips_stoplinks_multi_top'></div>";
            s += "<div class='maptips_stoplinks_multi_content'>";
            s += "<div class='maptips_list_route_link' title='" + travelFromTitle + "'><a href='#' id='maptips_list_route_from'>" + gdGetText("/map/routeplanner/travelfrom") + "</a></div>";
            s += "<div class='maptips_list_route_link' title='" + travelToTitle + "'><a href='#' id='maptips_list_route_to'>" + gdGetText("/map/routeplanner/travelto") + "</a></div>";
            s += "<div class='maptips_list_route_link' title='" + travelViaTitle + "'><a href='#' id='maptips_list_route_via'>" + gdGetText("/map/routeplanner/travelvia") + "</a></div>";
            s += "</div>";
            s += "<div class='maptips_stoplinks_multi_bottom'></div>";

            panel.innerHTML = s;  // panel content

            var mainPanelPos = dojo.position(this.hoverDivId);
            var rowPos = dojo.position(parentRow);
            var panelPos = dojo.position(panelId);
            var mainPanelBottom = mainPanelPos.y + mainPanelPos.h;
            if (rowPos.y + panelPos.h > mainPanelBottom)
                dojo.style(panel, "bottom", "0");  // prevent route links panel to float lower than main info-window
            else
                dojo.style(panel, "top", "0");

            dojo.style(panel, "left", rowPos.w + "px");

            this.prevRouteLinksPanelId = panelId;
        }
    }

    // animates div from mouse klikk (From - To - Via) to corresponding route TextBox and then adds stop to route list
    this.animateAndAddRouteStop = function (srcElementId, stopIndex, isVia, stopName, stopX, stopY, event) {

        if (event) dojo.stopEvent(event);
        gdMapPage.tabManager.showTab("map_tabheader_route");  // make sure route tab is showing

        var srcElement = dojo.byId(srcElementId);
        var animationDiv = dojo.byId("maptips_route_link_animation");
        var destElement = gdMapPage.routePlanner.getRouteStopTextBox(stopIndex);

        animationDiv.innerHTML = stopName;

        var destPos = dojo.position(destElement);
        var srcPos = dojo.position(srcElement);
        var aniPos = dojo.position(animationDiv);

        dojo.fx.slideTo({
            node: animationDiv,
            duration: 1000,
            properties: {
                top: { start: srcPos.y, end: destPos.y },
                left: { start: srcPos.x - aniPos.w * 1.3 - 5, end: destPos.x }
            },
            beforeBegin: function () {
                dojo.removeClass(animationDiv, "maptips_route_link_animation_hidden");
                dojo.addClass(animationDiv, "maptips_route_link_animation_visible");
            },
            onEnd: function () {
                dojo.removeClass(animationDiv, "maptips_route_link_animation_visible");
                dojo.addClass(animationDiv, "maptips_route_link_animation_hidden");
                gdMapPage.routePlanner.addStop(stopIndex, isVia, stopName, stopX, stopY);
            }
        }).play();
    },

    this.addRouteStopLinks = function (div, item) {
        if ((div) && (gdClientData.hasRoutePlanner)) {
            var routeStoplabel = gdGetText("/map/maptips/routestoplinkslabel");
            var routeStopFrom = gdGetText("/map/maptips/routestoplinkfrom");
            var routeStopTo = gdGetText("/map/maptips/routestoplinkto");
            var routeStopVia = gdGetText("/map/maptips/routestoplinkvia");
            div.innerHTML = '<div class="maptips_stoplinks_single">' + routeStoplabel + ' <a href="#" id="maptips_route_from">' + routeStopFrom + '</a> - <a href="#" id="maptips_route_to">' + routeStopTo + '</a> - <a href="#" id="maptips_route_via">' + routeStopVia + '</a></div>';

            this.setupStopLinkEvents(item.name, item.X, item.Y, "maptips_route_from", "maptips_route_to", "maptips_route_via");
        }
    }
    this.setupStopLinkEvents = function (name, x, y, fromId, toId, viaId) {
        var stopCount = gdMapPage.routePlanner._stops.length;

        // clears previous event handlers, only one set (current/visible route links) is needed
        if (this.clickHandlerFrom) dojo.disconnect(this.clickHandlerFrom);
        if (this.clickHandlerTo) dojo.disconnect(this.clickHandlerTo);
        if (this.clickHandlerVia) dojo.disconnect(this.clickHandlerVia);

        this.clickHandlerFrom = dojo.connect(dojo.byId(fromId), "onclick", this, function (event) {
            this.animateAndAddRouteStop(fromId, 0, false, name, x, y, event); // adds departure
        });
        this.clickHandlerTo = dojo.connect(dojo.byId(toId), "onclick", this, function (event) {
            this.animateAndAddRouteStop(toId, stopCount - 1, false, name, x, y, event);  // adds destination 
        });
        this.clickHandlerVia = dojo.connect(dojo.byId(viaId), "onclick", this, function (event) {
            var stopIdx = stopCount - 2;  // second from last
            if (stopCount <= 2)
                stopIdx = stopCount - 1;
            this.animateAndAddRouteStop(viaId, stopIdx, true, name, x, y, event); // adds via stop (index is irrelevant, it will be calculated in routePlanner)
        });
    }

    this.hide = function () {

        var item = this.currentItem;
        this.currentItem = null;
        dojo.style(this.hoverDivId, "visibility", "hidden");
        geodata.maptips.hoverVisible = false;
        return item;
    }

    this.addDiv = function (id, content, left, top, width, height, visible, style) {
        var oDiv = document.createElement("div");
        oDiv.id = id;
        if (left != null) oDiv.style.left = left + "px";
        if (top != null) oDiv.style.top = top + "px";
        if (width != null) oDiv.style.width = width + "px";
        if (height != null) oDiv.style.height = height + "px";
        if (style != null) oDiv.style.cssText += "; " + style;
        if (oDiv.style.position == null) oDiv.style.position = "absolute";
        oDiv.innerHTML = content;
        document.body.appendChild(oDiv);
        if (visible != null) oDiv.style.visibility = visible;
    }

}
// MapTipWindow

