var NavBar = {};
var SubNav = {};

NavBar.SetTab = function (TabID) {
    var i = 1;

    while (document.getElementById("navbar.tab-" + i)) {
        if (i == TabID) {
            document.getElementById("navbar.menu-" + i).style.display = 'block';
            if (document.getElementById("navbar.tab-" + i).className == "navbar-activetab") {
                document.getElementById("navbar.tab-" + i).className = "navbar-inactivetab";
                i++;
                document.getElementById("navbar.menu").style.display = "none";
            } else {
                document.getElementById("navbar.tab-" + i).className = "navbar-activetab";
                i++;
                document.getElementById("navbar.menu").style.display = "block";
            }
        } else {
            document.getElementById("navbar.menu-" + i).style.display = 'none';
            document.getElementById("navbar.tab-" + i).className = "navbar-inactivetab";
            i++;
        }
    }
};

SubNav.SetTab = function(TabID, ButtonID) {
    var i = 1;
    while (document.getElementById("subnav.tab-" + i)) {
        document.getElementById("subnav.tabbody-" + i).className = "inactivetab-body";
        document.getElementById("subnav.tabright-" + i).className = "inactivetab-right";
        document.getElementById("subnav.tabright-" + i).innerHTML = "<div class='inactivetab-topborder' style='margin-left:2px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='margin-left:3px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='margin-left:4px;'><\/div>" +
                        "<div class='inactivetab-right-rightborder'><\/div>" +
                        "<div class='inactivetab-right-bottomborder'><\/div>";
        i++;
    }

    document.getElementById("subnav.tabbody-" + TabID).className = "activetab-body";
    document.getElementById("subnav.tabright-" + TabID).className = "activetab-right";
    document.getElementById("subnav.tabright-" + TabID).innerHTML = "<div class='inactivetab-topborder' style='margin-left:2px;'><\/div>" +
                    "<div class='inactivetab-topborder' style='margin-left:3px;'><\/div>" +
                    "<div class='inactivetab-topborder' style='margin-left:4px;'><\/div>" +
                    "<div class='activetab-right-rightborder'><\/div>" +
                    "<div class='activetab-right-bottomborder '><\/div>";

    if (TabID != 1) {
        document.getElementById("subnav.tabright-" + (TabID - 1)).className = "activetab-left";
        document.getElementById("subnav.tabright-" + (TabID - 1)).innerHTML = "<div class='inactivetab-topborder' style='margin-right:2px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='margin-right:3px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='margin-right:4px;'><\/div>" +
                        "<div class='activetab-left-leftborder'><\/div>" +
                        "<div class='activetab-left-bottomborder'><\/div>";
    }

    if (TabID == (i - 1)) {
        document.getElementById("subnav.tabright-" + (i - 1)).innerHTML = "<div class='activetab-topborder' style='background-color:Transparent;margin-left:2px;'><\/div>" +
                        "<div class='activetab-topborder' style='background-color:Transparent;margin-left:3px;'><\/div>" +
                        "<div class='activetab-topborder' style='background-color:Transparent;margin-left:4px;'><\/div>" +
                        "<div class='activetab-right-rightborder'><\/div>" +
                        "<div class='activetab-right-bottomborder '><\/div>";
    } else {
        document.getElementById("subnav.tabright-" + (i - 1)).innerHTML = "<div class='inactivetab-topborder' style='background-color:Transparent;margin-left:2px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='background-color:Transparent;margin-left:3px;'><\/div>" +
                        "<div class='inactivetab-topborder' style='background-color:Transparent;margin-left:4px;'><\/div>" +
                        "<div class='inactivetab-right-rightborder'><\/div>" +
                        "<div class='inactivetab-right-bottomborder'><\/div>";
    }

    setTimeout("document.getElementById(\"" + ButtonID + "\").click();", 300);
};

function isMouseLeaveOrEnter(e, handler) {
    if (e.type != 'mouseout' && e.type != 'mouseover') return false;
    var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;
    while (reltg && reltg != handler) reltg = reltg.parentNode;
    return (reltg != handler);
}


var Master = {
    Thumbnail: {},
    Video: {},
    Chat: {},
    Search: {}
};

var Thumbnail = Master.Thumbnail;

Thumbnail.findPosX = function(obj) {
    var curleft = 0;
    if (obj.offsetParent) {
        while (1) {
            curleft += obj.offsetLeft;
            if (!obj.offsetParent) {
                break;
            }
            obj = obj.offsetParent;
        }
    } else if (obj.x) {
        curleft += obj.x;
    }
    return curleft;
}

Thumbnail.Scroll = function(src, e) {
    if (!e) { var e = window.event };
    var posx = 0;
    if (!e) var e = window.event;
    if (e.pageX) posx = e.pageX;
    else if (e.clientX) posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;

    var MouseX = posx - Thumbnail.findPosX(src);
    var OldMarginLeft = 0;

    if (document.getElementById("ThumbnailList").style.marginLeft) OldMarginLeft = parseInt(document.getElementById("ThumbnailList").style.marginLeft);
    var LeftOffSet = parseInt((MouseX / src.clientWidth) * (src.scrollWidth - parseInt(OldMarginLeft) - src.clientWidth));
    if (LeftOffSet >= 0) document.getElementById("ThumbnailList").style.marginLeft = "-" + LeftOffSet + "px";
}

Thumbnail.Reset = function(e, marginTopSize, force) {
    if (!force) force = false;
    if (!marginTopSize) marginTopSize = "0px";
    var i = 0;
    while (document.getElementById("scrollerThumb" + i) && (Thumbnail.isMouseLeaveOrEnter(e) || force)) {
        document.getElementById("scrollerThumb" + i).style.height = "30px";
        document.getElementById("scrollerThumb" + i).style.width = "30px";
        document.getElementById("scrollerThumb" + i).style.marginTop = marginTopSize;
        i++;
    }
}

Thumbnail.isMouseLeaveOrEnter = function(e, handler) {
    if (!handler) handler = document.getElementById("ShowList");
    if (e.type != 'mouseout' && e.type != 'mouseover') return false;
    var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement;
    while (reltg && reltg != handler) reltg = reltg.parentNode;
    return (reltg != handler);
}