﻿/*
	MrkGrp.js
	created by Scott Matthewman <scott@matthewman.net>
	for The Stage Newspaper Limited
	(c) 2005 The Stage Newspaper Limited

	Released under the GNU General Public License (http://www.gnu.org/copyleft/gpl.html). 
	You are free to use, modify and generally do what you will with this code, for either
	commercial or non-commercial products. About the only thing you shouldn't do with it 
	is claim that you wrote it. That'd just be mean.
	
	Feedback of any sort is much appreciated, to scott@matthewman.net
	
	Change history:
 	08-Jul-05 	Initial build
 	
*/
function MarkerGroup(googlemap, icon) {
try
{
        // private member variables
        var _googleMap = null;
        var _markerIcon = null;
        var _markersVisible = false;
        var _markers = new Array();

        function getGoogleMap() {
	        return _googleMap;
        }
        function setGoogleMap(parameter) {
            _googleMap = parameter;
            
            GEvent.addListener(_googleMap, 'moveend', displayOrHideMrks);
        }

        function getMrkIcon() {
	        return _markerIcon;
        }
        function setMrkIcon(parameter) {
	        _markerIcon = parameter;
        }

        function getMrksVisible() {
	        return _markersVisible;
        }
        function setMrksVisible(parameter) {
	        _markersVisible = parameter;
	        displayOrHideMrks();
        }
        function tgMrksVisible() {
	        _markersVisible = !_markersVisible;
	        displayOrHideMrks();
        }

        /*
        * Get rid of all the objects and pointers while we are at it.
        */
        function Dispose(boolDispose) {

            if (boolDispose) {
                try {
                    for (i = 0; i < _markers.length; i++) {
                        _markers[i] = null;
                    }
                    _markers = null;
                    _markerIcon = null;
                    _googleMap = null;
                    this.getGoogleMap = null; this.getMrkIcon = null;
                    this.getMrksVisible = null; this.setMrksVisible = null; 
                    this.tgMrksVisible = null;this.createMrk = null;  this.Dispose = null;
                } catch (e) { }
            }
        }

        ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
        //
        //
        //  Purpose:
        //      This is used to create and initialize a GMarker object. It will then store the object in a list. This list will be used
        //      to display or hide markers that can be viewed in the google map.
        //
        //  Parameters:
        //      theZoomLevelThreshold:
        //          This is the zoom level that the GMarker object will be visible.
        //
        //
        /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
        function createMrk(type,longitude, latitude, html1,html2,html3, html4, title,id,direction,url, theZoomLevelThreshold) {

            try
           { 
	            gpt = new GPoint(longitude, latitude);
	            mkr = new GMarker(gpt, _markerIcon,false);
	            mkr.attached = false;
        	    
	            mkr.infoHtml1 = html1;
	            mkr.infoHtml2 = html2;
	            mkr.infoHtml3 = html3;
	            mkr.infoHtml4 = html4;
        	    
	            mkr.streaming=false;
	            mkr.title=title;
	            mkr.type=type;
	            mkr.id=id;
	            mkr.direction=direction;
	            mkr.url = url;
	            //the marker needs handlers for events
	            //the event has to be added on show and removed on hide
	            //else the tool tip will not show after the tg show-hide-show
	            //it will show on the first show tg
	            //events are added in displayOrHideMrks()
	            mkr.theHandler1=null;
	            mkr.theHandler2=null;
	            mkr.theHandler3 = null;

	            // Set the threshold in which the marker will be displayed.
	            mkr.zoomLevelDisplayThreshold = theZoomLevelThreshold;

	            _markers.push(mkr);
	            mkr = null;
	        }
	        catch(e)
	        {
	            alert(e.message + " - createMrk" );
	        }
        }

        function displayOrHideMrks() {
        
	        try
	        {
	            //bounds = _googleMap.getBounds();
	            var bounds = getViewBoundary();
		        var NE=bounds.getNorthEast();
		        var SW=bounds.getSouthWest();
		        var maxX=NE.lng();
		        var maxY=NE.lat();
		        var minX=SW.lng();
		        var minY=SW.lat();
		        var markersList = [];
		        var mapZoomLevel = _googleMap.getZoom();
		        
		        for (i = 0; i < _markers.length; i++) {

		            var markerZoomLevelDisplayThreshold = _markers[i].zoomLevelDisplayThreshold;

		            if (_markersVisible) {

		                var pt = _markers[i].getPoint();
		                var ptX = pt.lng();
		                var ptY = pt.lat();
		                if (ptX >= minX && ptX <= maxX && ptY >= minY && ptY <= maxY && markerZoomLevelDisplayThreshold <= mapZoomLevel && _markers[i].attached == false) {
		                    _markers[i].theHandler1 = GEvent.addListener(_markers[i], "mouseover", openInfoWindow);
		                    if (_markers[i].type == "Camera")
		                        _markers[i].theHandler2 = GEvent.addListener(_markers[i], "click", DisplayCamera);
		                    if (_markers[i].type == "Sign")
		                        _markers[i].theHandler2 = GEvent.addListener(_markers[i], "click", DisplaySign);

		                    _markers[i].theHandler3 = GEvent.addListener(_markers[i], "mouseout", closeInfoWindow);

		                    _markers[i].attached = true;

		                    _googleMap.addOverlay(_markers[i]);
		                }
		                else if ((ptX < minX || ptX > maxX || ptY < minY || ptY > maxY || markerZoomLevelDisplayThreshold > mapZoomLevel) && _markers[i].attached == true) {

		                    // If the marker is outside of the boundary then remove it from the map. This is an optimization in order to minimize the number of
		                    // markers on the map.
		                    detachMarker(_markers[i]); _markers.clicked = false;
		                }		                
		            }
		            else {
		                if (_markers[i].attached) {
		                    detachMarker(_markers[i]);_markers.clicked = false;
		                }
		            }
		        }		    
	        }
	        catch(e)
	        {
		        var sErr=e.message;
	        }
	    }

	    /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	    //
	    //
	    //  Purpose:
	    //      This method is used to remove a marker from the google map. It will also clean up any resources associated
	    //      with the map.
	    //
	    //  Parameters:
	    //      This is the marker that is going to be removed from the map.
	    //
	    //
	    //
	    //
	    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	    function detachMarker(theMarker) {

	        if (theMarker.theHandler1 != null) {
	            GEvent.removeListener(theMarker.theHandler1);
	            _markers[i].theHandler1 = null;
	        }

	        if (theMarker.theHandler2 != null) {
	            GEvent.removeListener(theMarker.theHandler2);
	            theMarker.theHandler2 = null;
	        }

	        if (theMarker.theHandler3 != null) {
	            GEvent.removeListener(theMarker.theHandler3);
	            theMarker.theHandler3 = null;
	        }

	        _googleMap.removeOverlay(theMarker);
	        theMarker.attached = false;

	    }

	    ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	    //
	    //
	    //  Purpose:
	    //      This method is used to get the boundaries for displaying markers on the map. This will be an area larger than the google map area
	    //      in order to take into account that some drag operations will occur.
	    //
	    //  Return Value:
	    //      This holds the boundaries that the markers will be displayed for. This is the view area for the google map plus a margin around the
	    //      google map area so that marker refreshes are not as noticable.
	    //
	    ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	    function getViewBoundary() {
	        var retVal = null;

	        var marginAroundMap = 0.125;

	        var mapBounds = _googleMap.getBounds();

	        var southWest = mapBounds.getSouthWest();
	        var northEast = mapBounds.getNorthEast();

	        var deltaX = northEast.lng() - southWest.lng();
	        var deltaY = northEast.lat() - southWest.lat();

	        deltaX *= marginAroundMap;
	        deltaY *= marginAroundMap;

	        var southWestLat = southWest.lat() - deltaY;
	        var southWestLng = southWest.lng() - deltaX;
	        var northEastLat = northEast.lat() + deltaY;
	        var northEastLng = northEast.lng() + deltaX;

	        var adjustedSouthWest = new GLatLng(southWestLat, southWestLng, true);
	        var adjustedNorthEast = new GLatLng(northEastLat, northEastLng, true);

	        retVal = new GLatLngBounds(adjustedSouthWest, adjustedNorthEast);

	        return retVal;

	    }

        function DisplayCamera()
        {
            if(!_upDating)
	        {
	              try
	                   {
	                       DisplayCameraOnDashBoard(this.id, this.dir, this.title, -1, -1, this.url);
	                    }
	                   catch(e)
	                   {
	                        alert(e.message + " - openCmWin");
	                   }      
	        }
        }

        function DisplaySign()
        {
            if(!_upDating)
	        {
	              try
	                   { 
	                        DisplaySignOnDashBoard(this.id,this.dir,this.title, - 1, -1);
	                    }
	                   catch(e)
	                   {
	                        alert(e.message + " - DisplaySign()");
	                   }      
	        }
        }
        function openInfoWindow() 
        {
	        try
	        {
	            if (!_upDating) {
        	    
	                if(this.type=="Camera") {
                        
                        //Why should we do something else for Safari?
	                    if (BrowserDetect.browser == "Safari") {
	                        
	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=150><tr><td class=cellsigndescription>" + this.title + "</td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();
	                        
	                    } else {
	                        showtip("<table cellpadding=0 cellspacing=0 width=150><tr><td class=cellsigndescription>" + this.title + "</td></tr></table>");
	                    }
	                   
	                   
	                    //showtip("<p class=pCameras><span align=center style=font-size:10px;font-family:Verdana;color:#000000;font-weight:bold;>" + this.title + "</span></p>");
	                    //showtip("<p class=pCameras><span align=center style=font-size:10px;font-family:Verdana;color:#000000;font-weight:bold;>" + this.id + ' -  ' + this.title + "</span></p><p class=pCameras><img style=border:1px solid #000000; width=320 height=240 src=\\\"" + this.url + "\\\"></p>");
	                    //showtip("<p class=pCameras><span align=center style=font-size:10px;font-family:Verdana;color:#000000;font-weight:bold;>" + this.id + ' -  ' + this.title + "</span></p>");
	                }
            		
	                if(this.type=="Sign"){

        //		            var url = "images/animated/" + this.id + '-' + this.title + ".gif";
        //		            fileExists(url); //verify if the file existssorry 

        //		            if (getStatus() != true) {
        //		                url = "images/default.gif";
        //		            }
	                    if (BrowserDetect.browser == "Safari") {

	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=180><tr><td class=cellsigndescription>" + this.title + "</td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();

	                    } else {
	                        showtip("<table cellpadding=0 cellspacing=0 width=180><tr><td class=cellsigndescription>" + this.title + "</td></tr></table>");
	                    }
	                    
	                                      
	                    //showtip("<table cellpadding=0 cellspacing=0 width=250><tr><td class=cellsigndescription>" + this.title + "</td></tr></table>");

	                    //showtip("<table cellpadding=0 cellspacing=0 width=250><tr><td class=cellsigndescription>" + this.id + ' -  ' + this.title + "</td></tr></table>"); showtip("<table cellpadding=0 cellspacing=0 width=250><tr><td class=cellsigndescription>" + this.id + ' -  ' + this.title + "</td></tr></table>");
        	            
	    	            //showtip("<table cellpadding=0 cellspacing=0 width=250><tr><td class=cellsigndescription>" + this.id + ' -  ' + this.title + "</td></tr><tr><td class=cellMsgSign><img style=border:1px solid #000000; width=350 height=200 src=\\\"" + url + "\\\" ></td></tr></table>");
	                }

	                if (this.type == "Event") {

	                    if (BrowserDetect.browser == "Safari") {

	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr align=center ><td> " + this.infoHtml1 + " </td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td> Anticipated Impact: " + this.url + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();

	                    } else {
	                        showtip("<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr align=center ><td> " + this.infoHtml1 + " </td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td> Anticipated Impact: " + this.url + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>");
	                    }
	                }
        	        
        	        if(this.type == "PlannedEvent"){
        	            if (BrowserDetect.browser == "Safari") {

        	                var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr align=center ><td> " + this.infoHtml1 + " </td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>", 4);
        	                this.tooltip = tooltip;
        	                _googleMap.addOverlay(tooltip);
        	                this.tooltip.show();

        	            } else {
        	                showtip("<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr align=center ><td> " + this.infoHtml1 + " </td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>");
        	            }
	                }

	                if (this.type == "Construction") {
	                    if (BrowserDetect.browser == "Safari") {

	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.infoHtml1 + " </font></td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();

	                    } else {
	                        showtip("<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.infoHtml1 + " </font></td></tr><tr><td>Direction: " + this.direction + " </td></tr><tr><td>Lanes Impacted: " + this.infoHtml3 + " </td></tr><tr><td> End Date: " + this.infoHtml4 + " </td></tr><tr><td>Last Updated: " + this.infoHtml2 + "</td></tr></table>");
	                    }
	                }

	                if (this.type == "Flashing" || this.type == "NonFlashing") {

	                    if (BrowserDetect.browser == "Safari") {

	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr><td> Road Surface: " + this.id + " </td></tr><tr><td>Weather: " + this.direction + " </td></tr><tr><td>Restrictions: " + this.infoHtml1 + " </td></tr><tr><td>Last Updated: " + this.infoHtml4 + " </td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();

	                    } else {
	                        showtip("<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr><td> Road Surface: " + this.id + " </td></tr><tr><td>Weather: " + this.direction + " </td></tr><tr><td>Restrictions: " + this.infoHtml1 + " </td></tr><tr><td>Last Updated: " + this.infoHtml4 + " </td></tr></table>");
	                    }
	                }

	                if (this.type == "GrayNoReading") {
	                    //Why should we do something else for Safari?
	                    if (BrowserDetect.browser == "Safari") {

	                        var tooltip = new Tooltip(this, "<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr><td> No Report </td></tr><tr><td>Last Updated: " + this.infoHtml4 + " </td></tr></table>", 4);
	                        this.tooltip = tooltip;
	                        _googleMap.addOverlay(tooltip);
	                        this.tooltip.show();

	                    } else {
	                    showtip("<table cellpadding=0 cellspacing=0 width=250 style=background-color:#FFFBD0 ><tr><td class=cellsigndescription><font size=2>" + this.title + " </font></td></tr><tr><td> No Report </td></tr><tr><td>Last Updated: " + this.infoHtml4 + " </td></tr></table>");
	                    }
	                }
	                if(this.type=="Spd")
	                {
	                    //showtip("<table cellpadding=0 cellspacing=0 ><tr><td class=tdDevName  align=center>" + this.title + "</td></tr><tr><td class=tdTTTxt>" + this.infoHtml1 + " MPH<br>" + _spdDT + "</td></tr></table>");
	                }
	             }   
	        }
	        catch(e)
	        {
	            alert(e.message + e.source + " - openInfoWindow");
	        }
        }

        function closeInfoWindow() {

            if (BrowserDetect.browser == "Safari") {
                _googleMap.removeOverlay(this.tooltip);
                this.tooltip.hide();
            } else {
                hidetip();
            }
            
        }

    }//Object is encapsulated in try and catch block
        
	catch(e)
	{
	    alert(e.message);
	}
	
	
	setGoogleMap(googlemap);
	setMrkIcon(icon);

	
	// public method pointers
	this.getGoogleMap      = getGoogleMap; // setGoogleMap is private
	this.getMrkIcon        = getMrkIcon; // setMrkIcon is private
	this.getMrksVisible    = getMrksVisible;
	this.setMrksVisible    = setMrksVisible;
	this.tgMrksVisible     = tgMrksVisible;
	this.createMrk         = createMrk;
	this.Dispose           = Dispose;
}


/* VERY IMPORTANT - DONT DELETE THIS EVEN WHEN COMMENTED
Ajax request to the server if url or an image exists
//*/
//var httpObj = null;

//function fileExists(url) {
//    httpObj = GetXmlHttpObject();
//    if (httpObj) {
//        httpObj.onreadystatechange = getStatus;
//        httpObj.open("HEAD", url, false); //pass only true, when calling asynchronously, false for synchronous commands
//        httpObj.send("");
//    }
//}

//function getStatus() {
//    if (httpObj.readyState == 4) {
//        if (httpObj.status == 200) {
//            return true;
//        }
//        else {
//            return false;
//        }
//    }
//}
//function GetXmlHttpObject() {
//    var xmlHttp = null;
//    try {
//        // Firefox, Opera 8.0+, Safari
//        xmlHttp = new XMLHttpRequest();
//    }
//    catch (e) {
//        // Internet Explorer
//        try {
//            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
//        }
//        catch (e) {
//            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
//        }
//    }
//    return xmlHttp;
//} 

