var historyTable = null;
var historyRow = null;
var historyContent = null;
var historyActive = null;
var historyContainer = null;
var activeRightEdge = 0;
window.onload = function () {
    historyTable = document.getElementById("historyTable");
    historyRow = document.getElementById("historyRow");
    historyContent = document.getElementById("content");
    historyContainer = document.getElementById("container");
    historyActive = document.getElementById("activeYearCell");
    //calculating the right edge position of the active cell
    var cell = historyActive;
    activeRightEdge = 0;
    while (cell) {
        if (cell.nodeName.toLowerCase() == "td") {
            activeRightEdge += cell.offsetWidth;            
        }
        cell = cell.previousSibling;        
        
    }
    
    
    setHistoryActivePosition();
};
function getFirstVisibleCell () {
    var left = historyTable.offsetLeft + historyTable.offsetParent.offsetLeft;
    for (var i = 0; i < historyRow.childNodes.length; i++) {
        var child = historyRow.childNodes[i];
        if (child.nodeName.toLowerCase() == "td") {
            if (left >= 0) return child;
            left += child.offsetWidth;
        }
    }
    return null;
}
function getHistoryContentWidth() {
    var w = 0;
    for (var i = 0; i < historyRow.childNodes.length; i++) {
        var child = historyRow.childNodes[i];
        if (child.nodeName.toLowerCase() == "td") {
            w += child.offsetWidth;
        }
    }
    return w;
}
function scrollToRight() {
    var left = historyTable.offsetLeft + historyTable.offsetParent.offsetLeft;
    var visibleWidth =  getHistoryContentWidth() + left;
    if (visibleWidth <= historyContent.parentNode.offsetWidth) {
        return;
    }
    var firstVisibleCell = getFirstVisibleCell();
    var nextCell = firstVisibleCell.nextSibling;
    while (nextCell && nextCell.nodeName.toLowerCase() != "td") {
        nextCell = nextCell.nextSibling;
    }
    
    if (!nextCell) {
        return;
    }
    var newLeft = left - firstVisibleCell.offsetWidth;
    
    historyContent.style.left = newLeft + "px";
}
function scrollToLeft() {
    var left = historyTable.offsetLeft + historyTable.offsetParent.offsetLeft;
    if (left >= 0) return;
    
    var firstVisibleCell = getFirstVisibleCell();
    var previousCell = firstVisibleCell.previousSibling;
    while (previousCell && previousCell.nodeName.toLowerCase() != "td") {
        previousCell = previousCell.previousSibling;
    }
    
    if (!previousCell) return;
    
    var newLeft = left + previousCell.offsetWidth;
    
    historyContent.style.left = newLeft + "px";    
}
function isActiveCellInView() {
    var screenAxisRight = activeRightEdge + historyTable.offsetLeft + 
                                historyTable.offsetParent.offsetLeft;
    return screenAxisRight <= historyContainer.offsetWidth;
}
function setHistoryActivePosition() {
    while (!isActiveCellInView()) {
        scrollToRight();
    }    
}