
function toggleBlockDisplay(elem){
    if (elem.tagName !== 'A'){ return;}
    var ULElement = elem.parentNode.getElementsByTagName('ul')[0];
    if (!ULElement) {
    	ULElement = elem.getElementsByTagName('ul')[0];
    }
    else {
		var display = ULElement.style.display;
		var linkImage = elem.getElementsByTagName('img')[0];
		linkImage.src = (display === 'block') ? 'bimages/plus.gif' : 'bimages/minus.gif';
		ULElement.style.display = (display === 'block') ? 'none' : 'block';
	}
}

function twinkle(siteID, period, cycles){  // cycles must be even number
	var box = document.getElementById('sit' + siteID);
	box.style.zIndex = highestFloor + 1;
	var img = box.getElementsByTagName('img')[0];
	img.style.visibility  = 'visible';
	var displayed = true;
	var intervalHandle = setInterval(cycleBlock, period / cycles);
	setTimeout(restoreBlock, period);
	function cycleBlock(){
		displayed = !displayed;
		img.style.visibility = (displayed) ? 'visible' : 'hidden';
	}
	
	function restoreBlock(){
		clearInterval(intervalHandle);
		setTimeout(afterOneCycle, period / cycles);
	}
	
	function afterOneCycle(){
		img.style.visibility = 'visible';
		box.style.zIndex = box.site.floor;
	}
}


function changedList(mouse){
	var ul = document.getElementById('surface');
	var listItems = ul.getElementsByTagName('li');
	var surface = document.getElementById('surface');
	var boxes = surface.getElementsByTagName('div');
	var pointerOverSites = [];
	for (var b=0; b < boxes.length; b++){
		if (insidePolygon(boxes[b].areaCoords, mouse)){
			pointerOverSites.push(boxes[b]);
		}
	}
	if (pointerOverSites.length === 0){ return false;}
	if (listItems.length === pointerOverSites.length){
		var listItemsArray = [];
		for (var l=0; l < listItemsArray.length; l++){
			listItemsArray.push(listItems[l]);
		}
		listItemsArray.sort(compareSiteFloors);
		pointerOverSites.sort(compareSiteFloors);
		for (l=0; l < listItemsArray.length; l++){
			if (listItemsArray[l].box !== pointerOverSites[l]){
				return true;
			}
		}
		return false;
	}
	return true;
}

function hideSitesDisplay(){
	var surface = document.getElementById('surface');
	var sites = surface.getElementsByTagName('div');
	for (var s=0; s < sites.length; s++){
		var img = sites[s].getElementsByTagName('img')[0];
		img.style.visibility  = 'hidden';
	}
}

/*

function flushSitesDisplay(){
	var surface = document.getElementById('surface');
	var sites = surface.getElementsByTagName('div');
	var sitesArray = []
	for (var s=0; s < sites.length; s++)
		sitesArray.push(sites[s]);
	for (var s=0; s < sitesArray.length; s++){
		surface.removeChild(sitesArray[s]);
		sitesArray[s] = undefined;
	}
}
*/
function createSite(siteID){
	var mapViewer = document.getElementById('map-viewport');
	var map = mapViewer.map;
	var dim = mapViewer.dimensions;
	//var mapData =  document.body.mapData;
	var scaleAdj;
	var site = sData[siteID];
	var box = document.createElement('div');
	box.id = 'sit' + siteID;  // sit for site
	box.style.position = 'absolute';
	box.style.fontSize = '0';
	box.style.zIndex = site.floor;
	box.site = site;
	var surface = document.getElementById('surface');
	var ul = document.getElementById('surfaceUL');	
	surface.insertBefore(box,ul);
	var chitSet = [];
	for (var s=0; s < scaleMax; s++){
		scaleAdj = mapData.scales[s].width / mapData.scales[0].width;
		var chit = document.createElement('img');
		if (!siteID.match(/^USERLM\d+$/)){
			chit.src = 'chits/' + s + '/' + box.site.id + '.gif';
		}else{
			chit.src = 'chits/user/' + s + '/' + 'USERLM.gif';
		}
		chit.className = 'siteIMG';
		chit.useMap = '#map' + site.id;		
		chit.width = Math.round(box.site.width * scaleAdj);	
		chit.height = Math.round(box.site.height * scaleAdj);
		chit.style.visibility = 'hidden';
		chitSet.push(chit);			
	}
	box.chitSet = chitSet;
	var imgMap = document.createElement('map');
	imgMap.id = 'map' + siteID;
	imgMap.name = 'map' + siteID;
	var areas = box.site.areas;
	box.areaCoords = [];
	for (var a=0; a < areas.length; a++){
		var area = document.createElement('area');
		var polygon = [];
		for (var p = 0; p < areas[a].length; p++){ 
			polygon.push({'x': 0, 'y': 0});
		}
		box.areaCoords.push(polygon);
		area.shape = 'poly';
		//area.href = '#';
		area.onmouseout = areaMouseOut;
		area.onmouseover = areaMouseOver;
		area.onmousemove = areaMouseMove;
		area.onmousedown = areaMouseDown;
		area.onmouseup = areaMouseUp;
		area.onclick = siteClicked;
		box.site.area = area;
		area.listed = false;
		imgMap.appendChild(area);
	}
	box.appendChild(imgMap);
}

function imageLoaded(){ 
	var box = document.getElementById('sit' + this.siteID);
	this.style.borderWidth = '0';
	this.style.width = parseInt(box.style.width,10) + 'px';
	this.style.height = parseInt(box.style.height,10) + 'px';
	this.style.visibility  = 'visible';
	twinkle(this.siteID, 600, 4);
}

