//var offsetX = 250;
var offsetY = 100; // the width of the space above the map image

var dragx1;
var dragx2;
var dragy1;
var dragy2;
var dragStartedFlag = false;
var polygon = false;

// pan of map image
function pan() {
	disattivaBottoni();
	activeIcon("panimg", "panon");
	//document.images["panimg"].src = "img/panon.png";
	//panIcon = "images/icon_recentreon.gif";
	document.getElementById("mapimg").style.cursor = 'move';
	document.getElementById("mapimg").onmousedown = startDrag;

	if (_isKHTML) {
		document.getElementById("hiddenlayer").onmouseup = stopDrag;
	} else {
		document.getElementById("mapimg").onmouseup = stopDrag;
	}
	document.getElementById('zoomlayer').onmouseup = null;
	document.onclick = null;
	document.getElementById("mapimg").onclick = null;
}

// start drag (pan)
function startDrag(eventObject) {
	var image = document.getElementById("mapimg");
	var hiddendiv = document.getElementById("hiddenlayer");

	if (!eventObject) eventObject = window.event;

	// get the point on which we start to move the image
	if (_isIE || _isOpera) {
		dragx1 = eventObject.clientX;
		dragy1 = eventObject.clientY;
	} else if (_isKHTML) {
		dragx1 = eventObject.clientX;
		dragy1 = eventObject.clientY;
	} else {
		dragx1 = eventObject.clientX - 1;
		dragy1 = eventObject.clientY - 1;
	}

	image.style.position = 'absolute'; //da controllare
	image.style.left = 0;
	image.style.top = 0;

	if (_isKHTML) {
		hiddendiv.style.position = 'absolute'; //da controllare
		hiddendiv.style.visibility = 'visible';
		hiddendiv.style.left = 0;
		hiddendiv.style.top = 0;
		hiddendiv.onmousemove = moveDrag;
	} else {
		image.onmousemove = moveDrag;
	}
}

// move drag (pan)
function moveDrag(eventObject) {
	var image = document.getElementById("mapimg");
	var oldLeft, oldTop;

	if (!eventObject) eventObject = window.event;

	// while we are moving the mouse, we are moving map image too
	if (_isIE || _isOpera) {
		dragx2 = eventObject.clientX;
		dragy2 = eventObject.clientY;
	} else if (_isKHTML) {
		dragx2 = eventObject.clientX;
		dragy2 = eventObject.clientY;
	} else {
		dragx2 = eventObject.clientX - 1;
		dragy2 = eventObject.clientY - 1;
	}

	image.style.left = (dragx2 - dragx1);
	image.style.top = (dragy2 - dragy1);
}

// stop drag (pan)
function stopDrag() {
	var hiddendiv = document.getElementById("hiddenlayer");
	var image = document.getElementById("mapimg");
	var xyArr = getPageSize();
	var centerx, centery;
	var x3, y3;

	centerx = xyArr[0] / 2;
	centery = xyArr[1] / 2;

	// calculate the new center of map image
	x3 = Math.round(centerx + (dragx1 - dragx2));

	y3 = Math.round(centery + (dragy1 - dragy2));

//    image.style.position = 'absolute'; //da controllare
//    image.style.left = 0;
//    image.style.top = 0;
//    	
	if (_isKHTML) {
		hiddendiv.style.position = 'absolute'; //da controllare
		hiddendiv.style.visibility = 'hidden';
		hiddendiv.style.left = 0;
		hiddendiv.style.top = 0;
		hiddendiv.onmousemove = null;
	}

	image.onmousemove = getXY;

	performDrag(x3, y3);
}

// change pointer (for Internet Explore only)
function changePointer(elementId, pointer) {
	document.getElementById(elementId).style.cursor = "url('img/" + pointer + "')";
}

// zoom in on map image
function zoomIn() {
	disattivaBottoni();
	activeIcon("zoominimg", "zoominon");
	//document.images["zoominimg"].src = "img/zoominon.png";

	if (_isIE) {
		changePointer('mapimg', 'zoomin.cur');
	} else {
		document.getElementById("mapimg").style.cursor = 'crosshair';
		document.getElementById("zoomlayer").style.cursor = 'crosshair';
	}
	document.getElementById("mapimg").onmousedown = startRubber;
	document.getElementById("mapimg").onmouseup = stopRubber;
	document.getElementById("zoomlayer").onmouseup = stopRubber;
	document.onclick = null;
	document.getElementById("mapimg").onclick = null;
}

