// JavaScript Document

function pageWidth() {
	return window.innerWidth != null? window.innerWidth: document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth:document.body != null? document.body.clientWidth:null;
}

function pageHeight() {
	return window.innerHeight != null? window.innerHeight: document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight:document.body != null? document.body.clientHeight:null;
}

function posLeft() {
	return typeof window.pageXOffset != 'undefined' ? window.pageXOffset:document.documentElement && document.documentElement.scrollLeft? document.documentElement.scrollLeft:document.body.scrollLeft? document.body.scrollLeft:0;
}

function posTop() {
	return typeof window.pageYOffset != 'undefined' ? window.pageYOffset:document.documentElement && document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0;
}

function createWindow(nUrl, nName, attr) {
	var xwin = window.open(nUrl, nName, attr); 
}

function displayImageInWindow( imageUrl, name ) {
	var img = new Image();
	img.src = imageUrl;
	
	var w;
	var h;
	img.onload = function(){
		w = img.width;
		h = img.height;
		
		var attr = "width=" + (w + 10) + ", height=" + ( h + 40 ) + ", location = false, status = false, left = 100, top = 100, screenX 	= 100, screenY = 100";
	
		var nwin = window.open( "blankAux.html", name, attr );
	
		nwin.onload = function() {
			nwin.document.getElementById( "imageBig" ).src = imageUrl;
			nwin.document.title = name;
		}
	}
}

function openImageDisplayWindow( imageUrl, title ) {
	var img = new Image();
	img.src = imageUrl;
	
	var w;
	var h;
	img.onload = function(){
		w = img.width;
		h = img.height;
		document.getElementById( "centerArea" ).innerHTML = "<h4>" + title + "</h4><img src='" + imageUrl + "' width='" + w + "' " + "height= '" + h + "' />";  
		
		var tp = posTop()+(pageHeight() - h)/2 - 10;
		var lt = posLeft()+(pageWidth() - w)/2 + 10;
		
		dw = document.getElementById( "displayWindow" );
		dw.style.top = tp + "px";
		dw.style.left = lt + "px";
		dw.style.visibility = "visible";
		
	} 
}

function hideImageDisplayWindow() {
	document.getElementById( "displayWindow" ).style.visibility = "hidden";
}


function showBigPicture( imageURL ) {
	var img = new Image();
	img.src = imageURL;
	
	var bias = 0;
	
	img.onload = function() {
	
		var cont = document.getElementById( "bigPicture" );
		cont.style.width = (img.width + bias) + "px";
		cont.style.height = (img.height + bias) + "px";
		cont.innerHTML = "<img src='" + imageURL + "' width='" + img.width + "' height='" + img.height + "' onmousedown='dragElems( \"bigPicture\", \"buttonsOnBigPicture\", event )' />";
		
		var tp = posTop()+(pageHeight() - img.height - bias)/2;
		var lt = posLeft()+(pageWidth() - img.width - bias)/2;
		
		cont.style.top = tp + "px";
		cont.style.left = lt + "px";
		
		cont.style.visibility = "visible";
		
		var but = document.getElementById("buttonsOnBigPicture");
		but.style.top = (tp + 10) + "px";
		but.style.left = (lt + img.width - 100) + "px";
		but.style.visibility = "visible";
	}
}

function hideBigPicture() { 
	document.getElementById( "bigPicture" ).style.visibility = "hidden";
	document.getElementById("buttonsOnBigPicture").style.visibility = "hidden"; 
}

function buttonLoad() {
	
	var but_normal = new Image();
	but_normal.src = "../images/but_normal.png";
	
	var but_armed = new Image();
	but_armed.src = "../images/but_armed.png";
	
	var but_pressed = new Image();
	but_pressed = "../images/but_pressed.png";
	
	var buttons = document.getElementsByClassName("button");
	for( var i = 0; i < buttons.length; i++ ) {
		buttons[i].style.backgroundImage = "url(../images/but2_normal.png)";
	}
}

function buttonChanged( source, changeType ) {
	if( source ) {
		if( changeType == "arm" ) {
			source.style.backgroundImage = "url(../images/but2_armed.png)";	
		}
		else if( changeType == "disarm" ) {
			source.style.backgroundImage = "url(../images/but2_normal.png)";
		}
		else if( changeType == "press" ) {
			source.style.backgroundImage = "url(../images/but2_pressed.png)";
		}
		else if( changeType == "release") {
			source.style.backgroundImage = "url(../images/but2_armed.png)";		
		}
	}
}

function linkClicked(source, url) {
	buttonChanged( source, "disarm" );
	if( url ) {
		goToURL( url );
	}
}

function goToURL( url ) {
	location = url;
}

function menu_rollover(source, url) {
	if( source && url ) {
		source.style.backgroundImage = "url(" + url + ")";
	}
}

function menu_click(source, newURL, imageURL) {
	if(source) {
		source.style.backgroundImage = "url(" + imageURL + ")";
		goToURL( newURL );
	}
}

function image_rollover(source, imageURL) {
	if(source && imageURL) {
		source.src = imageURL;
	}
}

function showMessageDialog() {
	var tp = posTop()+((pageHeight())/2)-117;
	var lt = posLeft()+((pageWidth())/2)-165;
	mDialog = document.getElementById( "messageDialog" );
	mDialog.style.top = tp + "px";
	mDialog.style.left = lt + "px";
	mDialog.style.visibility = "visible";	
}

