﻿/*
Vertical Scroller

Kieran Iles - 23 may 2007
DESCRIPTION: 
    Scrolls a table in a container div to the left. 
    The item divs must be contained in the html
    
    <div id="horizontalHider">
        <table id="horizontalScollerTable" cellspacing="0">
            <tr id="horizontalContainer">
                <td class="item" onmouseover="stopScrolling();" onmouseout="startScrolling();">
                    <!------- TEXT/HTML HERE ------->
                </td>
                <!------- Add as many td as nessacary. ------->
            </tr>
        <table>            
    </div>
  
    Once a td disappears of the screen it is remove from the container table's elements collection and 
    appended to the bottom.

SETUP:
    The function initHorizontalScoller should be called in the body tag's onload event or at the bottom of the 
    page.
    The functions startScrolling and stopScrolling should be called in the onmouseout and onmouseover of the 
    item td.
    The scroll speed can be set by changing the variable intScrollSpeed - Increase to slow down, decrease to speed up.
*/

var intContainerStartTop;
var objContainer;
var objTable;
var intMarginLeft = 0;
var colChildDivs;
var childNodes;
var intScrollSpeed = 1; 
var initScrollAmount = 1;
var scrollAmount = initScrollAmount;

function initHorizontalScoller () {
    var intCounter = 0;
    
    objTable = document.getElementById("horizontalScollerTable");
    objContainer = document.getElementById("horizontalContainer");
    childNodes = objContainer.childNodes;
    
    // Loop through child collection remove any elements that aren't td. Lowercase and uppercase instances of tds
    // checked for as IE and FF return different case values for nodeName.
    for (intCounter=0; intCounter < childNodes.length; intCounter++)
    {
        if (childNodes[intCounter].nodeName != 'td' && childNodes[intCounter].nodeName != 'TD')
        {
            deleteNode(intCounter);
        }
    }
    
    setInterval ("moveleft()", intScrollSpeed);
}
 
function moveleft () {
    // Move the table to the left.
    reduceMargin();
    
    // If the left margin of the table is greater than the width of the first td in the table, then remove first
    // td and place it at the back of the td collection.
    if ((intMarginLeft*-1) > childNodes[0].offsetWidth)
    {
        addNode(childNodes[0].cloneNode(true));
        deleteNode(0);
        intMarginLeft = 0;
        
        // Reset margin of table to starting position.
        objTable.style.marginLeft = (initScrollAmount * -1) + "px";
    }
}

function reduceMargin () {
    intMarginLeft = intMarginLeft - scrollAmount;
    objTable.style.marginLeft = intMarginLeft + "px";
}

function deleteNode (_nodePosition) {
    objContainer.removeChild(childNodes[_nodePosition]);
}

function addNode (newDiv) {
    newDiv.style.margin = "";
    objContainer.appendChild(newDiv);
}

function startScrolling() {
    scrollAmount = initScrollAmount;
}

function stopScrolling() {
    scrollAmount = 0;
}