// spatial query on map image
function querySpaziale() {
	disattivaBottoni();
	activeIcon("queryspazimg","queryspazon");
		
	if (_isIE) {
		changePointer('mapimg', 'query.cur');
	} else {
		document.getElementById("mapimg").style.cursor = 'crosshair';
		document.getElementById("querylayer").style.cursor = 'crosshair';
	}
	document.getElementById("mapimg").onmousedown = startRubberQuery;
	document.getElementById("mapimg").onmouseup = stopRubberQuery;
	document.getElementById("querylayer").onmouseup = stopRubberQuery;
	document.onclick = null;
	document.getElementById("mapimg").onclick = null;
}

// array containing the top-left and the bottom-right vertexes
var rectanglePositions = new Array(4)

// start rubber (zoom in)
function startRubber(eventObject) {
	var r = document.getElementById('zoomlayer');

	if (!eventObject) eventObject = window.event;

	// get the top-left vertex of the zoom rectangle
	if (_isIE || _isOpera) {
		if (_isIE) {
			rectanglePositions[0] = eventObject.clientX - 2;
			rectanglePositions[1] = eventObject.clientY - 4;
		} else {
			rectanglePositions[0] = eventObject.clientX;
			rectanglePositions[1] = eventObject.clientY - 2;
		}
	} else {
		rectanglePositions[0] = eventObject.clientX;
		rectanglePositions[1] = eventObject.clientY;
	}

	rectanglePositions[0] = rectanglePositions[0] - offsetX;
	rectanglePositions[1] = rectanglePositions[1] - offsetY;

	rectanglePositions[2] = rectanglePositions[0];
	rectanglePositions[3] = rectanglePositions[1];

	r.style.width = 0;
	r.style.height = 0;
	r.style.left = rectanglePositions[0] + 'px';
	r.style.top = rectanglePositions[1] + 'px';
	r.style.visibility = 'visible';

	document.onmousemove = moveRubber;
}

// move rubber (zoom in)
function moveRubber(eventObject) {

	var r = document.getElementById('zoomlayer');

	if (!eventObject) eventObject = window.event;

	// while moving the mouse, we draw the rectangle and get the bottom-right vertex
	if (_isIE || _isOpera) {
		if (_isIE) {
			rectanglePositions[2] = eventObject.clientX - 2;
			rectanglePositions[3] = eventObject.clientY - 4;
		} else {
			rectanglePositions[2] = eventObject.clientX;
			rectanglePositions[3] = eventObject.clientY - 2;
		}
	} else {
		rectanglePositions[2] = eventObject.clientX;
		rectanglePositions[3] = eventObject.clientY;
	}

	rectanglePositions[2] = rectanglePositions[2] - offsetX;
	rectanglePositions[3] = rectanglePositions[3] - offsetY;

	if (rectanglePositions[2] < rectanglePositions[0]) {
		r.style.left = rectanglePositions[2] + 'px';
		r.style.width = rectanglePositions[0] - rectanglePositions[2];
	} else {
		r.style.left = rectanglePositions[0] + 'px';
		r.style.width = rectanglePositions[2] - rectanglePositions[0];
	}

	if (rectanglePositions[3] < rectanglePositions[1]) {
		r.style.top = rectanglePositions[3] + 'px';
		r.style.height = rectanglePositions[1] - rectanglePositions[3];
	} else {
		r.style.top = rectanglePositions[1] + 'px';
		r.style.height = rectanglePositions[3] - rectanglePositions[1];
	}
}

// stop rubber (zoom in)
function stopRubber(eventObject) {
	var r = document.getElementById('zoomlayer');

	r.style.width = 0;
	r.style.height = 0;
	r.style.visibility = 'hidden';

	document.onmousemove = null;

	if (_isIE || _isOpera) {
		rectanglePositions[1] = rectanglePositions[1] + 2;
		if ((! isNaN(rectanglePositions[2])) && (! isNaN(rectanglePositions[3]))) {
			rectanglePositions[3] = rectanglePositions[3] + 2;
		}
	}

	// if we have one point or the rectangle is too small, then launch the zoom function with one point
	// else launch the zoom function with the two points of the rectangle
	if ((isNaN(rectanglePositions[2])) || (isNaN(rectanglePositions[3]))) {
		performZoomIn(rectanglePositions[0], rectanglePositions[1]);
	} else if ((Math.abs(rectanglePositions[0] - rectanglePositions[2]) <= 5) || (Math.abs(rectanglePositions[1] - rectanglePositions[3]) <= 5)) {
		performZoomIn(rectanglePositions[0], rectanglePositions[1]);
	} else {
		performZoomByRectangle(rectanglePositions[0], rectanglePositions[1], rectanglePositions[2], rectanglePositions[3]);
	}
}

