// 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 = 1;
var inertiainc = 1;
var slideintervalinc = 50;
var inertiabaseoriginal = inertiabase;

window.onload = function()
{
        // detect whether the user has ie or not, how we get the height is different 
        var useragent = navigator.userAgent.toLowerCase();
        var ie = ((useragent.indexOf('msie') != -1) && (useragent.indexOf('opera') == -1) && (useragent.indexOf('webtv') == -1));
        var divs = getElementsByClassName(document, "div", "slideblock");

        for(var i=0; i<divs.length; i++)
        {
                // get the original height
                var baseheight = (ie) ? divs[i].offsetHeight + "px" : document.defaultView.getComputedStyle(divs[i], null).getPropertyValue('height', null);

                // explicitly display it (optional, you could use cookies to toggle whether to display it or not)
                divs[i].style.display = "none";

                // "save" our div height, because once it's display is set to none we can't get the original height again
                var d = new div();
                d.el = divs[i];
                d.ht = baseheight.substring(0, baseheight.indexOf("p"));

                // store our saved versoin
                divheights[i] = d;              
        }
}

// 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 doSomethingWithClasses(theClass) 
 {  
 	//Populate the array with all the page tags 
 	var allPageTags=document.getElementsByTagName("*");  //Cycle through the tags using a for loop  
 	for (i=0; i<allPageTags.length; i++) 
	{  //Pick out the tags with our class name  
 		if (allPageTags[i].className==theClass) 
		{  //Manipulate this in whatever way you want  
 			allPageTags[i].style.display='none';  
		}  
	} 
} 

function toggle(t)
{

 doSomethingWithClasses("slideblock");
 
 
 // reset our inertia base and interval
    inertiabase = inertiabaseoriginal;
	clearInterval(slideinterval);

	block = document.getElementById (t);

	if(block.style.display == "none")
	{
		// link text
		// t.innerHTML = "less...";

		
		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 = "more...";
		block.style.display = "none";
		// our goal and current height
		targetheight = 1;
		heightnow = divheight(block);

		// our interval
		slideinterval = setInterval(slidein, slideintervalinc);
		
	}
}

function toggleBack(t)
{
	
		block = document.getElementById (t);
		
		// linkstext
		//  t.innerHTML = "more...";
		block.style.display = "none";
		// 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)
}