function displaySites(){
	var surface = document.getElementById('surface');
	var boxes = surface.getElementsByTagName('div');
	var mapViewer = document.getElementById('map-viewport');
	var map = mapViewer.map;
	var dim = mapViewer.dimensions;
	//var mapData =  document.body.mapData;
	var scaleAdj = mapData.scales[dim.scale].width / mapData.scales[0].width;
	for (var b=0; b < boxes.length; b++){
		var box = boxes[b];
		var chitSet = box.chitSet;
		box.style.top = (Math.ceil(box.site.top * scaleAdj) - Math.ceil(map.center.y - (dim.height / 2))) + 'px';	
		box.style.left = (Math.ceil(box.site.left * scaleAdj) - Math.ceil(map.center.x - (dim.width / 2))) + 'px';
		box.style.width = chitSet[dim.scale].width + 'px';	
		box.style.height = chitSet[dim.scale].height + 'px';	
		var img = box.getElementsByTagName('img')[0];
		chitSet[dim.scale].style.visibility = 'visible';
		if (!img){
			box.appendChild(chitSet[dim.scale]);
		}else{
			box.replaceChild(chitSet[dim.scale],img);
		}
		/*
		if (!box.site.id.match(/^USERLM\d+$/))
			img.src = 'chits/' + dim.scale + '/' + box.site.id + '.gif';
		else
			img.src = 'chits/' + dim.scale + '/' + 'USERLM.gif';
		img.width = parseInt(box.style.width);
		img.height = parseInt(box.style.height);
		*/
		var areas = box.site.areas;
		var imgMapAreas = box.getElementsByTagName('map')[0].getElementsByTagName('area');
		var coordPts = '';
		for (var a=0; a < areas.length; a++){
			coordPts = '';
			for (var p = 0; p < areas[a].length; p++){
				coordPts += Math.ceil(areas[a][p].x * scaleAdj) + ',' + Math.ceil(areas[a][p].y * scaleAdj) + ',';
				box.areaCoords[a][p] = {'x': parseInt(box.style.left,10) + Math.ceil(areas[a][p].x * scaleAdj), 'y':parseInt(box.style.top,10) + Math.ceil(areas[a][p].y * scaleAdj)};
			}
			imgMapAreas[a].coords = coordPts.slice(0,-1);
		}
	}
}

function siteInsideViewer(site){
    var mapViewer = document.getElementById('map-viewport');
	var map = mapViewer.map;
	var dim = mapViewer.dimensions;
	var scaleAdj = mapData.scales[dim.scale].width / mapData.scales[0].width;
	var viewerTop = map.center.y - dim.height;	
	var viewerBottom = map.center.y + dim.height;	
	var viewerLeft = map.center.x - dim.width;	
	var viewerRight = map.center.x + dim.width;
	var siteTop = Math.ceil(site.top * scaleAdj);
	var siteBottom = Math.ceil((site.top + site.height) * scaleAdj);
	var siteLeft = Math.ceil(site.left * scaleAdj);
	var siteRight = Math.ceil((site.left + site.width) * scaleAdj);
	if (siteBottom < viewerTop || siteTop > viewerBottom || siteLeft > viewerRight || siteRight < viewerLeft){
		return false;
	}
	return true;
}

function findViewableScale(site){
	var mapViewer = document.getElementById('map-viewport');
	var map = mapViewer.map;
	//var mapData =  document.body.mapData;
	var dim = mapViewer.dimensions;
	var scale = dim.scale + 1;
	var scaleAdj = mapData.scales[scale].width / mapData.scales[0].width;
	var viewerTop = Math.ceil(map.center.y - (dim.height / 2));
	var viewerBottom = Math.ceil(map.center.y + (dim.height/ 2));	
	var viewerLeft = Math.ceil(map.center.x - (dim.width / 2));	
	var viewerRight = Math.ceil(map.center.x + (dim.width / 2));
	var siteTop = Math.ceil(site.top * scaleAdj);
	var siteBottom = Math.ceil((site.top + site.height) * scaleAdj);
	var siteLeft = Math.ceil(site.left * scaleAdj);
	var siteRight = Math.ceil((site.left + site.width) * scaleAdj);
	while (siteBottom < viewerTop || siteTop > viewerBottom || siteLeft > viewerRight || siteRight < viewerLeft) {
		scale++;
		if (scale >= scaleMax){ break;}
		scaleAdj = mapData.scales[scale].width / mapData.scales[0].width;
		viewerTop = Math.ceil((map.center.y  * scaleAdj) - (dim.height / 2));
		viewerBottom = Math.ceil((map.center.y * scaleAdj) + (dim.height / 2));	
		viewerLeft = Math.ceil((map.center.x * scaleAdj) - (dim.width / 2));	
		viewerRight = Math.ceil((map.center.x * scaleAdj) + (dim.width / 2));
		siteTop = Math.ceil(site.top * scaleAdj);
		siteBottom = Math.ceil((site.top + site.height) * scaleAdj);
		siteLeft = Math.ceil(site.left * scaleAdj);
		siteRight = Math.ceil((site.left + site.width) * scaleAdj);
	}
	return scale;
}

function placeInViewer(site){
	var mapViewer = document.getElementById('map-viewport');
	var map = mapViewer.map;
	//var mapData =  document.body.mapData;
	var dim = mapViewer.dimensions;
	var scale = dim.scale;
	var scaleAdj = mapData.scales[scale].width / mapData.scales[0].width;
	var viewerTop = Math.ceil(map.center.y - (dim.height / 2));
	var viewerBottom = Math.ceil(map.center.y + (dim.height/ 2));	
	var viewerLeft = Math.ceil(map.center.x - (dim.width / 2));	
	var viewerRight = Math.ceil(map.center.x + (dim.width / 2));
	var siteTop = Math.ceil(site.top * scaleAdj);
	var siteBottom = Math.ceil((site.top + site.height) * scaleAdj);
	var siteLeft = Math.ceil(site.left * scaleAdj);
	var siteRight = Math.ceil((site.left + site.width) * scaleAdj);
	if (siteBottom > viewerBottom || siteTop < viewerTop || siteLeft < viewerLeft || siteRight > viewerRight) {
		map.center.x = Math.ceil((site.left + site.width / 2) * scaleAdj);
		map.center.y = Math.ceil((site.top + site.height / 2) * scaleAdj);
		adjustBoundaryOverflow(mapViewer, mapViewer.start);
		map.center.col =  Math.floor(map.center.x / dim.tileSize);
		map.center.row =  Math.floor(map.center.y / dim.tileSize);
		map.center.tile.x = map.center.x - map.center.col * dim.tileSize;
		map.center.tile.y = map.center.y - map.center.row * dim.tileSize; 
		dim.x = Math.floor(dim.width / 2) - (Math.floor(dim.cols/2) * dim.tileSize + map.center.tile.x);
		dim.y = Math.floor(dim.height / 2) - (Math.floor(dim.rows/2) * dim.tileSize + map.center.tile.y);
		hideSitesDisplay();
		positionTiles(mapViewer);   
    }
}


