/***
 *
 *	Javascript for Common Utilities.
 * 
 */




var dragObject  = null;
var mouseOffset = null;

function mouseCoords(ev){

	var x;
	var y;
	
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	if(document.body && (ev.clientX || ev.clientY)) {
		return {
			x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
			y:ev.clientY + document.body.scrollTop  - document.body.clientTop
		};
	}//*** end if
}

function getMouseOffset(target, ev){
	ev = ev || window.event;

	var docPos    = getPosition(target);
	var mousePos  = mouseCoords(ev);
	return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}

function getPosition(e){

	var left = 0;
	var top  = 0;

	while (e.offsetParent){
		left += e.offsetLeft;
		top  += e.offsetTop;
		e     = e.offsetParent;
	}

	left += e.offsetLeft;
	top  += e.offsetTop;

	return {x:left, y:top};
}

function mouseMove(ev){
	
	ev           = ev || window.event;
	var mousePos = mouseCoords(ev);
	
	if(dragObject != null) {
		dragObject.style.position = 'absolute';
		dragObject.style.top = (mousePos.y - mouseOffset.y) + 'px';
		dragObject.style.left = (mousePos.x - mouseOffset.x) + 'px';
		
		return false;
	}//*** end if
}

function mouseUp(itemName){
	var item = document.getElementById(itemName);
		
	if(!item) {
		return;
	}//*** end if
	else {
		item.onmouseup = function(ev) {
			dragObject = null;
		}//*** end function
	}//*** end else
	
	item = null;
}

function makeDraggable(itemName){
	document.onmousemove = mouseMove;
	document.onmouseup   = mouseUp;
	
	var item = document.getElementById(itemName);
		
	if(!item) {
		return;
	}//*** end if
	else {
		item.onmousedown = function(ev) {
			dragObject  = this;
			mouseOffset = getMouseOffset(this, ev);
			return false;
		}//*** end function

		item.onmouseup = function(ev) {
			if(dragObject != null) {
				dragObject.onmousedown = null;
				dragObject = null;
			}//*** end if
			return false;
		}//*** end function
	}//*** end else
	
	item = null;
}

/**************************************************************
 * Toggle element functions 
 *  - if a [+] is found, turns to [-] and vice versa
 *
 **************************************************************/
function toggleModule(moduleName, newStyle, linkControl) {
	var targetModule = document.getElementById(moduleName);
	if(newStyle == null) {
		newStyle = 'block';
	}//*** end if
	
	if(targetModule.style.display == 'none') {
		targetModule.style.display = newStyle;
		if(linkControl != null) {
			changeLink(linkControl);
		}//*** end if
	}//*** end if
	else {
		targetModule.style.display = 'none';
		if(linkControl != null) {
			changeLink(linkControl);
		}//*** end if
	}//*** end else
}

function changeLink(linkControl) {
	if(document.getElementById(linkControl)) {
		var targetModule = document.getElementById(linkControl);
		var linkText = targetModule.innerHTML;
		if(linkText.indexOf("[+]") > -1) {
			linkText = linkText.replace(/\+/, '-');
			targetModule.innerHTML = linkText;
		}//*** end if
		else if(linkText.indexOf("[-]") > -1) {
			linkText = linkText.replace(/-/, '+');
			targetModule.innerHTML = linkText;
		}//*** end if
	}//*** end if
}

function newToggleModule(moduleName, objectName, closeOthers, newStyle) {
	var targetModule = document.getElementById(moduleName);
	if(newStyle == null || newStyle == '') {
		newStyle = 'inline';
	}//*** end if
	
	if(closeOthers) {
		document.getElementsByName(objectName).style.display = 'none';
		if(document.getElementById(objectName + '-arrows') != null) {
			document.getElementById(objectName + '-arrows').innerHTML = '&raquo';
		}//*** end if
	}//*** end if
	
	if(targetModule != null) {
		targetModule.style.display = newStyle;
		if(document.getElementById(moduleName + '-arrows') != null) {
			document.getElementById(moduleName + '-arrows').innerHTML = '&laquo';
		}//*** end if
	}//*** end if
}


