
var iAttempt=0;

function resetMeasure()
{
	//Reset the vml path lines and click point arrays
	document.getElementById('areaShape').path = 'm 0,0 e';
	document.getElementById('areaClosingLine').path = 'm 0,0 e';
	xClicks = new Array();
	yClicks = new Array();
	xClicksMap = new Array();
	yClicksMap = new Array();

	// the values are displayed in a floating iframe, set it into a variable\
	var iFrameDoc = getIframeDoc();
	
	// reset the form fields if they exist to prevent the measure from being 
	// recreated after a postback
	if (document.getElementById("txtMapXClicks")!=null)
	{
		document.getElementById("txtMapXClicks").value="";
		document.getElementById("txtMapYClicks").value="";
	}
	
	if (iFrameDoc) {
		// reset the distance/area display fields
		iFrameDoc.getElementById('txtArea').value = '0 sq. m';
		iFrameDoc.getElementById('txtTotalLength').value = '0 m';
		iFrameDoc.getElementById('txtSegmentLength').value = '0 m';
	}
}

function ieMouseUpMeasure(event)
{

	//Calculate where the map window actually is, and store this in the offset variables
	imgMapXOffset = parseInt(document.getElementById('divImgMap').style.left) + 2;
	imgMapYOffset = parseInt(document.getElementById('divImgMap').style.top) + 2;

	//Each time the mouse is clicked, add the new click point to the arrays
	var xClick = event.clientX - imgMapXOffset;
	var yClick = event.clientY - imgMapYOffset;
	
	addClickPoint(xClick,yClick,true);
}

function addClickPoint(x,y,bAddMap)
{
	//Calculate the scale factor that relates the map image to the real map
	var scaleFactor = document.getElementById('txtScale').value / (96.000 * 39.3701);
	
	//Used to store the vector path
	var pathString = "";
	
	// the values are displayed in a floating iframe, set it into a variable\
	var iFrameDoc = getIframeDoc();

	if (iFrameDoc) {
		xClicks[xClicks.length] = x;
		yClicks[yClicks.length] = y;
		
		//Once two points exist, draw a single line between these two points and update the shape path
		if (xClicks.length == 2)
		{
			pathString = 'm ' + xClicks[0] + ',' + yClicks[0] + 'L ' + xClicks[1] + ',' + yClicks[1] + 'e';
			document.getElementById('areaShape').path = pathString;
		}
		
		//Otherwise iterate through each click point in the arrays and draw lines
		else if (xClicks.length > 2)
		{
			pathString = 'm ' + xClicks[0] + ',' + yClicks[0] + 'L ' + xClicks[1] + ',' + yClicks[1] + ',';
					
			for (var i=2; i < xClicks.length; i++)
			{
				pathString += xClicks[i] + ',' + yClicks[i] + ',';
			}
			
			//update the shape path
			document.getElementById('areaShape').path = pathString;
			
			//Draw a different coloured line back to the start click
			document.getElementById('areaClosingLine').path = 'm ' + xClicks[xClicks.length - 1] + ',' + yClicks[yClicks.length - 1] + 'L ' + xClicks[0] + ',' + yClicks[0] + 'e';
			
			//Variables used to calculate the area
			var j = 0;
			var area = 0;
			
			//Formula for calculating area (Green's formula). Click points are multiplied by
			//a scale factor to achieve a correct area in sq. metres.
			for (i = 0; i < xClicks.length; i++)
			{
				j = (i + 1) % xClicks.length;
				area = area + (xClicks[i]*scaleFactor * yClicks[j]*scaleFactor);
				area = area - (yClicks[i]*scaleFactor * xClicks[j]*scaleFactor);
			}
			
			//Round the area to 2 decimal places and append the units.
			area = Math.round(Math.abs(area / 2) * 100) / 100 + ' sq. m';
			
			//Update the area display box.
			iFrameDoc.getElementById('txtArea').value = area;
		}
		
		if (xClicks.length>1)
		{
			var segmentLength = Math.sqrt(Math.pow((xClicks[xClicks.length-1]-xClicks[xClicks.length-2])*scaleFactor,2)+Math.pow((yClicks[yClicks.length-1]-yClicks[yClicks.length-2])*scaleFactor,2))
			//Update the total length after every click by adding the segment length to the current total.
			iFrameDoc.getElementById('txtTotalLength').value = Math.round((parseFloat(iFrameDoc.getElementById('txtTotalLength').value) + segmentLength)*100)/100 + ' m';
		}

		// only add the map coord points back into the text field if a new point is clicked,
		// if a pan/zoom use the complete list of coords.
		if (bAddMap)
		{
			// keep a record of the Map Coordinates as well so the map can be panned/zoomed and the 
			// measure tool can be reset.
			var mapX=Math.round((parseFloat(document.getElementById("txtMapX").value)+xClicks[xClicks.length-1]*scaleFactor)*100)/100;
			var mapY=Math.round((parseFloat(document.getElementById("txtMapY").value)-(yClicks[yClicks.length-1]*scaleFactor))*100)/100;
			
			xClicksMap[xClicksMap.length] = mapX;
			yClicksMap[yClicksMap.length] = mapY;
			
		}
		
		// if the text field hasn't been created yet, create it now so that the array
		// can be submitted.
		if (document.getElementById("txtMapXClicks")==null) {
			document.getElementById("toolbar").innerHTML=document.getElementById("toolbar").innerHTML+"<input type=\"text\" name=\"txtMapXClicks\" id=\"txtMapXClicks\">";
			document.getElementById("toolbar").innerHTML=document.getElementById("toolbar").innerHTML+"<input type=\"text\" name=\"txtMapYClicks\" id=\"txtMapYClicks\">";
		}

		// add the arrays to the hidden form fields
		document.getElementById("txtMapXClicks").value=xClicksMap;
		document.getElementById("txtMapYClicks").value=yClicksMap;
	
	}
	
}