function flushSitesLayerUL(){
	var ul = document.getElementById('surfaceUL');
	while (ul.lastChild){
		ul.removeChild(ul.lastChild);
	}
/*
	var listItemArray = [];
	for (var i=0; i < ul.childNodes.length; i++)
		listItemArray.push(ul.childNodes[i]);
	for (var i=0; i < listItemArray.length; i++){
		ul.removeChild(listItemArray[i]);
		listItemArray[i] = undefined;
	}
	*/
	ul.style.visibility = 'hidden';
}

function listThis(site){
	var listItem = document.createElement('li');
	var ul = document.getElementById('surfaceUL');
	listItem.site = site;
	listItem.style.cursor = 'pointer';
	listItem.innerHTML = site.name;
	listItem.onmousedown = liOnMouseDown;
	listItem.onmouseover = liOnMouseOver;
	listItem.onmouseout = liOnMouseOut;
	listItem.onclick = siteClicked;
	ul.appendChild(document.createTextNode('\n'));
	ul.appendChild(listItem);
	site.area.listed = true;
}

function labelSitesHere(mouse){
	var surface = document.getElementById('surface');
	var boxes = surface.getElementsByTagName('div');
	var pointerOverSites = [];
	for (var b=0; b < boxes.length; b++){
		var areas = boxes[b].areaCoords;
		for (var a=0; a < areas.length; a++){
			if (insidePolygon(boxes[b].areaCoords[a], mouse)){
				pointerOverSites.push(boxes[b]);
			}
		}
	
	}
	if (pointerOverSites.length === 0){
		flushSitesLayerUL();
		return;
	}
	pointerOverSites.sort(compareSiteFloors);
	var ul = document.getElementById('surfaceUL');
	var lowestTop = parseInt(pointerOverSites[0].style.top,10);
	var highestBottom = parseInt(pointerOverSites[0].style.top,10) + parseInt(pointerOverSites[0].style.height,10);
	var furthestLeft = parseInt(pointerOverSites[0].style.left,10);
	var nearestRight = parseInt(pointerOverSites[0].style.left,10) + parseInt(pointerOverSites[0].style.width,10);
	for (var p=0; p < pointerOverSites.length; p++){
		var top = parseInt(pointerOverSites[p].style.top,10);
		var bottom = parseInt(pointerOverSites[p].style.top,10) + parseInt(pointerOverSites[p].style.height,10);
		var left = parseInt(pointerOverSites[p].style.left,10);
		var right = parseInt(pointerOverSites[p].style.left,10) + parseInt(pointerOverSites[p].style.width,10);
		if (top > lowestTop){ lowestTop = top;}
		if (bottom < highestBottom){ highestBottom = bottom;}
		if (left > furthestLeft){ furthestLeft = left;}
		if (right < nearestRight) {nearestRight = right;}
		listThis(pointerOverSites[p].site);
	}
	ul.style.top = Math.ceil((lowestTop + highestBottom) / 2) + 'px';
	ul.style.left = Math.ceil((furthestLeft + nearestRight) / 2) + 'px';
	ul.style.visibility = 'visible';
}

function compareSiteFloors(box1, box2){
	return box2.site.floor - box1.site.floor;
}

function insidePolygon(polygon, p){
	var i = j = 0;
	var n = polygon.length;
	var counter = 0;
	var p1 = polygon[0];
	var xIntersect;
	
	for (i=1; i<=n;i++) {
		var p2 = polygon[i%n];
		if (p.y > ((p1.y < p2.y) ? p1.y : p2.y)) {
			if (p.y <= ((p1.y > p2.y) ? p1.y : p2.y)) {
				if (p.x <= ((p1.x > p2.x) ? p1.x : p2.x)) {
					if (p1.y != p2.y) {
						xIntersect = (p.y - p1.y) * (p2.x - p1.x) / (p2.y - p1.y) + p1.x;
						if (p1.x === p2.x || p.x <= xIntersect){
							counter++;
						}
					}
				}
			}
		}
		p1 = p2;
	}
	return counter % 2;
}

function add2Selection(site){
	var selectList = document.getElementById('selectionList');
	var li = document.createElement('li');
	var form = document.createElement('form');
	var input = document.createElement('input');
	input.type = 'checkbox';
	form.appendChild(input);
	var siteName = document.createTextNode(site.name);
	var anchor = document.createElement('a');
	anchor.href = '#';
	anchor.appendChild(siteName);
	anchor.onmouseover = selectLIOnMouseOver;
	anchor.onmouseout = selectLIOnMouseOut;
	anchor.onclick = siteClicked;
	li.appendChild(form);
	li.appendChild(anchor);
	li.site = site;
	selectList.appendChild(li);
}

