/* This file assumes that navClickHandler.js has been included because
   it defines the addEvent function for gracefully adding things to
   the onLoad event.
   http://www.sitepoint.com/article/structural-markup-javascript/ */

function growColumns() {
	if (document.getElementById) {
		// the divs array contains references to each column's div element.  
		var divs = new Array(document.getElementById('content'), document.getElementById('nav'));
		
		// Let's determine the maximum height out of all columns specified
		var maxHeight = 0;
		for (var i = 0; i < divs.length; i++) {
			if (divs[i].offsetHeight > maxHeight) maxHeight = divs[i].offsetHeight;
		}
		
		// Let's set all columns to that maximum height
		for (var i = 0; i < divs.length; i++) {
			divs[i].style.height = maxHeight + 'px';

			// Now, if the browser's in standards-compliant mode, the height property
			// sets the height excluding padding, so we figure the padding out by subtracting the
			// old maxHeight from the new offsetHeight, and compensate!  So it works in Safari AND in IE 5.x
			if (divs[i].offsetHeight > maxHeight) {
				divs[i].style.height = (maxHeight - (divs[i].offsetHeight - maxHeight)) + 'px';
			}
		}
	}
}

growContainer = function(){

    var contentDiv, outerDiv, height, top;

		contentDiv = document.getElementById('content');
		containerDiv = document.getElementById('container');
		 
		if (contentDiv.offsetHeight) {

        height = contentDiv.offsetHeight;
		    top = contentDiv.offsetTop;
				 
    } else if (contentDiv.style.pixelHeight) {

        height = contentDiv.style.pixelHeight;
        top = contentDiv.style.pixelTop;
    } 
		 
    containerDiv.style.height = height + top + 'px';
}

// execute function when page loads
window.onload=function(){
		growColumns();
		growContainer();
}

window.onresize=function(){
		growColumns();
		growContainer();
}