﻿var maxTabs = 4;
      
function setUpTabs(){        
    ById("dynamicTabbing").innerHTML = '<div id="jsTabs">'+
      '<div id="jsTabsNav">'
     + '<ul id="jsTabNavItems">'
     + '<li id="tab0" class="activeTab"><a href="#" onclick="showTab(0); return false;" id="tabLink0"></a></li>'
     + '<li id="tab1"><a href="#" onclick="showTab(1); return false;" id="tabLink1"></a></li>'
     + '<li id="tab2"><a href="#" onclick="showTab(2); return false;" id="tabLink2"></a></li>'
     + '<li id="tab3" class="last"><a href="#" onclick="showTab(3); return false;" id="tabLink3"></a></li>'
     + '</ul>'
     + '</div>'
     + '<div class="articleBox">'
     + '<div class="articleTop hasNoImage">'
     + '<div class="articleBottom" id="jsTabsContent">'                         
     + '<div id="tabCnt0"></div>'
     + '<div id="tabCnt1"></div>'
     + '<div id="tabCnt2"></div>'
     + ' <div id="tabCnt3"></div>'                                           
     + '</div>' 
     + '</div>'               
     + '</div>'                                    
     + '</div>';
        
    for(var x = 0; x < maxTabs; x++){
        if(ById("tabLabel"+x)){
            ById("tabLink"+x).innerHTML = ById("tabLabel"+x).innerHTML;
            ById("tabCnt"+x).innerHTML = ById("tabContent"+x).innerHTML;
        } else {
            ById("tab"+x).parentNode.removeChild(ById("tab"+x));
            ById("tabCnt"+x).parentNode.removeChild(ById("tabCnt"+x));
        }
    }
    for(var x = 0; x < maxTabs; x++){
       if(ById("tabCnt"+x)){
            ById("tabCnt"+x).style.display = "none";
       }
    }
    ById("tabCnt0").style.display = "block";              
}    

function showTab(tabRef){
    var arrLIs = ById("jsTabNavItems").getElementsByTagName("LI");
    if (tabRef < 0 || arrLIs[tabRef] == undefined) return false;
    for(var x = 0; x < arrLIs.length; x++){
        arrLIs[x].className = "";
    }
    arrLIs[tabRef].className = "activeTab";
    if(arrLIs.length == maxTabs){
        arrLIs[3].className = arrLIs[3].className + " last"; 
    }        
    for(var x = 0; x < maxTabs; x++){
       if(ById("tabCnt"+x)){
            ById("tabCnt"+x).style.display = "none";
       }
    }
    ById("tabCnt"+tabRef).style.display = "block";
    sIFR.replace(chalet, {
        selector: '.sifrLightBlue20',
        wmode: 'transparent',
        fixFocus: true,
        css: [
            '.sIFR-root { color:#076cae;font-size:19px;text-transform:uppercase; }'
        ]
    });
}

$(document).ready(function(){
    
    setUpTabs();
    
    $("div#dynamicTabbing").show();
    
    var hash = window.location.hash.replace(/^#/, '');
    if (hash && /^[1-4]$/.test(hash) && !isNaN(+hash)) {
        /* Is a Number */
        showTab( +hash - 1 );
    }
    
    $('#jsTabs').click(function(e){
        
        /* It's more efficient to delegate events, that's why we're not
           binding an event to EVERY SINGLE anchor... */
        
        var target = $(e.target),
            isAnchor = !! (target.is('a') || target.parents('a')[0]);
            
        /* Make sure target is a link and its
           href is an #anchor type */
        if (isAnchor) {
            
            var anchor = target.add(target.parents()).filter('a')[0];
            
            if (/#.+$/.test(anchor.href)) {
                
                var linkHash = anchor.hash.replace(/^#/,'');
                var contentTabs = $('div[id^=tabCnt]');
                
                /* check if anchor is in tabs (important as JS tabbing duplicates anchors on page) */
                var namedAnchor = $('a[name=' + linkHash + ']', this);
                
                /* check if any exist outside tabs if none exist in current tab otherwise show tab */
                if (namedAnchor.length == 0) {
                    namedAnchor = $('a[name=' + linkHash + ']');
                } else {                
                    showTab( contentTabs.index( namedAnchor.parents('div[id^=tabCnt]')[0] ) );
                }
                
                /* Scroll to anchor */
                $(document).scrollTop( namedAnchor.offset().top );
                
                return false;
            
            }
        
        }
    });
    
});