function loadSite(siteID){
	var site = sData[siteID];
	var maxAttempts = 5;
	var reqAttempts = 0;
	var req;
	if (!site){
			fetchSite(siteID);
	}else {
		placeInViewer(site);
		displaySites();
		twinkle(site.id, 600, 4);
	}

	function fetchSite(siteID){
		if (window.XMLHttpRequest) {
			req = new XMLHttpRequest();
		} else if (window.ActiveXObject) {
			req = new ActiveXObject('Microsoft.XMLHTTP');
		}
		if (!req) {
			return;
		} 
		req.onreadystatechange = stateChangeHandler;
		var url = '/scripts/php/getSiteData.php?site=' + siteID;
		req.open('GET',url, true);
		req.send(null);
	}

	function stateChangeHandler(){
		if (req.readyState === 4) { 
			if (req.status !== 200){
				if (reqAttempts < maxAttempts){
					reqAttempts++;
					fetchSite(siteID);
				}else {
					reqAttempts = 0;
					return;
				}
			}else {
				var xml = req.responseXML;
				if (xml.nodeType === 9){
					reqAttempts = 0;
					parseSite(xml);
					flushSitesLayerUL();
					placeInViewer(sData[siteID]);
					createSite(siteID);
					add2Selection(sData[siteID]);
					displaySites();
					twinkle(siteID, 600, 4);
				}else if  (reqAttempts < maxAttempts){
					reqAttempts++;
					fetchSite(siteID);
				}else {
					reqAttempts = 0;
					return;
				}
			}
		}else if (reqAttempts < maxAttempts){
					return;
		}else {
			reqAttempts = 0;
			return;
		}
	}
}

function recreateSites(){
	for (var s=0; s < sData.length; s++){
		createSite(sData[s].id);
		add2Selection(sData[s]);
		if (sData[s].shingle){
			var shingle = document.createElement('img');
			shingle.src = 'clips/shingles/' + sData[s].shingle;
			shingle.width = 225;
			shingle.height = 80;
			shingle.style.top = '0';
			shingle.style.left = '0';
			sData[s].shingle = shingle;
			add2shingleView(sData[s].shingle);
		}
		if (sData[s].thumbnail){
			var thumbnail = document.createElement('img');
			thumbnail.src = 'clips/thumbnails/' + sData[s].thumbnail;
			thumbnail.width = 150;
			thumbnail.height = 130;
			sData[s].thumbnail = thumbnail;
		}
	}
	displaySites();
}

function updateSession(toPage){
	var maxAttempts = 5;
	var reqAttempts = 0;
	var req;
	var sidx = '';
	var map = mViewer.map;
	var dim = mViewer.dimensions;
	if (sData.length > 0){
		for (var s=0; s < sData.length; s++){
			if (sData[s]){
				sidx += sData[s].idx + ',';
			}
		}
		sidx = sidx.slice(0,-1);
		sendSession();
	}else{
		window.location.href = toPage;
	}
	
	function sendSession(){
		if (window.XMLHttpRequest) {
			req = new XMLHttpRequest();
		} else if (window.ActiveXObject) {
			req = new ActiveXObject('Microsoft.XMLHTTP');
		}
		if (!req) {
			return;
		} 
		req.onreadystatechange = stateChangeHandler;
		var url = '/scripts/php/updateSession.php?x=' + map.center.x + '&y=' + map.center.y + '&s=' + dim.scale + '&sidx=' + sidx;
		req.open('GET',url, true);
		req.send(null);
	}

	function stateChangeHandler(){
		if (req.readyState === 4) { 
			if (req.status !== 200){
				if (reqAttempts < maxAttempts){
					reqAttempts++;
					sendSession();
				}else {
					reqAttempts = 0;
					return;
				}
			}else {
				window.location.href = toPage;
			}
		}else if (reqAttempts < maxAttempts){
					return;
		}else {
			reqAttempts = 0;
			return;
		}
	}
}

function parseSite(xml){
	var siteNode = xml.getElementsByTagName('site')[0];
	var id = siteNode.getElementsByTagName('id')[0].firstChild.nodeValue;
	var name = siteNode.getElementsByTagName('name')[0].firstChild.nodeValue;
	var floor = parseInt(siteNode.getElementsByTagName('floor')[0].firstChild.nodeValue,10);
	var top = parseInt(siteNode.getElementsByTagName('top')[0].firstChild.nodeValue,10);
	var left = parseInt(siteNode.getElementsByTagName('left')[0].firstChild.nodeValue,10);
	var width = parseInt(siteNode.getElementsByTagName('width')[0].firstChild.nodeValue,10);
	var height = parseInt(siteNode.getElementsByTagName('height')[0].firstChild.nodeValue,10);
	var idx = parseInt(siteNode.getElementsByTagName('idx')[0].firstChild.nodeValue,10);
	var days_remaining;
	if (siteNode.getElementsByTagName('days_remaining')[0]){
		days_remaining = parseInt(siteNode.getElementsByTagName('days_remaining')[0].firstChild.nodeValue,10);
	}else days_remaining = null;
	var shingleNode = siteNode.getElementsByTagName('shingle')[0];
	var shingle = null;
	if (shingleNode){
		shingle = document.createElement('img');
		shingle.src = 'clips/shingles/' + shingleNode.getElementsByTagName('filename')[0].firstChild.nodeValue;
		shingle.width = 225;
		shingle.height = 80;
		shingle.style.top = '0';
		shingle.style.left = '0';
	}
	var thumbnailNode = siteNode.getElementsByTagName('thumbnail')[0];
	var thumbnail = null;
	if (thumbnailNode){
		thumbnail = document.createElement('img');
		thumbnail.src = 'clips/thumbnails/' + thumbnailNode.getElementsByTagName('filename')[0].firstChild.nodeValue;
		thumbnail.width = 150;
		thumbnail.height = 130;
	}
	var sPageNode = siteNode.getElementsByTagName('sPage')[0];
	var sPage = null;
	if (sPageNode){
		sPage = sPageNode.getElementsByTagName('filename')[0];
	}
	var areasNode = siteNode.getElementsByTagName('areas')[0];
	var areas = [];
	var areaNodes = areasNode.getElementsByTagName('area');
	for (var a=0; a < areaNodes.length; a++){
		var area = new Array();
		var pointNodes = areaNodes[a].getElementsByTagName('point');
		for (var p=0; p < pointNodes.length; p++){
			area.push({'x': parseInt(pointNodes[p].getElementsByTagName('x')[0].firstChild.nodeValue,10),
				'y': parseInt(pointNodes[p].getElementsByTagName('y')[0].firstChild.nodeValue,10)});
		}
		areas.push(area);
	}
	sData.push({'id': id, 'name': name, 'floor': floor, 'top': top, 'left': left, 'width': width, 'height': height, 'idx': idx, 
			'days_remaining': days_remaining, 'shingle': shingle, 'thumbnail': thumbnail, 'areas': areas, 'sPage': sPage});
	sData[id] = sData[sData.length - 1];
	if (shingle){
		add2shingleView(shingle);
	}
}