function hideMessageDialog() {
	document.getElementById( "messageDialog" ).style.visibility = "hidden";
}

function showReasons() {
	document.getElementById( "tenReasons" ).style.visibility = "visible";
}

function hideReasons() {
	document.getElementById( "tenReasons" ).style.visibility = "hidden";
}

function removeElem( elemId ) {
	elem = document.getElementById( elemId );
	if( elem )
		elem.parentNode.removeChild( elem );
}

function dragElem( elemId, event ) {
	elem = document.getElementById( elemId );
	if( elem )
		drag( elem, event );
}

function dragElems( elem1Id, elem2Id, event ) {
	var elem1 = document.getElementById( elem1Id );
	var elem2 = document.getElementById( elem2Id );
	
	if( elem1 && elem2 ) {
		dragMultiple( elem1, elem2, event );
	}
}

function drag( elementToDrag, event ) {
	var startX = event.clientX, startY = event.clientY;
	var origX = elementToDrag.offsetLeft, origY = elementToDrag.offsetTop;
	
	var deltaX = startX - origX, deltaY = startY - origY;
	
	if( document.addEventListener ) {
		document.addEventListener( "mousemove", moveHandler, true );
		document.addEventListener( "mouseup", upHandler, true );
	}
	else if( window.attachEvent ) {
		elementToDrag.setCapture();
		elementToDrag.attachEvent( "onmousemove", moveHandler );
		elementToDrag.attachEvent( "onmouseup", upHandler );
		elementToDrag.attachEvent( "onlosecapture", upHandler );
	}
	else {
		var oldmovehandler = document.onmousemove;
		var olduphandler = document.onmouseup;
		document.onmousemove = moveHandler;
		document.onmouseup = upHandler;
	}
	
	if( event.stopPropagation ) event.stopPropagation();
	else event.cancelBubble = true;
	
	if( event.preventDefault ) event.preventDefault();
	else event.returnValue = false;
	
	function moveHandler(e) {
		if(!e) e = document.event;
		
		elementToDrag.style.left = (e.clientX - deltaX) + "px";
		elementToDrag.style.top = (e.clientY - deltaY) + "px";
		
		if(e.stopPropagation) e.stopPropagation();
		else e.cancelBubble = true;
	}
	
	function upHandler(e) {
		if(!e) e = window.event;
		
		if( document.removeEventListener) {
			document.removeEventListener( "mousemove", moveHandler, true );
			document.removeEventListener( "mouseup", upHandler, true );
		}
		else if( document.detachEvent ) {
			elementToDrag.detachEvent( "onclosecapture", upHandler );
			elementToDrag.detachEvent( "onmouseup", upHandler );
			elementToDrag.detachEvent( "onmousemove", moveHandler );
			elementToDrag.releaseCapture();
		}
		else {
			document.onmouseup = olduphandler;
			document.onmousemove = oldmovehandler;
		}
		
		if(e.stopPropagation) e.stopPropagation(); 
		else e.cancelBubble = true;
	}
}

function dragMultiple( elementToDrag, elementAlong, event ) {
	var startX = event.clientX, startY = event.clientY;
	var origX = elementToDrag.offsetLeft, origY = elementToDrag.offsetTop;
	var origX2 = elementAlong.offsetLeft, origY2 = elementAlong.offsetTop;
	
	var deltaX = startX - origX, deltaY = startY - origY;
	var deltaX2 = startX - origX2, deltaY2 = startY - origY2;
	
	if( document.addEventListener ) {
		document.addEventListener( "mousemove", moveHandler, true );
		document.addEventListener( "mouseup", upHandler, true );
	}
	else if( window.attachEvent ) {
		elementToDrag.setCapture();
		elementToDrag.attachEvent( "onmousemove", moveHandler );
		elementToDrag.attachEvent( "onmouseup", upHandler );
		elementToDrag.attachEvent( "onlosecapture", upHandler );
	}
	else {
		var oldmovehandler = document.onmousemove;
		var olduphandler = document.onmouseup;
		document.onmousemove = moveHandler;
		document.onmouseup = upHandler;
	}
	
	if( event.stopPropagation ) event.stopPropagation();
	else event.cancelBubble = true;
	
	if( event.preventDefault ) event.preventDefault();
	else event.returnValue = false;
	
	function moveHandler(e) {
		if(!e) e = document.event;
		
		elementToDrag.style.left = (e.clientX - deltaX) + "px";
		elementToDrag.style.top = (e.clientY - deltaY) + "px";
		elementAlong.style.left = (e.clientX - deltaX2) + "px";
		elementAlong.style.top = (e.clientY - deltaY2) + "px";
		
		if(e.stopPropagation) e.stopPropagation();
		else e.cancelBubble = true;
	}
	
	function upHandler(e) {
		if(!e) e = window.event;
		
		if( document.removeEventListener) {
			document.removeEventListener( "mousemove", moveHandler, true );
			document.removeEventListener( "mouseup", upHandler, true );
		}
		else if( document.detachEvent ) {
			elementToDrag.detachEvent( "onclosecapture", upHandler );
			elementToDrag.detachEvent( "onmouseup", upHandler );
			elementToDrag.detachEvent( "onmousemove", moveHandler );
			elementToDrag.releaseCapture();
		}
		else {
			document.onmouseup = olduphandler;
			document.onmousemove = oldmovehandler;
		}
		
		if(e.stopPropagation) e.stopPropagation(); 
		else e.cancelBubble = true;
	}
}