/*  sliderTab.css
        action sliderTabs (2-parts)
        1. sliderTab.css
        2. sliderTab.js

    :: IDs expected:
        #sliderTab, #sliderTab LI A
        .selectTab, #sliderTab LI A.selectTab
        #actionTab  (style only)
    :: IDs created:
        #doSlide
        .curentTab  (ptr)
        .activeTab  (ptr)
        .sliderObj
        #actionTab
*/
var doSlide = {
    botPad:         "6px",
    botBdr:         "0px",
    curentTab:      0,
    activeTab:      0,
    destX:          0,
    destW:          0,
    t:              0,
    offLT:          0,
    c:              0,
    d:              18,
    aHeight:        0,
    animInterval:   null,
    sliderObj:      null,
    /* -------------------------------- */
    init: function() {
        if (!document.getElementById ||  !document.getElementById("sliderTab")) return;
        var ul                          = document.getElementById("sliderTab");
        var liArr                       = ul.getElementsByTagName("LI");
        var aArr                        = ul.getElementsByTagName("A");
        for(var i=0, li; li=liArr[i]; i++) {
            liArr[i].onmouseover        = aArr[i].onfocus = function(e) {
                var pos                 = 0;
                var elem                = this.nodeName == "LI" ? this : this.parentNode;
                while(elem.previousSibling) {
                    elem                = elem.previousSibling;
                    if (elem.tagName && elem.tagName == "LI") pos++;
                }
                doSlide.initSlide(pos);
            }
        }
        ul.onmouseout = function(e) {               /* .curentTab */
            doSlide.initSlide(doSlide.curentTab);
        };
        for(var i=0; i<aArr.length; i++) {          /* .activeTab */
            if (document.location.href.indexOf(aArr[i].href)>=0) {
                doSlide.activeTab       = doSlide.curentTab = i;
            }
            aArr[i].style.paddingBottom = doSlide.botPad;  /* 6px */
            aArr[i].style.borderBottom  = doSlide.botBdr;  /* 0px */
        }                                           /* #actionTab */
        doSlide.sliderObj               = ul.parentNode.appendChild(document.createElement("DIV"));
        doSlide.sliderObj.appendChild(document.createTextNode(String.fromCharCode(160)));
        doSlide.sliderObj.id            = "actionTab";
        doSlide.sliderObj.style.top     = (ul.offsetTop  + liArr[doSlide.activeTab].offsetTop
                                        + aArr[doSlide.activeTab].offsetTop)  + "px";
        doSlide.sliderObj.style.left    = (ul.offsetLeft + liArr[doSlide.activeTab].offsetLeft
                                        + aArr[doSlide.activeTab].offsetLeft) + "px";
        doSlide.sliderObj.style.width   = aArr[doSlide.activeTab].offsetWidth + "px";
        doSlide.aHeight                 = ul.offsetTop   + liArr[doSlide.activeTab].offsetTop
                                        + aArr[doSlide.activeTab].offsetTop;
        doSlide.initSlide(doSlide.activeTab, true);
        var intervalMethod              = function() { doSlide.slideIt(); };
        doSlide.animInterval            = setInterval(intervalMethod,10);
    },
    /* -------------------------------- */
    cleanUp: function() {
        clearInterval(doSlide.animInterval);
        doSlide.animInterval            = null;
    },
    /* -------------------------------- */
    initSlide: function(pos, force) {
        if (!force && pos == doSlide.activeTab) return;
        doSlide.activeTab               = pos;
        doSlide.initAnim();
    },
    /* -------------------------------- */
    initAnim: function() {
        var ul                          = document.getElementById("sliderTab");
        var liArr                       = ul.getElementsByTagName("LI");
        var aArr                        = ul.getElementsByTagName("A");
        doSlide.destX                   = parseInt(liArr[doSlide.activeTab].offsetLeft
                                        + liArr[doSlide.activeTab].getElementsByTagName("A")[0].offsetLeft
                                        + ul.offsetLeft);
        doSlide.destW                   = parseInt(liArr[doSlide.activeTab].getElementsByTagName("A")[0].offsetWidth);
        doSlide.t                       = 0;
        doSlide.offLT                   = doSlide.sliderObj.offsetLeft;
        doSlide.c                       = doSlide.destX  -  doSlide.offLT;
        doSlide.bW                      = doSlide.sliderObj.offsetWidth;
        doSlide.cW                      = doSlide.destW  -  doSlide.bW;
        doSlide.sliderObj.style.top     = (ul.offsetTop  +  liArr[doSlide.activeTab].offsetTop
                                        + aArr[doSlide.activeTab].offsetTop) + "px";
    },
    /* -------------------------------- */
    slideIt: function() {
        var ul                          = document.getElementById("sliderTab");
        var liArr                       = ul.getElementsByTagName("LI");
        var aArr                        = ul.getElementsByTagName("A");
        // Has text size changed?
        if (doSlide.aHeight !=   ul.offsetTop
         + liArr[doSlide.activeTab].offsetTop
         +  aArr[doSlide.activeTab].offsetTop) {
            doSlide.initAnim();
            doSlide.aHeight             = ul.offsetTop + liArr[doSlide.activeTab].offsetTop
                                        + aArr[doSlide.activeTab].offsetTop
        };
        if (doSlide.t++ < doSlide.d) {
            var x  = doSlide.animate(doSlide.t,doSlide.offLT,doSlide.c,doSlide.d);
            var w  = doSlide.animate(doSlide.t,doSlide.bW,doSlide.cW,doSlide.d);
            doSlide.sliderObj.style.left  = parseInt(x)   + "px";
            doSlide.sliderObj.style.width = parseInt(w)   + "px";
        } else {
            doSlide.sliderObj.style.left  = doSlide.destX + "px";
            doSlide.sliderObj.style.width = doSlide.destW + "px";
        }
    },
    /* -------------------------------- */
    animate: function(t,offLT,c,d) {
        if ((t/=d/2) < 1) return c/2*t*t + offLT;
        return  -c/2 * ((--t)*(t-2) - 1) + offLT;
    }
}
window.onload   = doSlide.init;
window.onunload = doSlide.cleanUp;