$(document).ready(function() {
	/*wait for images to load before proceeding*/
	if($('#imageDisplay').length !== 0 && $('img', '#imageDisplay').length > 0) {
		var $imgs = $('img', '#imageDisplay');
		var img = [];

            for(var i = 0, ii = $imgs.length; i < ii; i+=1) {
                img[i] = new Image();
            }

		var m = 0; //keeps track of number of preloaded images
		for(var j = 0; j < $imgs.length; j+=1) {
			(function(j) {
				img[j].onload = function() {
					if(m === $imgs.length - 1) {
						imgsAnimate();
						eqCol();
					} else {
						m+=1;
					}
				}
			})(j);
		}
            for(var k = 0, kk = $imgs.length; k < kk; k+=1) {
			img[k].src = 'images/image' + (k + 1) + '.jpg';
		}

            /* a note of importance!!
             *
             * the source of the image img[] array needs to be set AFTER the onload
             * event handler has been binded to each img[] element
             * since the images will already be cached when onload is invoke otherwise
             * 
             */

	} else {
		eqCol();
	}
      
	function imgsAnimate() {

		var pos0 = $imgs.eq(0).position();
		$imgs.each(function(index) {
			if(index !== 0) {
				$(this).css('position', 'absolute');
				$(this).css({top: pos0.top}).hide();
			}
		});

		var increment = 1;
            
		var repeater = setInterval(incrementShow, 4000);

            function incrementShow() {
                $imgs.eq(increment == $imgs.length ? 0 : increment).show(1000);
                $imgs.eq(increment-1).hide(1000);
                increment = increment == $imgs.length ? 1 : increment + 1;
            }

            var flag = 0; // 0 = slideshow active, 1 = slideshow stopped
		$('#stopShow').removeAttr('href').css({cursor: 'pointer'}).children('a').show().click(function() {
                  if(flag === 0) {
                    $(this).text('Start Slideshow');
                    clearInterval(repeater);
                    flag = 1;
                  } else {
                    repeater = setInterval(incrementShow, 4000);
                    $(this).text('Stop Slideshow');
                    flag = 0;
                  }
                  return false;
		});
	}
	
	/*add tooltips to horizontal nev menu*/
	$('.horNavBtn', '#horNav').each(function(index) {
		$(this).hover(function(e) {
			$('#tt'+index).css({
				'left': e.pageX - 60,
				'top': e.pageY - 60,
			}).show();
		}, function(e) {
			$('#tt'+index).hide();
		});
	});
	/*style switcher*/
	$cwrap = $('#contentWrap');
	$('#alterTextSize').show(); //only js-enabled users see styleswitcher
	$('#switchStyles').change(function(e) {
		$cwrap.removeClass();
		switch (this.options[this.selectedIndex].value) {
			case '0':
				$cwrap.addClass('normalSize');
				break;
			case '1':
				$cwrap.addClass('largeSize');
				break;
			case '2':
				$cwrap.addClass('largestSize');
				break;
			default:
				$cwrap.addClass('normalSize');
				break;
		}
		eqCol();
	});
});

function eqCol() {
	var $middleExt = $('#content'),
	$leftExt = $('.sideContent:last', '#leftNav'),
	$rightExt = $('.sideContent:last', '#rightNav');
	//reset column heights (primarily for style switching)
	$middleExt.css('height', 'auto');
	$leftExt.css('height', 'auto');
	$rightExt.css('height', 'auto');
	var heights = {
		leftNav: height($('#leftNav')) - 7,
		rightNav: height($('#rightNav')) - 7,
		ext: {
			middle: height($middleExt),
			left: height($leftExt),
			right: height($rightExt)
		}
	};
	if(heights.leftNav >= heights.ext.middle) {
		if(heights.leftNav >= heights.rightNav) {
		//heights.leftNav is largest
			$middleExt.height(heights.leftNav - parseInt($middleExt.css('padding-top'), 10) 
				- parseInt($middleExt.css('padding-top'), 10) - 7);
			$rightExt.height(heights.ext.right + heights.leftNav 
			- heights.rightNav - parseInt($rightExt.css('padding-top'), 10) 
			- parseInt($rightExt.css('padding-bottom'), 10));
		} else {
		//heights.rightNav is largest
			$leftExt.height(heights.ext.left + heights.rightNav - heights.leftNav 
				- parseInt($leftExt.css('padding-top'), 10) 
				- parseInt($leftExt.css('padding-bottom'), 10));
			$middleExt.height(heights.rightNav - 7 
				- parseInt($middleExt.css('padding-top'), 10) 
				- parseInt($middleExt.css('padding-top'), 10));
		}
	} else {
	//heights.ext.middle is largest
		$leftExt.height(heights.ext.left + heights.ext.middle - heights.leftNav 
			- parseInt($leftExt.css('padding-top'), 10) 
			- parseInt($leftExt.css('padding-bottom'), 10));
		$rightExt.height(heights.ext.right + heights.ext.middle - heights.rightNav 
			- parseInt($rightExt.css('padding-top'), 10) 
			- parseInt($rightExt.css('padding-bottom'), 10));
	}
}

function height(object) {
	return object.height() + parseInt(object.css('padding-top'), 10) + parseInt(object.css('padding-bottom'), 10);
}