﻿var tabList = function(_btns, _pnls, _freq) {
    var freq = typeof (_freq) == 'undefined' ? 6000 : _freq;
    var self = this;
    var btns = _btns;
    var pnls = _pnls;
    var idarr = new Array();

    var doInit = function() {
        var _idarr = new Array();

        btns.each(function(i) {
            var ids = $(btns[i]).attr('id').split('_');
            _idarr.push(ids[2] * 1);

            $(btns[i]).bind('mouseover', function(event) {
                self.showList(i);
            });

            $(btns[i]).bind('mouseout', function(event) {
                self.conScroll();
            });
        });

        pnls.each(function(i) {
            $(pnls[i]).bind('mouseover', function(event) {
                self.stopScroll();
            });
            $(pnls[i]).bind('mouseout', function(event) {
                event.stopPropagation();
                self.conScroll();
            });
        });

        for (var j = _idarr.length - 1; j >= 0; j--) {
            idarr.push(_idarr[j]);
        }
    };

    var showIdx = 0;
    var spIntvl = null;
    var doScroll = function() {
        spIntvl = setInterval(function() { self.autoScroll(); }, freq);
    };

    var setBtnClassName = function() {
        $(btns).each(function() {
            if (($(this).attr('id').split('_')[2] * 1) == idarr[showIdx]) {
                $(this).attr('class', 'on');
            }
            else {
                $(this).attr('class', 'off');
            }
        });
    };

    this.autoScroll = function() {
        $(pnls).each(function() {
            var id = ($(this).attr('id').split('_')[2] * 1);
            if (id == idarr[showIdx]) {
                $(this).show();
                setBtnClassName();
            }
            else {
                $(this).hide();
            }
        });
        showIdx++;
        if (showIdx >= idarr.length) showIdx = 0;
    };

    this.showList = function(idx) {
        self.stopScroll();
        showIdx = btns.length - idx - 1;
        $(pnls).each(function() {
            if (($(this).attr('id').split('_')[2] * 1) == idarr[showIdx]) {
                $(this).show();
                setBtnClassName();
            }
            else {
                $(this).hide();
            }
        });
        showIdx++;
        if (showIdx >= idarr.length) showIdx = 0;
    };

    this.stopScroll = function() {
        clearInterval(spIntvl);
        spIntvl = null;
    };

    this.conScroll = function() {
        doScroll();
    };

    doInit();
    doScroll();
    self.autoScroll();
};
