var currentDiv;
var tid;
var origHeight;
var origScrollHeight;
var currentHeight;
var animation_factor;

function divShow(divToShow) {
	//don't do anything if the box is already big enough
	if(divToShow.offsetHeight >= divToShow.scrollHeight) { return false; }

	//save original height for later shrinking
	origHeight = divToShow.offsetHeight;

	//set 'current' global variables for animation function
	currentDiv = divToShow;
	currentHeight = origHeight;

	//stop mouseover behavior during animation
	divToShow.onmouseover = function () {return false};

	//erase foldedMessage during animation
	document.getElementById('ellipses').innerHTML = '';

	//grow animation
	tid = setInterval('divGrow()', (25));
}

function divGrow() {
	//keep growing until large enough for contents
	currentHeight = currentHeight + Math.round(10 * animation_factor);
	currentDiv.style.height = currentHeight + 'px';

	//once the box is large enough...
	if (origScrollHeight <= currentDiv.offsetHeight) {
		//stop timer
		clearInterval(tid);

		//make refold link
		closeLink = document.createElement('a');
		closeLink.innerHTML = "(Click here to hide options again)";
		closeLink.setAttribute('href', "#");
		closeLink.onclick = function () {divHide(currentDiv); return false};
		document.getElementById('ellipses').appendChild(closeLink);
	}
}

function divHide(divToHide) {
	currentDiv = divToHide;

	//erase refold message during animation
	document.getElementById('ellipses').innerHTML = '&nbsp;';

	tid = setInterval('divShrink()', 25);
}

function divShrink() {
	//keep shrinking by 10px until back to origHeight
	currentHeight = currentHeight - Math.round(10 * animation_factor);
	currentDiv.style.height = currentHeight + 'px';

	//once the box is back to the original size...
	if (currentDiv.offsetHeight <= origHeight) {
		//stop timer
		clearInterval(tid);

		//restore unfold behavior
		//currentDiv.onmouseover = function () {divShow(currentDiv)};
	
		//restore unfold link
		//document.getElementById('ellipses').innerHTML = '';
		openLink = document.createElement('a');
		openLink.innerHTML = window['foldedMessage'];
		openLink.setAttribute('href', "#");
		openLink.onclick = function () {divShow(currentDiv); return false};
		document.getElementById('ellipses').appendChild(openLink);
	}
}

var isIE=window.attachEvent?true:false;
function addEvent(el,ev,fn){
 if(isIE)el.attachEvent('on'+ev,fn);
 else if(el.addEventListener)el.addEventListener(ev,fn,false);
}

//the following lines either add the 'foldedMessage' when needed
//or leave the box alone
function divSizeOnLoad(myDivID) {
	var my_box_div = document.getElementById(myDivID);

	//get 'base' size of box
	var max_box_size = document.getElementById(myDivID + '_ref').offsetHeight;

	//capture original content size 
	origScrollHeight = my_box_div.scrollHeight;
	
	//make large boxes animate faster
	if (origScrollHeight > 400) {
		animation_factor = origScrollHeight / 400;
	} else {
		animation_factor = 1;
	}

	//if box is too large, add rollover/message and set box to four lines
	if(my_box_div.scrollHeight > max_box_size) {
		my_box_div.style.height = max_box_size + 'px';
		//make fold link
		openLink = document.createElement('a');
		if(typeof(window['foldedMessage']) == 'undefined') { window['foldedMessage'] = '... (click here to see all options)';
		} 
		openLink.innerHTML = window['foldedMessage'];
		openLink.setAttribute('href', "#");
		openLink.onclick = function () {divShow(my_box_div); return false};
		document.getElementById('ellipses').appendChild(openLink);
	} else {
		my_box_div.style.height = origScrollHeight + 'px';
	}

}