// start rubber (spatial query)
function startRubberQuery(eventObject) {
	var r = document.getElementById('querylayer');

	if (!eventObject) eventObject = window.event;

	// get the top-left vertex of the zoom rectangle
	if (_isIE || _isOpera) {
		if (_isIE) {
			rectanglePositions[0] = eventObject.clientX - 2;
			rectanglePositions[1] = eventObject.clientY - 4;
		} else {
			rectanglePositions[0] = eventObject.clientX;
			rectanglePositions[1] = eventObject.clientY - 2;
		}
	} else {
		rectanglePositions[0] = eventObject.clientX;
		rectanglePositions[1] = eventObject.clientY;
	}

	rectanglePositions[0] = rectanglePositions[0] - offsetX;
	rectanglePositions[1] = rectanglePositions[1] - offsetY;

	rectanglePositions[2] = rectanglePositions[0];
	rectanglePositions[3] = rectanglePositions[1];

	r.style.width = 0;
	r.style.height = 0;
	r.style.left = rectanglePositions[0] + 'px';
	r.style.top = rectanglePositions[1] + 'px';
	r.style.visibility = 'visible';

	document.onmousemove = moveRubberQuery;
}

// move rubber (spatial query)
function moveRubberQuery(eventObject) {

	var r = document.getElementById('querylayer');

	if (!eventObject) eventObject = window.event;

	// while moving the mouse, we draw the rectangle and get the bottom-right vertex
	if (_isIE || _isOpera) {
		if (_isIE) {
			rectanglePositions[2] = eventObject.clientX - 2;
			rectanglePositions[3] = eventObject.clientY - 4;
		} else {
			rectanglePositions[2] = eventObject.clientX;
			rectanglePositions[3] = eventObject.clientY - 2;
		}
	} else {
		rectanglePositions[2] = eventObject.clientX;
		rectanglePositions[3] = eventObject.clientY;
	}

	rectanglePositions[2] = rectanglePositions[2] - offsetX;
	rectanglePositions[3] = rectanglePositions[3] - offsetY;

	if (rectanglePositions[2] < rectanglePositions[0]) {
		r.style.left = rectanglePositions[2] + 'px';
		r.style.width = rectanglePositions[0] - rectanglePositions[2];
	} else {
		r.style.left = rectanglePositions[0] + 'px';
		r.style.width = rectanglePositions[2] - rectanglePositions[0];
	}

	if (rectanglePositions[3] < rectanglePositions[1]) {
		r.style.top = rectanglePositions[3] + 'px';
		r.style.height = rectanglePositions[1] - rectanglePositions[3];
	} else {
		r.style.top = rectanglePositions[1] + 'px';
		r.style.height = rectanglePositions[3] - rectanglePositions[1];
	}
}

// stop rubber (spatial query)
function stopRubberQuery(eventObject) {
	var r = document.getElementById('querylayer');
	var selectedItem = tree.getSelectedItemId();
	var itemIsSelected = isItemSelected(selectedItem);

	r.style.width = 0;
	r.style.height = 0;
	r.style.visibility = 'hidden';

	document.onmousemove = null;

	if (_isIE || _isOpera) {
		rectanglePositions[1] = rectanglePositions[1] + 2;
		if ((! isNaN(rectanglePositions[2])) && (! isNaN(rectanglePositions[3]))) {
			rectanglePositions[3] = rectanglePositions[3] + 2;
		}
	}

	if (itemIsSelected) {
		// disabilito le query precedenti

		var listaFigli = tree.getAllSubItems('themesquery').split(",");

		for (var i=0; i<listaFigli.length; i++) {
			tree.setCheck(listaFigli[i], 0);
		}

		// if we have one point or the rectangle is too small, then launch the zoom function with one point
		// else launch the zoom function with the two points of the rectangle
		if ((isNaN(rectanglePositions[2])) || (isNaN(rectanglePositions[3]))) {
			if (document.getElementById('attenderediv').style.visibility == 'hidden') {
				performPointQuery(rectanglePositions[0], rectanglePositions[1]);
			}
		} else if ((Math.abs(rectanglePositions[0] - rectanglePositions[2]) <= 5) || (Math.abs(rectanglePositions[1] - rectanglePositions[3]) <= 5)) {
			if (document.getElementById('attenderediv').style.visibility == 'hidden') {
				performPointQuery(rectanglePositions[0], rectanglePositions[1]);
			}
		} else {
			if (document.getElementById('attenderediv').style.visibility == 'hidden') {
				performRectangleQuery(rectanglePositions[0], rectanglePositions[1], rectanglePositions[2], rectanglePositions[3]);
			}
		}
	} else {
		alert(noThemeSelectedMsg);
	}
}

var doubleClicked = false; // per sapere se è stato fatto doppio click