//*** div/span zoom and center functions
function findOffset(elementName) {
	var clientWindow = window;
	var clientFrame = window.document;
	var scrollTop = clientFrame.body.scrollTop;
	var topBuffer = 100;
	
	if (scrollTop == 0) {
		if (clientWindow.pageYOffset) {
			scrollTop = clientWindow.pageYOffset;
		}//*** end if
		else {
			scrollTop = (clientFrame.body.parentElement) ? clientFrame.body.parentElement.scrollTop : 0;
		}//*** end else
	}//*** end if

	var screenDimensions = getPageDimensions(clientWindow);
	var pageWidth = screenDimensions.x;
	var pageHeight = screenDimensions.y;
	
	
	var targetElement = document.getElementById(elementName);
	var elementWidth = targetElement.style.width;
	if(elementWidth.indexOf("px") > 0) {
		elementWidth = elementWidth.substr(0, elementWidth.indexOf("px"));
	}//*** end if
	elementWidth = elementWidth * 1;
	
	var middleOfPage = pageWidth/2;
	if(!elementWidth || isNaN(elementWidth)) {
		targetElement.style.left = (middleOfPage-400) + 'px';
	}//*** end if
	else {
		targetElement.style.left = (middleOfPage -(elementWidth/2)) + 'px';
	}//*** end else

	if(scrollTop + topBuffer > pageHeight) {
		targetElement.style.top = "0px;";
	}//*** end if
	else {
		targetElement.style.top = scrollTop + topBuffer + 'px';
	}//*** end else
	
}

function getPageDimensions(pageElement) {
	var pageWidth = pageElement.innerWidth;
	var pageHeight = pageElement.innerHeight;

	if(typeof pageWidth != "number") {
		if(document.compatMode == "CSS1Compat") {
			pageWidth = pageElement.document.documentElement.clientWidth;
			pageHeight = pageElement.document.documentElement.clientHeight;
		}//*** end if
		else {
			pageWidth = pageElement.document.body.clientWidth;
			pageHeight = pageElement.document.body.clientHeight;
		}//*** end else

	}//*** end if

	return {x:pageWidth, y:pageHeight};
}

function calendarOffset(elementName, event) {
	
	var targetElement = document.getElementById(elementName);
	var elementWidth = targetElement.style.width;
	elementWidth = elementWidth.substr(0, elementWidth.indexOf("px"));
	elementWidth = elementWidth * 1;
	
	var middleOfPage = document.documentElement.clientWidth/2;
	if(!elementWidth || isNaN(elementWidth)) {
		targetElement.style.left = (middleOfPage-400) + 'px';
	}//*** end if
	else {
		targetElement.style.left = (middleOfPage -(elementWidth/2)) + 'px';
	}//*** end else
	
	targetElement.style.top = '20px';
}

/***************************************************************
 * Help floater functions.
 * - These require the calling page to have a div or span tag 
 *   to act upon.  The tag must have display set to none in a 
 *   style attribute, not in a css sheet.
 **************************************************************/ 
function findXAndY(evt) {
	//*** find X and Y with scrolling
	var docX = 0;
	var docY = 0;
	if(evt) {
		if(typeof(evt.pageX) == 'number') {
			docX = evt.pageX;
			docY = evt.pageY;
		}//*** end if
		else {
			docX = evt.clientX;
			docY = evt.clientY;
		}//*** end else
	}//*** end if
	else {
		evt = window.event;
		docX = evt.clientX;
		docY = evt.clientY;
	}//*** end else

	if(document.documentElement
		&& (document.documentElement.scrollTop
		|| document.documentElement.scrollLeft)) {

		docX += document.documentElement.scrollLeft;
		docY += document.documentElement.scrollTop;

	}//*** end if
	else if( document.body
		&& ( document.body.scrollTop
		 || document.body.scrollLeft)) {

		docX += document.body.scrollLeft;
		docY += document.body.scrollTop;

	}//*** end else
	
	return {x:docX, y:docY};
}

function showHelpFloater(floaterId, evt) {
	var currentCoordinates = findXAndY(evt);
	
	//*** find X and Y with scrolling
	var docX = currentCoordinates.x;
	var docY = currentCoordinates.y;
	
	var offset = 20;

	//*** find element width and height
	var elementWidth = document.getElementById(floaterId).style.width;
	elementWidth = elementWidth.substr(0, elementWidth.indexOf("px"));
	elementWidth = elementWidth * 1;
	var elementHeight = document.getElementById(floaterId).style.height;
	elementHeight = elementHeight.substr(0, elementHeight.indexOf("px"));
	elementHeight = elementHeight * 1;
	
	var windowWidth = document.body.offsetWidth;
	var windowHeight = document.body.offsetHeight;

	//*** if there isn't enough room to the right, pop to the left
	//alert("docX: " + docX + " elementWidth: " + elementWidth + " window: " + windowWidth);
	if((docX + elementWidth + offset) > windowWidth) {
		docX = docX - elementWidth - offset;
	}//*** end if
	else {
		docX += offset;
	}//*** end else

	//*** if there isn't enough room below, let them scroll.  popping above never works well.
	//*** it usually disappears under a toolbar or nav frame.
	if((docY + elementHeight + offset) > windowHeight) {
		docY = docY - elementHeight - offset;
		//alert("height: " + elementHeight + " docY: " + docY);
	}//*** end if
	else {
		docY += offset;
	}//*** end else


	document.getElementById(floaterId).style.top = docY;
	document.getElementById(floaterId).style.left = docX;
	document.getElementById(floaterId).style.display = 'inline';

}

