// init stuff
function initJS()
{
    //image thumbnail rollovers
	thumbs = document.getElementsByClassName("thumb");
	for (i = 0; i != thumbs.length; i++) {
		thumbs[i].onmouseover = function() {Element.addClassName(this, "thumb_on");Element.removeClassName(this, "thumb");};
		thumbs[i].onmouseout = function() {Element.addClassName(this, "thumb");Element.removeClassName(this, "thumb_on");};
	}
	
	//animation headings
	animtitles = document.getElementsByClassName("animation_title");
	for (i = 0; i != animtitles.length; i++) {
	    animtitles[i].onclick = function() {showAnimation(this);};
	}
	
}

var lastShown=null;
function showAnimation(elTitle)
{
    var animationDiv = Element.find(elTitle, 'nextSibling');
    Element.addClassName(animationDiv, "animation_cur");Element.removeClassName(animationDiv, "animation");

    if (lastShown!=null)
        Element.addClassName(lastShown, "animation");Element.removeClassName(lastShown, "animation_cur");
    
    //IF we closed last div, move back to middle - only when close same one was open
    if (lastShown == animationDiv)
        Element.addClassName(document.getElementById("content"), "animations");
    else
        //something open -  move up to top - who knows why
        Element.removeClassName(document.getElementById("content"), "animations");

        lastShown = animationDiv;
}