// spatial query with polygon
function querySpazialePol() {
	disattivaBottoni();
	performErase(false);
	activeIcon("queryspazpolimg", "queryspazpolon");
	//document.images["queryspazpolimg"].src = "img/queryspazpolon.png";
	document.getElementById("mapimg").style.cursor = 'crosshair';
	document.onmousedown = null;
	document.onmouseup = null;

	document.getElementById("mapimg").onmousedown = null;
	document.getElementById("mapimg").onmouseup = null;
	polygon = true;
	document.getElementById("mapimg").onclick = getPolygonCoord;
	document.getElementById("mapimg").ondblclick = getLastPolygonCoord;
	doubleClicked = false;
}

// spatial query with circle
function querySpazialeCircle(){
	disattivaBottoni();
	activeIcon("queryspazcircleimg", "queryspazcircleon");
	document.getElementById("mapimg").style.cursor = 'crosshair';
	document.getElementById('Maincirclediv').style.visibility = 'visible';
	document.onmousedown = null;
	document.onmouseup = null;
	document.getElementById("mapimg").onmousedown = null;
	document.getElementById("mapimg").onmouseup = null;

	document.getElementById("mapimg").onclick = getCircleCenter;
}
// spatial query with line 
function querySpazialeLine(){
	disattivaBottoni();
	performErase(false);
	activeIcon("queryspazlineimg", "queryspazlineon");
	document.getElementById("mapimg").style.cursor = 'crosshair';
	document.onmousedown = null;
	document.onmouseup = null;
	polygon = false; // it is a line
	//document.getElementById("mapimg").onclick = getLineCoord;
	//document.getElementById("mapimg").ondblclick = getLastLineCoord;
	document.getElementById("mapimg").onclick = getPolygonCoord;
	document.getElementById("mapimg").ondblclick = getLastPolygonCoord;
}
// get polygon or line coordinates (spatial query with polygon)
function getPolygonCoord(eventObject) {
	if (!doubleClicked) {
		var posx;
		var posy;
		var factorX, factorY;
		var positionX1 = 0;
		var positionY1 = 0;
		var pageSize = getPageSize();

		if (!eventObject) eventObject = window.event;
		

		// get the clicked point
		if (_isIE || _isOpera) {
			if (_isIE) {
				posx = eventObject.clientX - 2;
				posy = eventObject.clientY - 4;
			} else {
				posx = eventObject.clientX;
				posy = eventObject.clientY - 2;
			}
		} else {
			posx = eventObject.clientX;
			posy = eventObject.clientY;
		}

		posx = posx - offsetX;
		posy = posy - offsetY;

		if (_isIE || _isOpera) {
			posy = posy + 2;
		}
		
		// launch the function to draw the point and the line if we have at least two points
		if (polygon){
			// if it is a polygon	
			setTimeout("performPolygonDraw(" + posx + ", " + posy + ")", 500);
		// else it is a line
		} else if (!polygon){
			setTimeout("performLineDraw(" + posx + ", " + posy + ")", 500);
		}
	}
}

function getLineCoord(eventObject) {
	if (!doubleClicked) {
		var posx;
		var posy;
		var factorX, factorY;
		var positionX1 = 0;
		var positionY1 = 0;
		var pageSize = getPageSize();

		if (!eventObject) eventObject = window.event;
		

		// get the clicked point
		if (_isIE || _isOpera) {
			if (_isIE) {
				posx = eventObject.clientX - 2;
				posy = eventObject.clientY - 4;
			} else {
				posx = eventObject.clientX;
				posy = eventObject.clientY - 2;
			}
		} else {
			posx = eventObject.clientX;
			posy = eventObject.clientY;
		}

		posx = posx - offsetX;
		posy = posy - offsetY;

		if (_isIE || _isOpera) {
			posy = posy + 2;
		}
		
		// launch the function to draw the point and the line if we have at least two points
		//setTimeout("performPolygonDraw(" + posx + ", " + posy + ")", 500);
		setTimeout("performLineDraw(" + posx + ", " + posy + ")", 500);
	}
}

function getLastLineCoord(eventObject) {
	doubleClicked = true;

	var selectedItem = tree.getSelectedItemId();
	var itemIsSelected = isItemSelected(selectedItem);

//    document.getElementById("mapimg").onclick = null;
//    document.getElementById("mapimg").ondblclick = null;
//    document.onclick = null;
//    document.ondblclick = null;

	if (itemIsSelected) {
		// disabilito le query precedenti

		var listaFigli = tree.getAllSubItems('themesquery').split(",");

		for (var i=0; i<listaFigli.length; i++) {
			tree.setCheck(listaFigli[i], 0);
		}

		// launch the spatial query function with a polygon
		
		performLineQuery();
	} else {
		alert(noThemeSelectedMsg);
	}
	setTimeout("doubleClicked = false;", 500);
}

