﻿// JScript File

// our global vars
var heightnow;
var targetheight;
var block;
var slideinterval;
var divheights = new Array();

// the delay between the slide in/out, and a little inertia
var inertiabase = 10;
var inertiainc = 10;
var slideintervalinc = 50;
var inertiabaseoriginal = inertiabase;


// this is one of our divs, it just has a DOM reference to the element and the original height
function div(_el, _ht)
{
    this.el = _el;
    this.ht = _ht;
}

function toggle(t)
{
    // reset our inertia base and interval
    inertiabase = inertiabaseoriginal;
    clearInterval(slideinterval);

    // get our block
    block = t.parentNode.nextSibling;

    // for mozilla, it doesn't like whitespace between elements
    if(block.className == undefined)
        block = t.parentNode.nextSibling.nextSibling;

    if(block.style.display == "none")
    {
        // link text
        t.innerHTML = "<img src=\"/images/slide_opened.gif\" alt=\"Close\" />";

        block.style.display = "block";
        block.style.height = "1px";

        // our goal and current height
        targetheight = divheight(block);
        heightnow = 1;

        // our interval
        slideinterval = setInterval(slideout, slideintervalinc);
    }
    else
    {
        // linkstext
        t.innerHTML = "<img src=\"/images/slide_closed.gif\" alt=\"Open\" />";

        // our goal and current height
        targetheight = 1;
        heightnow = divheight(block);

        // our interval
        slideinterval = setInterval(slidein, slideintervalinc);
    }
}

// this is our slidein function the interval uses, it keeps subtracting
// from the height till it's 1px then it hides it
function slidein()
{
    if(heightnow > targetheight)
    {
        // reduce the height by intertiabase * inertiainc
        heightnow -= inertiabase;

        // increase the intertiabase by the amount to keep it changing
        inertiabase += inertiainc;

        // it's possible to exceed the height we want so we use a ternary - (condition) ? when true : when false;
        block.style.height = (heightnow > 1) ? heightnow + "px" : targetheight + "px";
    }
    else
    {
        // finished, so hide the div properly and kill the interval
        clearInterval(slideinterval);
        block.style.display = "none";
    }
}

// this is the function our slideout interval uses, it keeps adding
// to the height till it's fully displayed
function slideout()
{
    if(heightnow < targetheight)
    {
        // increases the height by the inertia stuff
        heightnow += inertiabase;

        // increase the inertia stuff
        inertiabase += inertiainc;

        // it's possible to exceed the height we want so we use a ternary - (condition) ? when true : when false;
        block.style.height = (heightnow < targetheight) ? heightnow + "px" : targetheight + "px";
        
    }
    else
    {
        // finished, so make sure the height is what it's meant to be (inertia can make it off a little)
        // then kill the interval
        clearInterval(slideinterval);
        block.style.height = targetheight + "px";
    }
}

// returns the height of the div from our array of such things
function divheight(d)
{
    for(var i=0; i<divheights.length; i++)
    {
        if(divheights[i].el == d)
        {
            return divheights[i].ht;
        }
    }
}

/*
    the getElementsByClassName function I pilfered from this guy.  It's
    a useful function that'll return any/all tags with a specific css class.

        Written by Jonathan Snook, http://www.snook.ca/jonathan
        Add-ons by Robert Nyman, http://www.robertnyman.com
*/
function getElementsByClassName(oElm, strTagName, strClassName)
{
    // first it gets all of the specified tags
    var arrElements = (strTagName == "*" && document.all) ? document.all : oElm.getElementsByTagName(strTagName);
    
    // then it sets up an array that'll hold the results
    var arrReturnElements = new Array();

    // some regex stuff you don't need to worry about
    strClassName = strClassName.replace(/\-/g, "\\-");

    var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
    var oElement;

    // now it iterates through the elements it grabbed above
    for(var i=0; i<arrElements.length; i++)
    {
        oElement = arrElements[i];

        // if the class matches what we're looking for it ads to the results array
        if(oRegExp.test(oElement.className))
        {
            arrReturnElements.push(oElement);
        }   
    }

    // then it kicks the results back to us
    return (arrReturnElements)
}