﻿$(document).ready(    
    function()
    {    
        //select queries & class names.
        var selectTabSection = ".tabsect";
        var selectTabButtons = ".tabbutton";
        var selectTabContents = ".tabcontent";
        var selectSelectedTabInput = "#selectedTab";
        var classNameOn = "lion";
        var classNameOff = "lioff";
    
        var selectIndex = 0;
        var tabButtons = $(selectTabButtons);
        var tabContents = $(selectTabContents);
        var inputSelectedTab = $(selectSelectedTabInput);
                
        $(selectTabSection).hide();                       
        
        //restore previously selected tab on browser back action.
        setTimeout(
            function()
            {                
                selectIndex = inputSelectedTab.length == 0 ? 0 : 
                    (inputSelectedTab[0].value.length > 0 ? parseInt(inputSelectedTab[0].value) : 0);
                    
                if (tabButtons.length > selectIndex && tabContents.length > selectIndex)                    
                    enableTab($(tabButtons[selectIndex]));
                else if (tabButtons.length > 0 && tabContents.length > 0)
                    enableTab($(tabButtons[0]));
                $(selectTabSection).show();
            }, 1
        );                                                        
        
        //tab button click.
        tabButtons.click(
            function()
            {
                enableTab($(this));
                return false;
            }
        );
     
        //enable tab.
        function enableTab(obj)        
        {                                        
            for (var i=0; i<tabButtons.length && i<tabContents.length; i++)            
                if (tabButtons[i] == obj[0])
                {
                    tabContents.hide();
                    tabButtons.removeClass(classNameOn);
                    tabButtons.addClass(classNameOff);
                    obj.removeClass(classNameOff);
                    obj.addClass(classNameOn);            
                    $(tabContents[i]).show();    
                    
                    if (inputSelectedTab.length > 0)                    
                        inputSelectedTab[0].value = i;
                    
                    break;        
                }                        
        }                   
    }        
);