function ulMouseOut(event){
	var ev = getEvent(event);
	var relTarg;
	if (ev.relatedTarget){ relTarg = ev.relatedTarget;}
	else if (ev.toElement){ relTarg = ev.toElement;}
	if (relTarg){
		if ((relTarg.className === 'surface') || (relTarg.className === 'siteIMG')){
			flushSitesLayerUL();
		}
	}
}

function ulMouseOver(event){
	var ev = getEvent(event);
	var trgt;
	if (isIEBrowser) {
		trgt = ev.srcElement;
	}
	else{
		trgt = ev.target;
	}
	var relTarg;
	if (ev.relatedTarget){ relTarg = ev.relatedTarget;}
	else if (ev.fromElement){ relTarg = ev.fromElement;}
	if ((relTarg.className === 'surface') || (relTarg.className == 'siteIMG') || relTarg.id === 'surfaceUL') {
		flushSitesLayerUL();
	}
}


function areaMouseOver(event){
	var ev = getEvent(event);
	var relTarg;
	if (ev.relatedTarget) relTarg = ev.relatedTarget;
	else if (ev.fromElement) relTarg = ev.fromElement;
	if (relTarg){
		if ((relTarg.className === 'surface') || (relTarg.className === 'siteIMG') || (relTarg.tagName === 'AREA') || (relTarg.tagName === 'UL')) {
			var relImg = this.parentNode.parentNode.getElementsByTagName('img')[0];
			var mouse = localizeCoordinates(relImg, {'x': ev.clientX, 'y': ev.clientY});
			mouse.x += parseInt(this.parentNode.parentNode.style.left,10);
			mouse.y += parseInt(this.parentNode.parentNode.style.top,10);
			flushSitesLayerUL();
			labelSitesHere(mouse);
		}
	}
}

function areaMouseMove(event){
	var ev = getEvent(event);
	var relImg = this.parentNode.parentNode.getElementsByTagName('img')[0];
	var mouse = localizeCoordinates(relImg, {'x': ev.clientX, 'y': ev.clientY});
	mouse.x += parseInt(this.parentNode.parentNode.style.left,10);
	mouse.y += parseInt(this.parentNode.parentNode.style.top,10);
	if (changedList(mouse) || !this.listed){
		flushSitesLayerUL();
		labelSitesHere(mouse);
	}
}

function areaMouseOut(event){
	var ev = getEvent(event);
		var relTarg;
		if (ev.relatedTarget) relTarg = ev.relatedTarget;
		else if (ev.toElement) relTarg = ev.toElement;
		if (relTarg){
		if ((relTarg.className === 'siteIMG') || (relTarg.className === 'surface')){
			var relImg = this.parentNode.parentNode.getElementsByTagName('img')[0];
			var mouse = localizeCoordinates(relImg, {'x': ev.clientX, 'y': ev.clientY});
			if ((relTarg.className == 'siteIMG') && (relTarg != relImg)){
				return;
			}
			flushSitesLayerUL();
			this.listed = false;
			}
		}
}
function areaMouseDown(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
}

function areaMouseUp(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
}

function imgOnMouseOut(event){
	var ev = getEvent(event);
		var relTarg;
		if (ev.relatedTarget) relTarg = ev.relatedTarget;
		else if (ev.toElement) relTarg = ev.toElement;
		if (relTarg){
			if (relTarg.className === 'surface'){
				flushSitesLayerUL();
			}
		}
}

function imgOnMouseDown(event){
	var ev = getEvent(event);
	var target;
	target = ev.target;
	var mouse;
	mouse = localizeCoordinates(this, {'x': ev.clientX, 'y': ev.clientY});
	alert(target.tagName.toUpperCase() + ' (x:'+ mouse.x + ', y:' + mouse.y + ')');
}

function imgOnMouseMove(event){
	var ev = getEvent(event);
	var target;
	target = ev.target;
	var mouse;
	if (target === this){
		mouse = localizeCoordinates(this, {'x': ev.clientX, 'y': ev.clientY});
	}else{
		mouse = localizeCoordinates(this, {'x': ev.clientX, 'y': ev.clientY});
		displayStatus(target.tagName.toUpperCase() + ' (x:'+ mouse.x + ', y:' + mouse.y + ')');
	}
	
	var status = document.getElementById('display-status');
}

function liOnMouseMove(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
}

function liOnMouseOut(event){

	var ev = getEvent(event);
	var relTarg;
	if (ev.relatedTarget) relTarg = ev.relatedTarget;
	else if (!ev.toElement) relTarg = ev.toElement;
		if (relTarg){
			if ((relTarg.className === 'surface') || (relTarg.className === 'siteIMG')){
				flushSitesLayerUL();
				this.site.area.listed = false;
			}
			else if (!isIEBrowser) {
				this.style.backgroundColor = '#555555';
				this.style.color = '#dddddd';
			}
		}
}

function liOnMouseOver(event){
	var ev = getEvent(event);
	var relTarg;
	if (ev.relatedTarget) relTarg = ev.relatedTarget;
	else if (!ev.fromElement) relTarg = ev.fromElement;
	this.style.backgroundColor = '#dddddd';
	this.style.color = '#555555';
	if (isIEBrowser) {
		if (this.nextSibling){
			var nextLI = this.nextSibling.nextSibling;
			nextLI.style.backgroundColor = '#555555';
			nextLI.style.color = '#dddddd';
		}
		var previousLI = this.previousSibling.previousSibling;
		if (previousLI){
			previousLI.style.backgroundColor = '#555555';
			previousLI.style.color = '#dddddd';
		}
	}
}
	
function liOnMouseDown(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
}

