function toggleIncidents()
{ 		

	if(document.legendForm.checkbox_incidents.checked == false)
	{	
		IncidentsMgr.clearMarkers();
	}
	else
	{	
		drawIncidents();
	}
	document.getElementById("loading").style.display  = "none";
}


function toggleCameras()
{ 		

	if(document.legendForm.checkbox_cameras.checked == false)
	{	
		CamerasMgr.clearMarkers();
	}
	else
	{	
		drawCameras();
	}
	document.getElementById("loading").style.display  = "none";
}


function toggleCMS()
{ 		

	if(document.legendForm.checkbox_cms.checked == false)
	{	
		CMSMgr.clearMarkers();
	}
	else
	{	
		drawCMS();
	}
	
	document.getElementById("loading").style.display  = "none";

}


function drawIncidents()
{

		document.getElementById("loading").style.display  = "block";

	   var batch = [];

	//draw incidents
	//this creates the point icon
	var baseIcon = new GIcon();
        baseIcon.shadow = "http://map.commuteview.net/images/incidentshadow.png";
        baseIcon.iconSize = new GSize(18, 20);
        baseIcon.shadowSize = new GSize(38, 30);
        baseIcon.iconAnchor = new GPoint(9, 20);
        baseIcon.infoWindowAnchor = new GPoint(9, 2);
        baseIcon.infoShadowAnchor = new GPoint(0, 0);


 




		function createMarker(point,type,html,intId) {

			//this controls the image that is used for a point
			var icon = new GIcon(baseIcon);
			if(type == "3")
            			icon.image = "http://map.commuteview.net/images/incident3.gif";
			else if(type == "11")
            			icon.image = "http://map.commuteview.net/images/incident11.gif";
           	 	else
            			icon.image = "http://map.commuteview.net/images/incident.gif";

			var marker = new GMarker(point,icon);
			//var marker = new GMarker(point);
			GEvent.addListener(marker, "click", function() {
			//this is what is displayed in the callout box after a point is clicked on
			marker.openInfoWindowHtml(html);

						moveWanted = 0;
						WaitandTurnOffMoveWanted();


			});

			//gmarkers[i] = marker;
			//htmls[i] = html ;
			//i++;

			return marker;
		}


		// This function picks up the click and opens the corresponding info window
		function myclick(i) {
			gmarkers[i].openInfoWindowHtml(htmls[i]);
		}


	randomNum = Math.floor(Math.random()*10000000);

	if(testEnvironment == 1)
		var IncdientsUrl = "./data/Incidents.xml?" + randomNum.toString();
	else
		var IncdientsUrl = "http://map.commuteview.net/data/Incidents.xml?" + randomNum.toString();

		//This gets the request from
		var request = GXmlHttp.create();
		//request.open("GET", "http://map.commuteview.net/data/Incidents.xml", true);
		request.open("GET", IncdientsUrl, true);


	      request.onreadystatechange = function() {


				if (request.readyState == 4) {
					var xmlDoc = request.responseXML;

					// obtain the array of markers and loop through it
					var markers = xmlDoc.documentElement.getElementsByTagName("Points");

					var bounds3 = new GLatLngBounds();
					bounds3 = map.getBounds();



					for (var i = 0; i < markers.length; i++) {

					var lat = parseFloat(markers[i].getElementsByTagName("LAT")[0].childNodes[0].nodeValue);
					var lng = parseFloat(markers[i].getElementsByTagName("LON")[0].childNodes[0].nodeValue);

					var point = new GLatLng(lat,lng);

						if((bounds3.containsLatLng(point) && filterMarkers == 1) ||  filterMarkers == 0)
						{

								var title = markers[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
								var location = markers[i].getElementsByTagName("LOCATION")[0].childNodes[0].nodeValue;
								var startTime = markers[i].getElementsByTagName("START")[0].childNodes[0].nodeValue;
								var endTime = markers[i].getElementsByTagName("END")[0].childNodes[0].nodeValue;
								var IncType = markers[i].getElementsByTagName("TYPE")[0].childNodes[0].nodeValue;


								var html = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" width=\"225\"><tr><td class=\"bodytext\"><div width=\"150\" align=\"left\" class=\"bodytext\"><STRONG>" + title + "</STRONG><BR>" + location + "<BR>Start Time: " + startTime + "<BR>Last Updated: " + endTime +"</div></td></tr></table>";

								// create the marker

								var marker = createMarker(point,IncType,html,title);

 
								batch.push(marker);



						}


					}
					
					IncidentsMgr.addMarkers(batch,8);
					IncidentsMgr.refresh();
					marker = null;
				}
	      }



      request.send(null);

}




 

function drawCMS()
{
		document.getElementById("loading").style.display  = "block";


	   var batch = [];

	//draw incidents
	//this creates the point icon
		var baseIcon = new GIcon();
        baseIcon.shadow = "http://map.commuteview.net/images/cmsshadow.png";
        baseIcon.iconSize = new GSize(18, 20);
        baseIcon.shadowSize = new GSize(38, 30);
        baseIcon.iconAnchor = new GPoint(9, 10);
        baseIcon.infoWindowAnchor = new GPoint(9, 2);
        baseIcon.infoShadowAnchor = new GPoint(0, 0);

		function createMarker(point,html,intId) {

			//this controls the image that is used for a point
			var icon = new GIcon(baseIcon);
            		icon.image = "http://map.commuteview.net/images/cms.gif";

			var marker = new GMarker(point,icon);
			//var marker = new GMarker(point);
			GEvent.addListener(marker, "click", function() {
			//this is what is displayed in the callout box after a point is clicked on
			//marker.openInfoWindowHtml("<table bgcolor='#1a1a1a' cellpadding='5' cellspacing='5'><tr><td><font face='tahoma' size='1' color='#f2e406'>" + html + "</td></tr></table>");
			marker.openInfoWindowHtml(html);

						moveWanted = 0;
						WaitandTurnOffMoveWanted();


			});



			return marker;
		}


		// This function picks up the click and opens the corresponding info window
		function myclick(i) {
			gmarkers[i].openInfoWindowHtml(htmls[i]);
		}


	randomNum = Math.floor(Math.random()*10000000);

	if(testEnvironment == 1)
		var IncdientsUrl = "./data/Cms.xml?" + randomNum.toString();
	else
		var IncdientsUrl = "http://map.commuteview.net/data/Cms.xml?" + randomNum.toString();

		//This gets the request from
		var request = GXmlHttp.create();
		//request.open("GET", "http://map.commuteview.net/data/Cms.xml", true);
		request.open("GET", IncdientsUrl, true);


	      request.onreadystatechange = function() {

				if (request.readyState == 4) {
					var xmlDoc = request.responseXML;

					// obtain the array of markers and loop through it
					var markers = xmlDoc.documentElement.getElementsByTagName("Points");

					var bounds3 = new GLatLngBounds();
					bounds3 = map.getBounds();



					for (var i = 0; i < markers.length; i++) {
					

					var lat = parseFloat(markers[i].getElementsByTagName("LAT")[0].childNodes[0].nodeValue);
					var lng = parseFloat(markers[i].getElementsByTagName("LON")[0].childNodes[0].nodeValue);

					var point = new GLatLng(lat,lng);

								if((bounds3.containsLatLng(point) && filterMarkers == 1) ||  filterMarkers == 0)
								{

								
								
								var message = markers[i].getElementsByTagName("MESSAGE")[0].childNodes[0].nodeValue;
								var message2 = markers[i].getElementsByTagName("MESSAGE2")[0].childNodes[0].nodeValue;
								var message3 = markers[i].getElementsByTagName("MESSAGE3")[0].childNodes[0].nodeValue;
								
								if(message == "none") 	message = "";
								if(message2 == "none") 	message2 = "";
								if(message3 == "none") 	message3 = "";
								
								var location = markers[i].getElementsByTagName("LOCATION")[0].childNodes[0].nodeValue;




								message = trim(message);

								var intIndexOfMatch = message.indexOf( " " );

								while (intIndexOfMatch != -1){

									message = message.replace( " ", "&nbsp;" )
									intIndexOfMatch = message.indexOf( " " );
								}

								var intIndexOfMatch = message.indexOf( "newline" );

								while (intIndexOfMatch != -1){

									message = message.replace( "newline", "<br />" )
									intIndexOfMatch = message.indexOf( "newline" );
								}








								message2 = trim(message2);

								var intIndexOfMatch = message2.indexOf( " " );

								while (intIndexOfMatch != -1){

									message2 = message2.replace( " ", "&nbsp;" )
									intIndexOfMatch = message2.indexOf( " " );
								}

								var intIndexOfMatch = message2.indexOf( "newline" );

								while (intIndexOfMatch != -1){

									message2 = message2.replace( "newline", "<br />" )
									intIndexOfMatch = message2.indexOf( "newline" );
								}







								message3 = trim(message3);

								var intIndexOfMatch = message3.indexOf( " " );

								while (intIndexOfMatch != -1){

									message3 = message3.replace( " ", "&nbsp;" )
									intIndexOfMatch = message3.indexOf( " " );
								}

								var intIndexOfMatch = message3.indexOf( "newline" );

								while (intIndexOfMatch != -1){

									message3 = message3.replace( "newline", "<br />" )
									intIndexOfMatch = message3.indexOf( "newline" );
								}








								if(message != "" && message2 != ""  && message3 != "")
									var html = "<table width=\"200\" bgcolor=\"#1a1a1a\"  height=\"73\" cellpadding=\"12px\" border=\"0\" class=\"cms\"><tr><td class=\"cms-text\" valign=\"top\"><div id=\"message1\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message + "</STRONG></font></div><div id=\"message2\" style=\"display:none;\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message2 + "</STRONG></font></div><div id=\"message3\"  style=\"display:none;\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message3 + "</STRONG></font></div></td></tr></table><p class=\"timestamp\"><font face='tahoma' size='1' color='#909090'>CMS located " + location + "</p>";

								else if(message != "" && message2 != "")
									var html = "<table width=\"200\" bgcolor=\"#1a1a1a\"  height=\"73\" cellpadding=\"12px\" border=\"0\" class=\"cms\"><tr><td class=\"cms-text\" valign=\"top\"><div id=\"message1\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message + "</STRONG></font></div><div id=\"message2\" style=\"display:none;\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message2 + "</STRONG></font></div></td></tr></table><p class=\"timestamp\"><font face='tahoma' size='1' color='#909090'>CMS located " + location  + "</p>";

								else if(message != "")
									var html = "<table width=\"200\" bgcolor=\"#1a1a1a\"  height=\"73\" cellpadding=\"12px\" border=\"0\" class=\"cms\"><tr><td class=\"cms-text\" valign=\"top\"><div id=\"message1\"><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message + "</STRONG></font></div></td></tr></table><p class=\"timestamp\"><font face='tahoma' size='1' color='#909090'>CMS located " + location  + "</p>";




								//var html = "<div align=\"left\" class=\"bodytext\"><table width=\"175\" bgcolor=\"#1a1a1a\" cellpadding=\"5\" cellspacing=\"5\"><tr><td><font face='tahoma' size='1' color='#f2e406'><STRONG>" + message + "</STRONG></font></td></tr></table><BR><font face='tahoma' size='1' color='#909090'>CMS located " + location + "</div>";

								var marker = createMarker(point,html,message);
								batch.push(marker);
								
								 
									
									
								}

					}
					CMSMgr.addMarkers(batch,8);
					CMSMgr.refresh();
					marker = null;

				}
	      }



      request.send(null);

}



 

  


function drawCameras()
{

		document.getElementById("loading").style.display  = "block";

	   var batch = [];

	var baseIcon = new GIcon();
        baseIcon.shadow = "http://map.commuteview.net/images/incidentshadow.png";
        baseIcon.iconSize = new GSize(18, 20);
        baseIcon.shadowSize = new GSize(38, 30);
        baseIcon.iconAnchor = new GPoint(9, 20);
        baseIcon.infoWindowAnchor = new GPoint(9, 2);
        baseIcon.infoShadowAnchor = new GPoint(0, 0);







	function createMarker(point,type,html,intId, location) {

	//this controls the image that is used for a point
	var icon = new GIcon(baseIcon);
        icon.image = "http://map.commuteview.net/images/cameras.gif";




			var marker = new GMarker(point,icon);
			//var marker = new GMarker(point);

			marker.tooltip = '<div class="tooltip">'+location+'<\/div>';


			GEvent.addListener(marker, "click", function() {
			//this is what is displayed in the callout box after a point is clicked on
			marker.openInfoWindowHtml("<font face='tahoma' size='1' color='#666666'>" + html);

						moveWanted = 0;
						WaitandTurnOffMoveWanted();


			});



				//***********Tooltip
			 	GEvent.addListener(marker,"mouseover", function() {
				  showTooltip(marker);
				});
				GEvent.addListener(marker,"mouseout", function() {
				tooltip.style.visibility="hidden"
				});




			return marker;
		}


		// This function picks up the click and opens the corresponding info window
		function myclick(i) {
			gmarkers[i].openInfoWindowHtml(htmls[i]);
		}


	randomNum = Math.floor(Math.random()*10000000);

	//var IncdientsUrl = "http://map.commuteview.net/data/Cameras.xml?" + randomNum.toString();
	if(testEnvironment == 1)
		var IncdientsUrl = "./data/Cameras.xml?" + randomNum.toString();
	else
		var IncdientsUrl = "http://map.commuteview.net/data/Cameras.xml?" + randomNum.toString();


		//This gets the request from
		var request = GXmlHttp.create();
		//request.open("GET", "http://map.commuteview.net/data/Incidents.xml", true);
		request.open("GET", IncdientsUrl, true);


	      request.onreadystatechange = function() {


				if (request.readyState == 4) {
					var xmlDoc = request.responseXML;

					// obtain the array of markers and loop through it
					var markers = xmlDoc.documentElement.getElementsByTagName("Points");

					var bounds3 = new GLatLngBounds();
					bounds3 = map.getBounds();



					for (var i = 0; i < markers.length; i++) {

					var lat = parseFloat(markers[i].getElementsByTagName("LAT")[0].childNodes[0].nodeValue);
					var lng = parseFloat(markers[i].getElementsByTagName("LON")[0].childNodes[0].nodeValue);

					var point = new GLatLng(lat,lng);

						if((bounds3.containsLatLng(point) && filterMarkers == 1) ||  filterMarkers == 0)
						{






								var title = markers[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
								var location = markers[i].getElementsByTagName("LOCATION")[0].childNodes[0].nodeValue;
								var urlCamera = markers[i].getElementsByTagName("URL")[0].childNodes[0].nodeValue;
								var isStatic = markers[i].getElementsByTagName("STATIC")[0].childNodes[0].nodeValue;
								var url = "";





								if(isStatic==1) {

								randomNum = Math.floor(Math.random()*10000000);
								url = url + "<CENTER>";
								url = url + location;
								url = url + "<TABLE width=\"352\" height=\"288\" style='width:352px; height:288px;' cellpadding='0' cellspacing='0' border='0'>";
								url = url + "<TR>";
								url = url + "<TD valign=\"middle\" style='width:352px; height:288px;'>";
								url = url + "<img id='camera"+randomNum.toString()+"' src='"+urlCamera+"?"+ randomNum.toString()+"' alt='' border='0' width='268' />";
								url = url + "</TD>";
								url = url + "</TR>";
								url = url + "</TABLE>";
								url = url + "</CENTER>";
								} else {
								url = url + "<CENTER>";
								url = url + location;
								url = url + "<TABLE width=\"100\" height=\"100%\">";
								url = url + "<TR>";
								url = url + "<TD valign=\"middle\">";
								url = url + "<object id=\"MediaPlayer1\" width=\"280\" height=\"200\" classid=\"CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95\" codebase=\"http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701\"  standby=\"Loading Microsoft? Windows? Media Player components...\" type=\"application/x-oleobject\" align=\"middle\">";
								url = url + "<param name=\"FileName\" value=\"" + urlCamera + "\">";
								url = url + "<param name=\"ShowStatusBar\" value=\"true\">";
								url = url + "<param name=\"showControls\" value=\"false\">";
								url = url + "<param name=\"AutoStart\" value=\"true\">";
								url = url + "<param name=\"DefaultFrame\" value=\"mainFrame\">";
								url = url + "<embed type=\"application/x-mplayer2\" pluginspage = \"http://www.microsoft.com/Windows/MediaPlayer/\" src=\"" + urlCamera + "\" align=\"middle\" width=\"280\" height=\"200\" defaultframe=\"rightFrame\" showStatusbar=\"true\" showControls=\"false\"></embed>";
								url = url + "</object>";
								url = url + "</TD>";
								url = url + "</TR>";
								url = url + "</TABLE>";
								url = url + "</CENTER>";

								}
							


 


								var html = "<div  align=\"left\" class=\"bodytext\">" + url + "</div>";
								var marker = createMarker(point,title,html,title,location);
								batch.push(marker);
								
								
								
								


						 
									
						}


					}
					CamerasMgr.addMarkers(batch,8);
					CamerasMgr.refresh();
					marker = null;

					document.getElementById("loading").style.display  = "none";

				}
	      }



      request.send(null);

}




function changeCMS() {


	if(document.getElementById("message2") == null && document.getElementById("message3") == null)
	{
		numberCMSMessages = 1;
	}

	else if(document.getElementById("message3") == null)
	{
		numberCMSMessages = 2;
		changeCMSwith2();
	}
	else
	{
		numberCMSMessages = 3;
		changeCMSwith3();
	}

}



function changeCMSwith3() {
	if(currentCMSMessageShowing == 1)
	{
		hidediv("message1");
		showdiv("message2");
		hidediv("message3");
		currentCMSMessageShowing = 2;
	}
	else if(currentCMSMessageShowing == 2)
	{
		hidediv("message1");
		hidediv("message2");
		showdiv("message3");
		currentCMSMessageShowing = 3;
	}
	else
	{
		showdiv("message1");
		hidediv("message2");
		hidediv("message3");
		currentCMSMessageShowing = 1;
	}

}


function changeCMSwith2() {

	if(currentCMSMessageShowing == 1)
	{
		hidediv("message1");
		showdiv("message2");
		currentCMSMessageShowing = 2;
	}
	else{
		showdiv("message1");
		hidediv("message2");
		currentCMSMessageShowing = 1;
	}


}



function hidediv(divname) {


	if (document.getElementById) { // DOM3 = IE5, NS6
	document.getElementById(divname).style.display = 'none';
	}
	else {
	if (document.layers) { // Netscape 4
	document.hideshow.visibility = 'hidden';
	}
	else { // IE 4
	document.all.hideshow.style.visibility = 'hidden';
	}
	}
}

function showdiv(divname) {
	if (document.getElementById) { // DOM3 = IE5, NS6
	document.getElementById(divname).style.display = 'block';
	}
	else {
	if (document.layers) { // Netscape 4
	document.hideshow.visibility = 'visible';
	}
	else { // IE 4
	document.all.hideshow.style.visibility = 'visible';
	}
	}
}