// on doubleclick get last polygon coordinate (spatial query with polygon)
function getLastPolygonCoord(eventObject) {
	doubleClicked = true;

	var selectedItem = tree.getSelectedItemId();
	var itemIsSelected = isItemSelected(selectedItem);

//    document.getElementById("mapimg").onclick = null;
//    document.getElementById("mapimg").ondblclick = null;
//    document.onclick = null;
//    document.ondblclick = null;

	if (itemIsSelected) {
		// disabilito le query precedenti

		var listaFigli = tree.getAllSubItems('themesquery').split(",");

		for (var i=0; i<listaFigli.length; i++) {
			tree.setCheck(listaFigli[i], 0);
		}

		// launch the spatial query function with a polygon or a line
		if (polygon){
			performPolygonQuery();
		// if it is a line
		} else if (!polygon){
			performLineQuery();
		}
	} else {
		alert(noThemeSelectedMsg);
	}
	setTimeout("doubleClicked = false;", 500);
}

// get the circle center
function getCircleCenter(eventObject) {
	var posx;
	var posy;
	var factorX, factorY;
	var positionX1 = 0;
	var positionY1 = 0;
	var pageSize = getPageSize();
	
	var selectedItem = tree.getSelectedItemId();
	var itemIsSelected = isItemSelected(selectedItem);

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			posx = eventObject.clientX - 2;
			posy = eventObject.clientY - 4;
		} else {
			posx = eventObject.clientX;
			posy = eventObject.clientY - 2;
		}
	} else {
		posx = eventObject.clientX;
		posy = eventObject.clientY;
	}

	posx = posx - offsetX;
	posy = posy - offsetY;

	if (_isIE || _isOpera) {
		posy = posy + 2;
	}

	// launch the function to draw the circle
	var circleType = document.getElementById("circletype").value;
	var circleValue = document.getElementById("circlevalue").value;
	
	if (itemIsSelected) {
		// disabilito le query precedenti

		var listaFigli = tree.getAllSubItems('themesquery').split(",");

		for (var i=0; i<listaFigli.length; i++) {
			tree.setCheck(listaFigli[i], 0);
		}
		
		if (isNaN(circleValue) || (circleValue == "")) {
			alert(noRadiusIndicatedMsg);
		} else {
			performCircleQuery(posx,posy,circleType,circleValue);
		}
	} else {
		alert(noThemeSelectedMsg);
	}
}

// check if the theme in the tree is correctly selected (spatial query)
function isItemSelected(id) {
	if (tree.getLevel(id) == 3 && (tree.getParentId(tree.getParentId(id)) == 'themes' || tree.getParentId(tree.getParentId(id)) == 'themesadd') && tree.hasChildren(id)) {
		return true;
	} else {
		return false;
	}
}

// zoom out on map image
function zoomOut() {
	disattivaBottoni();
	activeIcon("zoomoutimg", "zoomouton");
//	document.images["zoomoutimg"].src = "img/zoomouton.png";

	if (_isIE) {
		changePointer('mapimg', 'zoomout.cur');
	} else {
		document.getElementById("mapimg").style.cursor = 'crosshair';
	}
	document.onmousedown = null;
	document.onmouseup = null;
	document.onclick = null;
	document.getElementById("mapimg").onclick = getClickPos;
}

// get the coordinates of the clicked point
function getClickPos(eventObject) {
	var posX, posY;

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			posX = eventObject.clientX - 2;
			posY = eventObject.clientY - 4;
		} else {
			posX = eventObject.clientX;
			posY = eventObject.clientY - 2;
		}
	} else {
		posX = eventObject.clientX;
		posY = eventObject.clientY;
	}

	posX = posX - offsetX;
	posY = posY - offsetY;

	// launch the zoom out function
	performZoomOut(posX, posY);

}

// zoom all on map image
function zoomAll() {
	disattivaBottoni();

	document.getElementById("mapimg").style.cursor = 'arrow';

	// launch the zoom all function
	performZoomAll();
}

// pan north-west (number 7 on the keyboard)
function pannorthwest() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx - (xyArr[0] / 2)), Math.round(centery - (xyArr[1] / 2)));
}

// pan north (number 8 on the keyboard)
function pannorth() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx), Math.round(centery - (xyArr[1] / 2)));
}

// pan north-east (number 9 on the keyboard)
function pannortheast() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx + (xyArr[0] / 2)), Math.round(centery - (xyArr[1] / 2)));
}

// pan south-west (number 1 on the keyboard)
function pansouthwest() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx - (xyArr[0] / 2)), Math.round(centery + (xyArr[1] / 2)));
}