function submitSearch(){
	var keywordList = document.getElementById('searchKeywordsForm').elements['searchWords'].value;
	var maxAttempts = 5;
	var reqAttempts = 0;
	var req;
	
	if (keywordList){
		var regEx = /[^a-zA-Z0-9 ]/g;
		keywordList = keywordList.replace(regEx,'');
		var searchResults = document.getElementById('searchResults');
		var listItemArray = [];
		for (var s=0; s < searchResults.childNodes.length; s++){
			listItemArray.push(searchResults.childNodes[s]);
		}
		for (var l=0; l < listItemArray.length; l++){
			searchResults.removeChild(listItemArray[l]);
			listItemArray[l] = undefined;
		}
		sendRequest();
	}
	
	function sendRequest(){
		if (window.XMLHttpRequest) {
			req = new XMLHttpRequest();
		} else if (window.ActiveXObject) {
			req = new ActiveXObject('Microsoft.XMLHTTP');
			if (!req) {
				return;
			} 
		}
		req.onreadystatechange = stateChangeHandler;
		var url = '/scripts/php/keyword_search.php?keywordList=' + keywordList;
		req.open('GET',url, true);
		req.send(null);
	}

	function stateChangeHandler()
	{
		if (req.readyState === 4) { 
			if (req.status !== 200){
				if (reqAttempts < maxAttempts){
					reqAttempts++;
					sendRequest();
				}else {
					reqAttempts = 0;
					return;
				}
			}else {
				var xml = req.responseXML;
				if (xml.nodeType === 9){
					reqAttempts = 0;
					parseSeveralSites(xml);
				}else if  (reqAttempts < maxAttempts){
					reqAttempts++;
					sendRequest();
				}else {
					reqAttempts = 0;
					return;
				}
			}
		}else if (reqAttempts < maxAttempts){
					return;
				}
		else {
			reqAttempts = 0;
			return;
		}
	}
	return false;
}

function submitOnEnterKey(evt){
	evt = (evt) ? evt : (window.event) ? window.event : '';
	var theKey;
	if (evt) {
		theKey = (evt.which) ? evt.which : evt.keyCode;
		if (theKey === 13){
			submitSearch();
			return false;
		}else return true;
	}
	
}

function removeSelections(){
	var selectionList = document.getElementById('selectionList');
	var surface = document.getElementById('surface');
	var listItems = selectionList.getElementsByTagName('li');
	var siteID;
	var shingle;
	var removalSet = [];
	var retainSet = [];
	for (var l=0; l < listItems.length; l++){
		if (listItems[l].getElementsByTagName('form')[0].getElementsByTagName('input')[0].checked){
			removalSet.push(listItems[l]); 
		}else{
			retainSet.push(listItems[l]); 
		}
	}
	for (var r=0; r<removalSet.length; r++){
		var siteID = removalSet[r].site.id;
		surface.removeChild(document.getElementById('sit' + siteID));
		for (var s=0; s < sData.length; s++){
			if (sData[s] === sData[siteID]){
				delete sData[s];
				sData[siteID] = undefined;
				break;
			}
		}
		selectionList.removeChild(removalSet[r]);
	}		
	svList = [];
	for (var r=0; r< retainSet.length; r++){
		if (retainSet[r].site.shingle){
			svList.push(retainSet[r].site.shingle);
		}
	}
	if (svIndex < svList.length - 2){
		svIndex++;
	}
	else{ svIndex = 0;}
	if (svList.length === 0){
		var shingleImage = document.getElementById('shingleImage');
		shingleImage.src = 'clips/shingles/Shinjang_shingle.gif';
		shingleImage.width = 225;
		shingleImage.height = 80;
		shingleImage.style.top = '0';
		shingleImage.style.left = '0';
		clearInterval(svIntervalHandle);
		svIntervalHandle = undefined;
	}else{
		var shingleViewer = document.getElementById('site-shingle-viewer');
		var currentImage = shingleViewer.getElementsByTagName('img')[0];
		shingleViewer.replaceChild(svList[svIndex],currentImage);
	}
	displaySites();
}

function listSearchResults(xml){
	var sitesNode = xml.getElementsByTagName('sites')[0];
	var sites = sitesNode.getElementsByTagName('site');
	var searchResults = document.getElementById('searchResults');
	var id;
	var name;
	for (var s=0; s < sites.length; s++){
		id = sites[s].getElementsByTagName('id')[0].firstChild.nodeValue;
		name = sites[s].getElementsByTagName('name')[0].firstChild.nodeValue;
		var li = document.createElement('li');
		var form = document.createElement('form');
		form.name = 'searchResultForm';
		var input = document.createElement('input');
		input.type = 'checkbox';
		input.name = 'searchResultCheckbox';
		div = document.createElement('div');
		var span = document.createElement('span');
		span.appendChild(document.createTextNode(name));
		form.appendChild(input);
		li.appendChild(span);
		li.appendChild(form);
		li.siteID = id;
		searchResults.appendChild(li);
	}
}

function addSearchedSites(){
	var searchResults = document.getElementById('searchResults');
	var listItems = searchResults.getElementsByTagName('li');
	if (listItems.length === 0){ return;}
	var removedLIs = [];
	for (var l=0; l < listItems.length; l++){
		var form = listItems[l].getElementsByTagName('form')[0];
		var checkbox = form.getElementsByTagName('input')[0];
		if (checkbox.checked && !sData[listItems[l].siteID]){
			sData.push(searchResultsData[listItems[l].siteID]);
			sData[listItems[l].siteID] = sData[sData.length - 1];
			add2Selection(searchResultsData[listItems[l].siteID]);
			createSite(listItems[l].siteID);
			if (searchResultsData[listItems[l].siteID].shingle){
				var shingle = searchResultsData[listItems[l].siteID].shingle;
				add2shingleView(shingle);
			}
			delete searchResultsData[listItems[l].siteID];
			searchResultsData[listItems[l].siteID] = undefined;
			removedLIs.push(listItems[l]);
		}
	}
	for (var r=0; r < removedLIs.length; r++){
		searchResults.removeChild(removedLIs[r]);
	}
	displaySites();
}

