﻿// JScript File
// Javascript for the map selection "mapspots" and "hotspots" - a "mapspot" being a map point with a tooltip
// and a "hotspot" beign a mapspot with the added functionality of highlighting it's corresponding entry in
// the result panel, and being highlighted when the result in the results panel is hovered over.

     var hotspot = new Array();
     var mapspot = new Array();
     //Bluespot is used to denote a point which is part of the current
     //page of results
     var blueSpot = "mapviewerImages/BluePoint.GIF";
     //Redspot denotes the highlighted point on the map when the cursor is
     //positioned over a line in the results grid.
     //(FlashingRedPoint.gif is an animated gif alternating bule and red)
     var redSpot = "mapviewerImages/FlashingRedPoint.gif";
     var yellowSpot = "mapviewerImages/YellowPoint.gif";

     var baseLeftVal;//used to store Bluepoint style.left value
     var baseTopVal;//used to store Bluepoint style.top value
     function postBackHighlights()
     {
        //The initial results page is generated from a post back. This routine "overrides"
        //the ask initialisation functionality in order to correctly sequence events - i.e.
        //the initcontrolHeritage needs to befired before the highlights are added
        //some hotspot params exist
        var mapspotParams = document.getElementById("resultsMap_hfMapspotValues");
        //alert(mapspotParams + ", " + document.getElementById("resultsMap_hfMapspotValues"));
        initcontrolHeritage();
        if (window.detachEvent) {
            window.detachEvent('onload', initcontrolHeritage);
        }
        else {
            window.removeEventListener('load', initcontrolHeritage, false);
        }


                
        if (mapspotParams != null && mapspotParams.value.length > 0)
        {
            //initialize the askComponentManager, and detach the onload event to avoid it being initialized twice.
            var threewaySplit = mapspotParams.value.split('~');
            var xCoords = threewaySplit[0];
            var yCoords = threewaySplit[1];
            var smrsNumbers = threewaySplit[2];
            showAvailableMapspots(xCoords, yCoords, smrsNumbers);
        }
        var hotspotParams = document.getElementById('resultsMap_hfHotspotValues');
        if (hotspotParams != null && hotspotParams.value.length > 0)
        {
            //some hotspot params exist
            //initialize the askComponentManager, and detach the onload event to avoid it being initialized twice.
            var threewaySplit = hotspotParams.value.split('~');
            var xCoords = threewaySplit[0];
            var yCoords = threewaySplit[1];
            var smrsNumbers = threewaySplit[2];
            showAvailableHotspots(xCoords, yCoords, smrsNumbers);
        }
     }
     
     function setGlassTopEvents() 
     {
        //Highlights are hidden while a pan or zoom etc. are executed
        BrowserObj.attachEvents(mapHeritage_MapComp.glassTop, "mousedown", hideHighlights);
     }
     
     function hideHighlights() 
     {
        var j=0;
        for (j=0;j<hotspot.length;j++)
        {
            hotspot[j].hide();
        }
        for (j=0;j<mapspot.length;j++)
        {
            mapspot[j].hide();
        }
     }
     function showHighlights()
     {
        var j=0;
        for (j=0;j<mapspot.length;j++)
        {
            mapspot[j].show();
        }
        for (j=0;j<hotspot.length;j++)
        {
            hotspot[j].show();
        }
     }
    function showAvailableHotspots(xCoords, yCoords, smrsNumbers)
    {
        var mapX = xCoords.split(",");
        var mapY = yCoords.split(",");
        var smrs = smrsNumbers.split("¬");
        var numberOfHotspots = mapX.length;
        var j=0;
        for (j=0;j<numberOfHotspots;j++)
        {
            if (hotspot[j]==null)
            {
                hotspot[j] = new MapHighlight();
            }
            hotspot[j].setSmrs(smrs[j]);
            hotspot[j].setControlName('ctl' + PadNumber(j+1)); //ctl00 is the header, so j+1 is the corresponding line in the repeater control
            hotspot[j].setBaseImage(blueSpot);
            hotspot[j].createImage();
            hotspot[j].setRollovers();
            hotspot[j].setPosition(mapX[j],mapY[j]);
        }
        var deleteCount = hotspot.length - numberOfHotspots;
        for (j=numberOfHotspots;j<hotspot.length;j++)
        {
            //the last page of results can have less than the previous page
            hotspot[j].dispose();
        }
        //remove any additional hotspots left over on the last page
        hotspot.splice(numberOfHotspots,deleteCount);
    }
    function showAvailableMapspots(xCoords, yCoords, smrsNumbers)
    {
        //mapspots don't have mouse rollover functionality, but do contain
        //tooltips 
        var mapX = xCoords.split(",");
        var mapY = yCoords.split(",");
        var smrs = smrsNumbers.split("¬");
        var j=0;
        //alert("mapX.length " + mapX.length);
        for (j=0;j<mapX.length;j++)
        {
            if (mapspot[j]==null)
            {
                mapspot[j] = new MapHighlight();
            }
            mapspot[j].setSmrs(smrs[j]);
            mapspot[j].setBaseImage(yellowSpot);
            mapspot[j].createImage();
            mapspot[j].setPosition(mapX[j],mapY[j]);
        }
    }
    function repositionHighlights(hotXCoords, hotYCoords, mapspotXCoords, mapspotYCoords)
    {
        //This routine is invoked after a paging event
        var mapX = mapspotXCoords.split(",");
        var mapY = mapspotYCoords.split(",");
        var j=0;
        for (j=0;j<mapspot.length;j++)
        {
            mapspot[j].setPosition(mapX[j],mapY[j]);
        }    
        mapX = hotXCoords.split(",");
        mapY = hotYCoords.split(",");
        for (j=0;j<hotspot.length;j++)
        {
            hotspot[j].setPosition(mapX[j],mapY[j]);
        }    
    }
    function highlightResults(controlName)
    {
        //Highlight the corresponding line in the results table
        if (controlName!=undefined && controlName.length>0)
        {
            var theSpan = getResultElements(controlName);
            var j=0;
            for (j=0;j<theSpan.length;j++)
            {
                theSpan[j].style.backgroundColor='#C9D7A6';
            }
         }
    }
    function lowlightResults(controlName)
    {
        if (controlName!=undefined && controlName.length>0)
        {
            var theSpan = getResultElements(controlName);
            var j=0;
            for (j=0;j<theSpan.length;j++)
            {
                theSpan[j].style.backgroundColor='white';
            }
        }
    }
    function highlightImage(controlName)
    {
        var j=0;
        for (j=0;j<hotspot.length;j++)
        {
            if (hotspot[j].controlName == controlName)
            {
                //alert("Control name " + hotspot[j].controlName + ", " + hotspot.length);
                hotspot[j].highlight();
            }
        }
    }
    function lowlightImage(controlName)
    {
        var j=0;
        for (j=0;j<hotspot.length;j++)
        {
            if (hotspot[j].controlName == controlName)
            {
                hotspot[j].lowlight();
            }
        }
    }
    function getResultElements(ctlname)
    {
        //using an array as previously (and perhaps again) multiple elements
        //were being highlighted in the results table.
        var theSpan = new Array();
        theSpan[0] = document.getElementById('resultsMap_repResults_'+ctlname+'_Details').parentNode.parentNode;//parentElement.parentElement;//Firefox doesn't support parentElement
//        theSpan[4] = document.getElementById('resultsMap_repResults_'+ctlname+'_AjaxPanel5$RBS_Holder');
//        theSpan[0] = document.getElementById('resultsMap_repResults_'+ctlname+'_DETAILTABLE');
//        theSpan[0] = document.getElementById('resultsMap_repResults_'+ctlname+'_Map');
        return theSpan;
    }
    function clearHighlights()
    {
        var j=0;
        if(hotspot)
        {
            for (j=0;j<hotspot.length;j++)
            {
                hotspot[j].dispose();
            }
            hotspot = null;
            hotspot = new Array();
        }
        if(mapspot)
        {        
            for (j=0;j<mapspot.length;j++)
            {
                mapspot[j].dispose();
            }
       }
       mapspot = null;
       mapspot = new Array();
    }
    function MapHighlight()
    {
        //The map highlight "object"
        var controlName;
        var baseImg;
        var img;
        var smrs;
        var storeZIndex;
        MapHighlight.prototype.setControlName = function(name)
        {
            this.controlName = name;
        }
        MapHighlight.prototype.getControlName = function()
        {
            return this.controlName;
        }
        MapHighlight.prototype.setBaseImage = function(url)
        {
            this.baseImg = url;
        }
        MapHighlight.prototype.getBaseImage = function()
        {
            return this.baseImg;
        }
        MapHighlight.prototype.setSmrs = function(smrs)
        {
            this.smrs = smrs;
        }
        MapHighlight.prototype.getSmrs= function()
        {
            return this.smrs;
        }
        MapHighlight.prototype.setPosition = function(mapX, mapY)
        {
            var pageX = '-Infinity';
            var pageY = '-Infinity';
            if(typeof(controlHeritage_CompManager) != "undefined")
            {
                pageX = controlHeritage_CompManager.mapObj.getPageX(mapX);
                pageY = controlHeritage_CompManager.mapObj.getPageY(mapY);
                //alert(pageX);
            }
            //alert("controlHeritage_CompManager " + pageX + ",,,," + controlHeritage_CompManager);
            //alert("Img created " + controlHeritage_CompManager);
            if (pageX!='-Infinity' && pageY!='-Infinity')
            {
                offsetLeft = Number(pageX); // Number(offsetLeft) + Number(pageX) + Number(gtoffsetLeft);
                offsetTop = Number(pageY); //Number(offsetTop) + Number(pageY) + Number(gtoffsetTop);
                //the Magic number is 4 - should be half the image width (which should be 10x10) but it ain't!!
                //alert("left " + offsetLeft);
                //alert("left " + offsetTop);
                offsetLeft = offsetLeft - 4;// - (this.img.width/2);
                offsetTop = offsetTop - 4;// - (this.img.height/2);
                //alert("left2 " + offsetLeft);
                //alert("left2 " + offsetTop);                
                this.img.style.left = offsetLeft + 'px'; 
                this.img.style.top = offsetTop + 'px';
                this.img.style.visibility = "visible";
                this.img.setAttribute("alt",this.smrs);
                this.img.setAttribute("title",this.smrs);
                //alert("position created " + this.img.style.left + ", " + this.img.style.top + ", " + this.img.src);
            }
         }
        MapHighlight.prototype.createImage = function()
        {
            if (this.img==null)
            {
                var imgTag = "IMG";
                this.img = document.createElement(imgTag);
                this.img.id = this.controlName + "img";
                this.img.src = this.baseImg;
                this.img.style.position = "absolute";
                //alert("img.style.position " + this.img.style.position);
//                this.img.onclick = function(e) 
//                                   {
//                                        var detButton = document.getElementById("resultsMap$repResults$"+Left(event.srcElement.id,5)+"$Details");
//                                        detButton.click();
//                                     }
//
                if(typeof(controlHeritage_CompManager) != "undefined")
                    controlHeritage_CompManager.mapObj.glassTop.appendChild(this.img);
            }
        }
        MapHighlight.prototype.setRollovers = function()
        {
            //changed from event to e
            this.img.onmouseover = function(e) {
                if(typeof(window.event) != "undefined")
                    e = window.event;
                if(typeof(e.srcElement) != "undefined")
                    highlightResults(Left(e.srcElement.id,5));
                else
                    highlightResults(Left(e.target.id,5));
            } 
            this.img.onmouseout = function(e) {
                if(typeof(window.event) != "undefined")
                    e = window.event; //for IE
                if(typeof(e.srcElement) != "undefined")
                    lowlightResults(Left(e.srcElement.id,5));
                else
                    lowlightResults(Left(e.target.id,5));
            } 
        }
        
        MapHighlight.prototype.highlight = function()
        {
            if (this.img!=null)
            {
            
                this.img.src = redSpot;
                storeZIndex = this.img.style.zIndex;
                this.img.style.zIndex = 200;
                baseLeftVal = this.img.style.left;
                baseTopVal = this.img.style.top;
                var redSpotLeft = Left(this.img.style.left, (this.img.style.left.length - 2));
                var redSpotTop = Left(this.img.style.top, (this.img.style.top.length - 2));
                this.img.style.left = Number(redSpotLeft) - 4 + 'px';
                this.img.style.top = Number(redSpotTop - 4) + 'px';
                //alert("highlight " + this.img.style.left + ", " + this.img.style.top + ", " + this.img.height + ", " + this.img.width);
                this.img.height = 17;
                this.img.width = 17;
                //alert("ht " + this.img.style.left + ", " + this.img.height + ", " + this.img.width);
                //alert("red spot " + redSpotLeft + ", " + redSpotTop + ", " + this.img.style.left.length + ", " + this.img.style.top + "htwid " + this.img.height + ", " + this.img.width);
            }
        }
        MapHighlight.prototype.lowlight = function()
        {
            if (this.img!=null)
            {
                this.img.src = this.baseImg;
                if(typeof(baseLeftVal) != "undefined")
                {
                    this.img.style.left = baseLeftVal;
                    this.img.style.top = baseTopVal;
                }
                this.img.height = 10;//because base image ht and wid = 10
                this.img.width = 10;
                this.img.style.zIndex = storeZIndex;  
                //alert("lowlight ");
            }
        }
        MapHighlight.prototype.hide = function()
        {
            this.img.style.visibility = 'hidden';
        }
        MapHighlight.prototype.show = function()
        {
            this.img.style.visibility = 'visible';
        }
        MapHighlight.prototype.dispose = function()
        {
            var imgId = this.controlName + "img";
            var removeImg = document.getElementById(imgId);
            controlHeritage_CompManager.mapObj.glassTop.removeChild(removeImg);
        }
    }
    
    function Left(str, n)
    {
	    if (n <= 0)
	    {
	        return "";
	    }
	    else 
	    {   
	        if (n > String(str).length)
	        {
	            return str;
	        }
	        else
	        {
	            return String(str).substring(0,n);
	        }
	     }
	}
    function PadNumber(j)
    {
        //numbers from 0 to 9 are 0 padded to 2 digits, e.g. 05,08 etc.
        var paddedNumber;
        if (j<10)
        {
            paddedNumber = "0" + j;
        }
        else
        {
            paddedNumber = j;
        }
        return paddedNumber;
    }