// pan south (number 2 on the keyboard)
function pansouth() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx), Math.round(centery + (xyArr[1] / 2)));
}

// pan south-east (number 3 on the keyboard)
function pansoutheast() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx + (xyArr[0] / 2)), Math.round(centery + (xyArr[1] / 2)));
}

// pan west (number 4 on the keyboard)
function panwest() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx - (xyArr[0] / 2)), Math.round(centery));
}

// pan east (number 6 on the keyboard)
function paneast() {
	var xyArr = getPageSize();
	var centerx = xyArr[0] / 2;
	var centery = xyArr[1] / 2;
	performDrag(Math.round(centerx + (xyArr[0] / 2)), Math.round(centery));
}

// deactivate icons, hide div and reset events
function disattivaBottoni() {

	for (j=0; j<profilesDivArr.length;j++) {
		var childrenList;
		if (_isFF) {
			childrenList = document.all(profilesDivArr[j]).childNodes;
		} else {
			childrenList = document.all(profilesDivArr[j]).children;
		}
	    for (i=0; i<childrenList.length; i++) {
	    	for (z=0; z<functionImgArr.length; z++) {
	    		if ((childrenList.item(i).id) == (functionImgArr[z] + "img"))
		    		childrenList.item(i).src = "img/" + functionImgArr[z] + "off.png";
	    	}
	    }
	}
	
	//for (i=0; i<functionImgArr.length; i++) {
	//	document.images[functionImgArr[i] + "img"].src = "img/" + functionImgArr[i] + "off.png";
	//}

	if (document.getElementById('aggiungitemidiv')) {
		document.getElementById('aggiungitemidiv').style.visibility = 'hidden';
	}

	if (document.getElementById('Mainmeasurediv')) {
		document.getElementById('Mainmeasurediv').style.visibility = 'hidden';
	}

	if (document.getElementById('Mainprintdiv')) {
		document.getElementById('Mainprintdiv').style.visibility = 'hidden';
		document.getElementById('printrectlayer').style.visibility = 'hidden';
	}
	if (document.getElementById('Maincirclediv')) {
		document.getElementById('Maincirclediv').style.visibility = 'hidden';
	}

	document.getElementById("mapimg").onmousedown = null;
	document.getElementById("mapimg").onmouseup = null;
	document.getElementById("mapimg").onclick = null;
	document.getElementById("mapimg").style.cursor = 'arrow';
	document.getElementById('zoomlayer').onmouseup = null;

}

// active the specified function icon of the visible div
function activeIcon(functionId, imageId) {
	for (j=0; j<profilesDivArr.length;j++) {
		if (document.getElementById(profilesDivArr[j]).style.visibility == 'visible') {
			var childrenList;
			if (_isFF) {
				childrenList = document.all(profilesDivArr[j]).childNodes;
			} else {
				childrenList = document.all(profilesDivArr[j]).children;
			}
		    for (i=0; i<childrenList.length; i++) {
		    	if (childrenList.item(i).id == functionId) { 
		    		childrenList.item(i).src = "img/" + imageId + ".png";
	    		}
		    }
	    }
	}
}

var oldtop = 0;
var oldleft = 0;
var refdragx1;
var refdragy1;
var refdragx2;
var refdragy2;
var offsetRettX = 5;
var offsetRettY = 105;
//var refImageX = 240;
var refImageY = 180;

// draw rectangle on overview map
function drawRefRectangle() {
	var refFactorX;
	var refFactorY;
	var x1, y1, x2, y2;
	var refRect = document.getElementById('overviewlayer');

	try	{
		refFactorX = (refMbrXMax - refMbrXMin) / refImageX;
		refFactorY = (refMbrYMax - refMbrYMin) / refImageY;
		x1 = parseInt((mbrMinX - refMbrXMin) / refFactorX);
		x2 = parseInt((mbrMaxX - refMbrXMin) / refFactorX);
		y1 = parseInt((mbrMinY - refMbrYMin) / refFactorY);
		y2 = parseInt((mbrMaxY - refMbrYMin) / refFactorY);

		refRect.style.top = y1 + 'px';
		refRect.style.left = x1 + 'px';
		refRect.style.height = (y2 - y1);
		refRect.style.width = (x2 - x1);

		if (y1 < 0) {
			refRect.style.top = '0px';
			refRect.style.height = refImageY;
		}

		if ((parseInt(refRect.style.height) > refImageY) || (parseInt(refRect.style.width) > refImageX)) {
			refRect.style.top = '-20px';
			refRect.style.left = '-20px';
			refRect.style.height = 1;
			refRect.style.width = 1;
		}

		refRect.onmousedown = startRefDrag;
		refRect.onmouseup = stopRefDrag;

		refdragx1 = 0;
		refdragy1 = 0;
		refdragx2 = 0;
		refdragy2 = 0;
	} catch (err) {
	}
}