function hideHelpFloater(floaterId) {
	document.getElementById(floaterId).style.display = 'none';
}

/*********************************************************
 * Counts characters in a text field or textarea then
 * displays in given element
 *********************************************************/
function characterCount(field, element) {
    var count = document.forms[0].elements[field].value.length;
    document.getElementById(element).innerHTML= "&nbsp;&nbsp;&nbsp;<font class=\"tiny1\">Count: " + count + "</font>";
}

/**********************************************************
 * Popup calendar
 * - calendar pops up by mouse click and allows user to
 *   choose a date to populate assigned field
 * - 
 * - Deprecated.  This module has been updated.  See 
 *   showNewCalendar()
 *********************************************************/
  function showOldCalendar(evt, fieldName, formObject) {
  
  	var currentDate = '';
  	
  	if(formObject.action) {
  		currentDate = formObject.elements[fieldName].value;
  	}//*** end if
  	else if(document.getElementById(formObject)) {
  		formObject = document.getElementById(formObject);
  		currentDate = document.forms[formObject.name].elements[fieldName].value;
  	}//*** end else if
  	else {
  		currentDate = document.forms[0].elements[fieldName].value;
  	}//*** end else 
  	
	var page = "/ksc/miniCalendar.jsp?targetDate=";
	page += currentDate;
	page += "&returnField=";
	page += fieldName;
	page += "&returnForm=";
	page += formObject.name;

	var docX;
	var docY;

	if(evt) {
		if(typeof(evt.pageX) == 'number') {
			docX = evt.pageX;
			docY = evt.pageY;
		}//*** end if
		else {
			docX = evt.clientX;
			docY = evt.clientY;
		}//*** end else
	}//*** end if
	else {
		evt = window.event;
		docX = evt.clientX;
		docY = evt.clientY;
	}//*** end else

	if(document.documentElement
		&& (document.documentElement.scrollTop
		|| document.documentElement.scrollLeft)) {

		docX += document.documentElement.scrollLeft;
		docY += document.documentElement.scrollTop;

	}//*** end if
	else if( document.body
		&& ( document.body.scrollTop
		 || document.body.scrollLeft)) {

		docX += document.body.scrollLeft;
		docY += document.body.scrollTop;

	}//*** end else 
	
	document.getElementById('calPopup').src = page;
	document.getElementById('calPopup').style.left = docX;
	document.getElementById('calPopup').style.top = docY;
	document.getElementById('calPopup').style.display = "inline";
}
 
 
function showNewCalendar(evt, fieldName, formObject) {
	  
	var formId = formObject;
  	var currentDate = '';
  	
  	if(formObject.action) {
  		currentDate = formObject.elements[fieldName].value;
  	}//*** end if
  	else if(document.getElementById(formObject)) {
  		formObject = document.getElementById(formObject);
  		//currentDate = document.forms[formObject.name].elements[fieldName].value;
  		currentDate = formObject.elements[fieldName].value;
  	}//*** end else if
  	else {
  		currentDate = document.forms[0].elements[fieldName].value;
  	}//*** end else 
  	
	var page = "/ksc/miniCalendar.jsp?targetDate=";
	page += currentDate;
	page += "&returnField=";
	page += fieldName;
	page += "&returnForm=";
	page += formId;
	
	document.getElementById('calPopup').src = page;
	showHelpFloater('calPopup', evt);
}


/***
 * Obscure an element to remove focus and show wait or working image.
 * 
 */
function blockElement(elementId) {
	var ie5=(document.all && document.getElementById);
	var ns6=(!document.all && document.getElementById);
	var targetElement = document.getElementById(elementId);
	
	var newDiv = document.createElement('div');
	var divIdName = 'shadeDiv';
	newDiv.setAttribute('id',divIdName);
	newDiv.style.position = 'absolute';
	newDiv.style.left = '0px';
	newDiv.style.top = '0px';
	newDiv.style.width = '100%';
	newDiv.style.height = '100%';
	newDiv.style.background = '#cccccc';
	newDiv.style.display = 'block';
	newDiv.style.zIndex = '300';
	newDiv.style.opacity = '0.6';
	
	if(ie5) {
		newDiv.style.filter = 'alpha(opacity=60)';
	}//*** end if
	else {
		newDiv.style.MozOpacity = '60%';
	}//*** end else
	
	newDiv.innerHTML = '<span style="margin-top: 40px;opacity: 0.0;"><img src=\"/ksc/images/loading.gif\">&nbsp;Loading...</span>';
	targetElement.appendChild(newDiv);
	newDiv.focus();

}

/****
 * Load these tasks as close as possible to the document being loaded
 * to reduce chance of errors
 ***/

document.onmousemove = mouseMove;
document.onmouseup   = mouseUp;