function parseSeveralSites(xml){
	var sitesNode = xml.getElementsByTagName('sites')[0];
	if (!sitesNode) return;
	var sites = sitesNode.getElementsByTagName('site');
	var searchResults = document.getElementById('searchResults');
	searchResultsData = [];
	for (var s=0; s < sites.length; s++){
		var id = sites[s].getElementsByTagName('id')[0].firstChild.nodeValue;
		if (sData[id]){ continue;}
		var name = sites[s].getElementsByTagName('name')[0].firstChild.nodeValue;
		var li = document.createElement('li');
		var form = document.createElement('form');
		form.name = 'searchResultForm';
		var input = document.createElement('input');
		input.type = 'checkbox';
		input.name = 'searchResultCheckbox';
		div = document.createElement('div');
		var span = document.createElement('span');
		span.appendChild(document.createTextNode(name));
		form.appendChild(input);
		li.appendChild(span);
		li.appendChild(form);
		li.siteID = id;
		searchResults.appendChild(li);
		var floor = parseInt(sites[s].getElementsByTagName('floor')[0].firstChild.nodeValue,10);
		var top = parseInt(sites[s].getElementsByTagName('top')[0].firstChild.nodeValue,10);
		var left = parseInt(sites[s].getElementsByTagName('left')[0].firstChild.nodeValue,10);
		var width = parseInt(sites[s].getElementsByTagName('width')[0].firstChild.nodeValue,10);
		var height = parseInt(sites[s].getElementsByTagName('height')[0].firstChild.nodeValue,10);
		var idx = parseInt(sites[s].getElementsByTagName('idx')[0].firstChild.nodeValue,10);
		var days_remaining;
		if (sites[s].getElementsByTagName('days_remaining')[0]){
			days_remaining = parseInt(sites[s].getElementsByTagName('days_remaining')[0].firstChild.nodeValue,10);
		}
		else days_remaining = null;
		var shingleNode = sites[s].getElementsByTagName('shingle')[0];
		var shingle = null;
		if (shingleNode){
			shingle = document.createElement('img');
			shingle.src = 'clips/shingles/' + shingleNode.getElementsByTagName('filename')[0].firstChild.nodeValue;
			shingle.width = 225;
			shingle.height = 80;
		}
		var thumbnailNode = sites[s].getElementsByTagName('thumbnail')[0];
		var thumbnail = null;
		if (thumbnailNode){
			thumbnail = document.createElement('img');
			thumbnail.src = 'clips/thumbnails/' + thumbnailNode.getElementsByTagName('filename')[0].firstChild.nodeValue;
			thumbnail.width = tWidth = 150;
			thumbnail.height = tHeight = 130;
		}
		var sPageNode = sites[s].getElementsByTagName('sPage')[0];
		var sPage = null;
		if (sPageNode){
			sPage = sPageNode.getElementsByTagName('filename')[0];
		}
		var areasNode = sites[s].getElementsByTagName('areas')[0];
		var areas = [];
		var areaNodes = areasNode.getElementsByTagName('area');
		for (var a=0; a < areaNodes.length; a++){
			var area = new Array();
			var pointNodes = areaNodes[a].getElementsByTagName('point');
			for (var p=0; p < pointNodes.length; p++){
				area.push({'x': parseInt(pointNodes[p].getElementsByTagName('x')[0].firstChild.nodeValue,10),
					'y': parseInt(pointNodes[p].getElementsByTagName('y')[0].firstChild.nodeValue,10)});
			}
			areas.push(area);
		}
		searchResultsData.push({'id': id, 'name': name, 'floor': floor, 'top': top, 'left': left, 'width': width, 'height': height, 'idx': idx,
						'days_remaining': days_remaining, 'shingle': shingle, 'thumbnail': thumbnail, 'areas': areas, 'sPage': sPage});
		searchResultsData[id] = searchResultsData[searchResultsData.length - 1];
	}
}

function selectLIOnMouseOver(){
	var site = this.parentNode.site;
	var box = document.getElementById('sit' + site.id);
	var ul = document.getElementById('surfaceUL');
	var top = parseInt(box.style.top,10);
	var bottom = parseInt(box.style.top,10) + parseInt(box.style.height,10);
	var left = parseInt(box.style.left,10);
	var right = parseInt(box.style.left,10) + parseInt(box.style.width,10);
	var listItem = document.createElement('li');
	box.style.zIndex = highestFloor + 1;
	listItem.innerHTML = site.name;
	listItem.style.backgroundColor = '#555555';
	listItem.style.color = '#dddddd';
	flushSitesLayerUL();
	ul.appendChild(document.createTextNode('\n'));
	ul.appendChild(listItem);
	ul.style.top = Math.ceil((top + bottom) / 2) + 'px';
	ul.style.left = Math.ceil((left + right) / 2) + 'px';
	ul.style.visibility = 'visible';
}

function selectLIOnMouseOut(){
	var site = this.parentNode.site;
	var box = document.getElementById('sit' + site.id);
	box.style.zIndex = box.site.floor;
	var ul = document.getElementById('surfaceUL');
	ul.style.visibility = 'visible';
	flushSitesLayerUL();
}

function add2shingleView(shingle){
	svList.push(shingle);
	svIndex = svList.length - 1;
	var shingleViewer = document.getElementById('site-shingle-viewer');
	var currentImage = shingleViewer.getElementsByTagName('img')[0];
	shingleViewer.replaceChild(svList[svIndex],currentImage);
	if (!svIntervalHandle){
		svIntervalHandle = setInterval(runShingleViewer, 4000);
	}
}

function runShingleViewer(){
	var shingleViewer = document.getElementById('site-shingle-viewer');
	var currentImage = shingleViewer.getElementsByTagName('img')[0];
	shingleViewer.replaceChild(svList[svIndex],currentImage);
	if (svIndex < svList.length - 1){ svIndex++;}
	else{ svIndex = 0;}
	return false;
}