// start reference drag (overview image)
function startRefDrag(eventObject) {

	var refRect = document.getElementById('overviewlayer');

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			refdragx1 = eventObject.clientX - 2;
			refdragy1 = eventObject.clientY - 4;
		} else {
			refdragx1 = eventObject.clientX;
			refdragy1 = eventObject.clientY - 2;
		}
	} else {
		refdragx1 = eventObject.clientX;
		refdragy1 = eventObject.clientY;
	}

	oldtop = parseInt(refRect.style.top);
	oldleft = parseInt(refRect.style.left);

	refRect.onmousemove = moveRefDrag;

}

// move reference drag (overview image)
function moveRefDrag(eventObject) {

	var refRect = document.getElementById('overviewlayer');
	var refrectWidth = parseInt(refRect.style.width);
	var refrectHeight = parseInt(refRect.style.height);

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			refdragx2 = eventObject.clientX - 2;
			refdragy2 = eventObject.clientY - 4;
		} else {
			refdragx2 = eventObject.clientX;
			refdragy2 = eventObject.clientY - 2;
		}
	} else {
		refdragx2 = eventObject.clientX;
		refdragy2 = eventObject.clientY;
	}

	if (((oldtop + (refdragy2 - refdragy1)) >= 0) && ((oldleft + (refdragx2 - refdragx1)) >= 0)) {
		if ((((oldtop + (refdragy2 - refdragy1)) + refrectHeight) <= refImageY) && (((oldleft + (refdragx2 - refdragx1)) + refrectWidth) <= refImageX)) {
			refRect.style.top = (oldtop + (refdragy2 - refdragy1)) + 'px';
			refRect.style.left = (oldleft + (refdragx2 - refdragx1)) + 'px';
		}
	}
}

// stop reference drag (overview image)
function stopRefDrag(eventObject) {
	var refdragx3, refdragy3;
	var refRect = document.getElementById('overviewlayer');

	refRect.onmousemove = null;

	refdragx3 = parseInt(refRect.style.left) + (parseInt(refRect.style.width) / 2);
	refdragy3 = parseInt(refRect.style.top) + (parseInt(refRect.style.height) / 2);

	performRefPan(parseInt(refdragx3), parseInt(refdragy3));

}

var lastPointX = -1;
var lastPointY = -1;

// measure on map image
function measure() {
	disattivaBottoni();
	activeIcon("measureimg", "measureon");
//	document.images["measureimg"].src = "img/measureon.png";
	document.getElementById("mapimg").style.cursor = 'crosshair';
	document.getElementById('Mainmeasurediv').style.visibility = 'visible';
	document.onmousedown = null;
	document.onmouseup = null;

	document.getElementById("mapimg").onclick = getPointCoord;
	document.onmousemove = getDistance;
}

// get the coordinates of the clicked point
function getPointCoord(eventObject) {

	var posx;
	var posy;
	var factorX, factorY;
	var positionX1 = 0;
	var positionY1 = 0;
	var pageSize = getPageSize();

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			posx = eventObject.clientX - 2;
			posy = eventObject.clientY - 4;
		} else {
			posx = eventObject.clientX;
			posy = eventObject.clientY - 2;
		}
	} else {
		posx = eventObject.clientX;
		posy = eventObject.clientY;
	}

	posx = posx - offsetX;
	posy = posy - offsetY;

	if (_isIE || _isOpera) {
		posy = posy + 2;
	}

	// launch the function to draw the point and the line if we have at least two points
	performMeasure(posx,posy);

	factorX = (mbrMaxX - mbrMinX) / pageSize[0];
	factorY = (mbrMaxY - mbrMinY) / pageSize[1];

	positionX1 = mbrMinX + (posx * factorX);
	posy = pageSize[1] - posy;
	positionY1 = mbrMinY + (posy * factorY);

	lastPointX = positionX1;
	lastPointY = positionY1;

	// launch the function to calculate the length of the segment
	getDistance(eventObject);
}