function ieMouseMoveMeasure(event)
{

	document.getElementById('divImgMap').style.cursor = 'crosshair';
	
	// the values are displayed in a floating iframe, set it into a variable\
	var iFrameDoc = getIframeDoc();
	
	//Calculate where the map window actually is, and store this in the offset variables
	imgMapXOffset = parseInt(document.getElementById('divImgMap').style.left) + 2;
	imgMapYOffset = parseInt(document.getElementById('divImgMap').style.top) + 2;
	
	//Calculate the map scale factor
	var scaleFactor = document.getElementById('txtScale').value / (96.000 * 39.3701);

	//If at least one click point exists, display the segment length using pythagoras' thereom whenever the mouse changed location.
	if (iFrameDoc&&xClicks.length >= 1)
	{
		//Calculate the segment length between the last clicked point and the current cursor position
		iFrameDoc.getElementById('txtSegmentLength').value = Math.round(Math.sqrt(Math.pow(xClicks[xClicks.length-1]*scaleFactor - (event.clientX-imgMapXOffset)*scaleFactor,2) + Math.pow((event.clientY-imgMapYOffset)*scaleFactor - yClicks[yClicks.length-1]*scaleFactor,2)) * 100) / 100 + ' m';
		
		//Need to redisplay the vml:shape here each time the mouse moves
		//Once one point exists use this as the base point and display the shape every time the mouse moves
		if (xClicks.length == 1)
		{
			pathString = 'm ' + xClicks[0] + ',' + yClicks[0] + 'L ' + (event.clientX-imgMapXOffset) + ',' + (event.clientY-imgMapYOffset) + 'e';
			document.getElementById('areaShape').path = pathString;
		}
		
		//Otherwise iterate through each click point in the arrays and draw lines
		else
		{
			pathString = 'm ' + xClicks[0] + ',' + yClicks[0] + 'L ' + xClicks[1] + ',' + yClicks[1] + ',';
					
			for (var i=2; i < xClicks.length; i++)
			{
				pathString += xClicks[i] + ',' + yClicks[i] + ',';
			}
			
			//Now add the cursor position to the shape path attribute.
			pathString += (event.clientX-imgMapXOffset) + ',' + (event.clientY-imgMapYOffset) + ',';
			
			//update the shape path
			document.getElementById('areaShape').path = pathString;
			
			//Draw a different coloured line back to the start click
			document.getElementById('areaClosingLine').path = 'm ' + (event.clientX-imgMapXOffset) + ',' + (event.clientY-imgMapYOffset) + 'L ' + xClicks[0] + ',' + yClicks[0] + 'e';
			
		}
	}
}

function ieDoubleClickMeasure(event)
{
	//Need to turn the measure tool off.
	document.getElementById('txtCurrentTool').value='MeasureOff';
	
	// also clear the txt fields if they exist so that a zoom/pan etc doesn't cause
	// the previous measure to be started.
	if (document.getElementById('txtMapXClicks'))
	{
		document.getElementById('txtMapXClicks').value="";
		document.getElementById('txtMapYClicks').value="";
	}
}

function loadMeasurePoints()
{
	//Calculate the scale factor that relates the map image to the real map
	var scaleFactor = document.getElementById('txtScale').value / (96.000 * 39.3701);
	
	// only start adding the previously measured points if the iFrame already exists,
	// otherwise the points aren't added.  the iframe has a delay before it is added
	var iFrameDoc = getIframeDoc();
	if (!iFrameDoc) {
		if (iAttempt<5) {
			iAttempt++;
			// set a timer to wait until the iFrame has finshed loading
			setTimeout("loadMeasurePoints();",100);
		}
	} else {
	
		// loop through each map coordinate that was clicked and recreate them
		for (var i=0;i<xClicksMap.length;i++)
		{
			// convert the point back into image coordinates so that it can be displayed
			var imageX=(parseFloat(xClicksMap[i])-parseFloat(document.getElementById("txtMapX").value))/scaleFactor;
			var imageY=-(parseFloat(yClicksMap[i])-parseFloat(document.getElementById("txtMapY").value))/scaleFactor;

			// add the point
			addClickPoint(Math.round(imageX),Math.round(imageY),false);

		}
	}
}