function siteClicked(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
	var site;
	if (this.tagName === "LI"){
		site = this.site;
		this.parentNode.style.visibility = 'hidden';
	}
	if (this.parentNode.tagName === "LI"){
		site = this.parentNode.site;
	}
	if (this.parentNode.tagName === "MAP"){
		site = this.parentNode.parentNode.site;
	}
	if (sData[site.id].sPage){
		openSite(site.id);
	}
}
/*
function siteClicked(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
	var site;
	//var winAttribs;
	if (this.tagName === "LI"){
		site = this.site;
		this.parentNode.style.visibility = 'hidden';
	}
	if (this.parentNode.tagName === "LI"){
		site = this.parentNode.site;
	}
	if (this.parentNode.tagName === "MAP"){
		site = this.parentNode.parentNode.site;
	}
	siteDisplay = window.open('sPages/'+ site.id + '.html','SiteDisplay');
	siteDisplay.focus();
	siteDisplay.onload = function (){siteDisplay.mapPage = mapPage;};
	var localMP = mapPage;
	var remoteMP = siteDisplay.mapPage;
}
*/
/*
function siteClicked(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
	var site;
	var winAttribs;
	if (this.tagName =="LI"){
		site = this.site;
		this.parentNode.style.visibility = 'hidden';
	}
	if (this.parentNode.tagName =="LI")
		site = this.parentNode.site;
	if (this.parentNode.tagName =="MAP")
		site = this.parentNode.parentNode.site;
	if (sData[site.id].days_remaining != null){
		var sdForm = document.createElement('form');
		sdForm.action = 'php/displaySite.php';
		sdForm.method = 'GET';
		sdForm.target = 'SiteDisplay';
		sdForm.style.display = 'none';
		var sdFormSite = document.createElement('input');
		sdFormSite.type = 'text';
		sdFormSite.name = 'site';
		sdFormSite.value = site.id;
		sdForm.appendChild(sdFormSite);
		document.body.appendChild(sdForm);
		winAttribs = 'width=800,height=' + (screen.height - 75) + ',top=0,left=' + Math.ceil(screen.width / 2 - 400) + ',menubar=1,resizable=1';
		if (siteDisplay) siteDisplay.close();
		siteDisplay = window.open('sDisplay.html','SiteDisplay',winAttribs);
		sdForm.submit();
		document.body.removeChild(sdForm);
	}
	else {
		var siteName = sData[site.id].name;
		var thumbnail = sData[site.id].thumbnail.src;
		var pWidth = sData[site.id].thumbnail.width;
		var pHeight = sData[site.id].thumbnail.height;
		var pOffset = 5;
		var winWidth = Math.ceil(pWidth + pOffset * 3);
		var winHeight = pHeight + 150;
		var winLeft = Math.ceil((screen.width - (pWidth + (pOffset * 2))) / 2);
		winAttribs = 'height=' + winHeight +',top=15,width=' + winWidth + ',left=' + winLeft;
		if (siteDisplay) siteDisplay.close();
		sdData = {'title': siteName, 'src': thumbnail, 'top': pOffset, 'left': pOffset,
					'height': pHeight,'width': pWidth, 'winHeight': winHeight, 'winWidth': winWidth};
		siteDisplay = window.open('SiteDisplay.html','SiteDisplay',winAttribs);
	}
}
*/
function openPrintPage(){
	var resTest = document.createElement('div');
	resTest.style.visibility = 'hidden';
	resTest.style.height = '1in';
	resTest.style.width = '1in';
	document.body.appendChild(resTest);
	var pageWidth = Math.ceil(resTest.clientWidth * 7.5);
	var pageHeight = Math.ceil(resTest.clientHeight * 10.5);
	var winLeft = Math.ceil((screen.width - pageWidth) / 2);
	document.body.removeChild(resTest);
	if (printPage){ printPage.close();}
	printPage = window.open('PrintPage.html','printPage','width='+ pageWidth + ',height=' + pageHeight + ',top=15,left=' + winLeft + ',scrollbars=1,menubar=1');
}

function addUserLandmark(event){
	var ev = getEvent(event);
	ev.cancelBubble = true;
	var mouse = localizeCoordinates(this, {'x': ev.clientX, 'y': ev.clientY});
	if (this.className === 'surface'){
		var userLMs = [];
		for (var s=0; s < sData.length; s++){
			if (sData[s]){
				if (sData[s].id.match(/^USERLM\d+$/)){
					userLMs.push(parseInt(sData[s].id.substr(6),10));
				}
			}
		}
		userLMs.sort(compareLabelNumbers);
		var labelNumber = 1;
		for (var u=0; u <= userLMs.length; u++){
			if (userLMs[u] != u + 1){
				labelNumber = u + 1;
				break;
			}
		}
		var newLabel = prompt('Enter a label for landmark.','UNLABELED');
	} 
	if (!newLabel ){ return;}
	var area = [];
	area.push({'x': 0, 'y': 0});
	area.push({'x': 0, 'y': 30});
	area.push({'x': 30, 'y': 30});
	area.push({'x': 30, 'y': 0});
	area.push({'x': 0, 'y': 0});
	var map = mViewer.map;
	var dim = mViewer.dimensions;
	//var mapData =  document.body.mapData;
	var scaleAdj = mapData.scales[0].width / mapData.scales[dim.scale].width;
	var userLMTop = Math.ceil((map.center.y - (dim.height / 2) + mouse.y) * scaleAdj) - 15;
	var userLMLeft = Math.ceil((map.center.x - (dim.width / 2) + mouse.x) * scaleAdj) - 15;
	var userLMId = 'USERLM' + labelNumber;
	if (newLabel === 'UNLABELED'){ newLabel = 'UNLABELED' + labelNumber;}
	sData.push({'id': userLMId, 'name': newLabel, 'floor': 1, 'top': userLMTop, 'left': userLMLeft, 'width': 30, 'height': 30, 
					'shingle': null, 'thumbnail': null, 'areas': Array(area)});
	sData[userLMId] = sData[sData.length - 1];
	add2Selection(sData[userLMId]);
	createSite(userLMId);
	displaySites();
}

function compareLabelNumbers(userLM1, userLM2){
	return userLM1 - userLM2;
}