// get the length of the segment while moving the mouse
function getDistance(eventObject) {

	var posx;
	var posy;
	var distance;
	var factorX, factorY;
	var positionX1 = 0;
	var positionY1 = 0;
	var positionX2 = 0;
	var positionY2 = 0;
	var pageSize = getPageSize();
	var unitaMisura = "m";

	if (!eventObject) eventObject = window.event;

	if (_isIE || _isOpera) {
		if (_isIE) {
			posx = eventObject.clientX - 2;
			posy = eventObject.clientY - 4;
		} else {
			posx = eventObject.clientX;
			posy = eventObject.clientY - 2;
		}
	} else {
		posx = eventObject.clientX;
		posy = eventObject.clientY;
	}

	posx = posx - offsetX;
	posy = posy - offsetY;

	if (_isIE || _isOpera) {
		posy = posy + 2;
	}

	if (lastPointX != -1 && lastPointY != -1) {
		factorX = (mbrMaxX - mbrMinX) / pageSize[0];
		factorY = (mbrMaxY - mbrMinY) / pageSize[1];

		positionX1 = mbrMinX + (posx * factorX);
		positionX2 = lastPointX;
		posy = pageSize[1] - posy;
		positionY1 = mbrMinY + (posy * factorY);
		positionY2 = lastPointY;

		var a = Math.abs(positionX1 - positionX2);
		var b = Math.abs(positionY1 - positionY2);

		distance = (Math.sqrt((a*a) +(b*b))).toFixed(2);

		if (distance >= 1000) {
			distance = (distance / 1000).toFixed(2);
			unitaMisura = "km";
		}

		if (distance == 0) {
			document.getElementById("segmento").value = "- - -";
		} else {
			document.getElementById("segmento").value = distance+unitaMisura;
		}
	}
}

// calculate the area if we have at least three points
function calcolaArea() {
	performMeasureArea();
}

// erase all feature to begin a new measure
function cancellaElementi() {
	lastPointX = -1;
	lastPointY = -1;
	document.getElementById("segmento").value = "";
	document.getElementById("distanzatot").value = "";
	document.getElementById("areatot").value = "";
	performErase(true);
}

var oldWidth;
var oldX;
var newX;
var newWidth;

// start split to enlarge or reduce the div containing the tree
function startSplit(eventObject) {
	var leftdiv = document.getElementById('leftdiv');
	var splitHiddenDiv = document.getElementById('splithiddenlayer');
	splitHiddenDiv.style.position = 'absolute';
	splitHiddenDiv.style.visibility = 'visible';
	splitHiddenDiv.style.left = 0;
	splitHiddenDiv.style.top = 0;

	document.getElementById("overviewimg").style.visibility = 'hidden';
	document.getElementById("overviewlayer").style.visibility = 'hidden';
	document.getElementById("mapimg").style.visibility = 'hidden';

	oldWidth = parseInt(leftdiv.style.width);

	if (!eventObject) eventObject = window.event;

	if (_isFF) {
		oldX = eventObject.clientX - 1;
	} else{
		oldX = eventObject.clientX;
	}

	newX = oldX;

	document.onmouseup = stopSplit;
	document.onmousemove = splitMove;
}

// moving the div containing the tree
// (the div's width can be between offetXmin and offserXmax)
function splitMove(eventObject) {
	var leftdiv = document.getElementById('leftdiv');
	var temidiv = document.getElementById('temi');
	var overviewdiv = document.getElementById('overviewdiv');
	var overviewhiddenlayer = document.getElementById('overviewhiddenlayer');

	if (!eventObject) eventObject = window.event;

	if (_isFF) {
		newX = eventObject.clientX - 1;
	} else{
		newX = eventObject.clientX;
	}

	newWidth = oldWidth + (newX - oldX);
	if (newWidth < offsetXmin) newWidth = offsetXmin;
	if (newWidth > offsetXmax) newWidth = offsetXmax;
	leftdiv.style.width = newWidth;
	temidiv.style.width = (newWidth - 10);
	overviewdiv.style.width = (newWidth - 10);
	overviewhiddenlayer.style.width = (newWidth - 10);
}

// stop split
function stopSplit(eventObject) {
	var splitHiddenDiv = document.getElementById('splithiddenlayer');
	splitHiddenDiv.style.position = 'absolute';
	splitHiddenDiv.style.visibility = 'hidden';
	splitHiddenDiv.style.left = 0;
	splitHiddenDiv.style.top = 0;

	document.onmousemove = null;
	document.onmouseup = null;

	offsetX = parseInt(document.getElementById("leftdiv").style.width);
	refImageX = parseInt(document.getElementById("overviewdiv").style.width);
	
	// launch the function to reload map and overview images with the new dimensions
	resizeImage();
}

// recalculate the input value if the circle type is changed
function recalculateCircleValue(){
	var circleValue = parseInt(document.getElementById("circlevalue").value);
	if(circleValue>0){
		if(document.getElementById('circletype').value=='radius'){
			circleValue=circleValue/2;
		}else {
			circleValue=circleValue*2;
			}
		document.getElementById("circlevalue").value=circleValue;
	}
}