Revision as of 06:49, 26 February 2025

/* Any JavaScript here will be loaded for all users on every page load. */

$(document).ready(function() {
    'use strict';
    
    // Main race tab click handler
    $('.tab-navigation .tab-button').click(function(e) {
        e.preventDefault();
        
        var targetId = $(this).data('target');
        
        // Update main race tabs
        $('.tab-navigation .tab-button').removeClass('active');
        $(this).addClass('active');
        
        // Update main content panes
        $('.tab-content > .tab-pane').removeClass('active');
        $('#' + targetId).addClass('active');
        
        // Always activate the overview tab for the selected race
        var overviewTab = $('#' + targetId + ' .sub-tab-navigation .tab-button').first();
        var overviewContent = $('#' + overviewTab.data('target'));
        
        // Set overview tab and content as active
        $('#' + targetId + ' .sub-tab-navigation .tab-button').removeClass('active');
        overviewTab.addClass('active');
        
        $('#' + targetId + ' .sub-tab-navigation .tab-content .tab-pane').removeClass('active');
        overviewContent.addClass('active');
    });
    
    // Sub-class tab click handler
    $('.sub-tab-navigation .tab-button').click(function(e) {
        e.preventDefault();
        e.stopPropagation();
        
        var $this = $(this);
        var $subNav = $this.closest('.sub-tab-navigation');
        var targetId = $this.data('target');
        
        // Only update the buttons in this sub-tab navigation
        $subNav.find('.tab-button').removeClass('active');
        $this.addClass('active');
        
        // Find and update only the content panes within this sub-tab section
        $subNav.find('.tab-content .tab-pane').removeClass('active');
        $('#' + targetId).addClass('active');
        
        // Keep the parent tab-pane active
        $this.closest('.tab-pane').addClass('active');
    });
    
    // Initial setup
    function initializeTabs() {
        // Set first race tab active if none are
        var $mainNav = $('.tab-navigation');
        if (!$mainNav.find('.tab-button.active').length) {
            var $firstMainTab = $mainNav.find('.tab-button').first();
            $firstMainTab.addClass('active');
            
            var mainTargetId = $firstMainTab.data('target');
            $('#' + mainTargetId).addClass('active');
            
            // Set its overview tab active
            var $overviewTab = $('#' + mainTargetId + ' .sub-tab-navigation .tab-button').first();
            $overviewTab.addClass('active');
            $('#' + $overviewTab.data('target')).addClass('active');
        }
        
        // For each race tab that's active
        $('.tab-navigation .tab-button.active').each(function() {
            var mainTargetId = $(this).data('target');
            var $mainContent = $('#' + mainTargetId);
            
            // Ensure overview tab is active if no sub-tab is active
            var $subNav = $mainContent.find('.sub-tab-navigation');
            if ($subNav.length && !$subNav.find('.tab-button.active').length) {
                var $overviewTab = $subNav.find('.tab-button').first();
                $overviewTab.addClass('active');
                $('#' + $overviewTab.data('target')).addClass('active');
            }
        });
    }
    
    // Run initial setup
    initializeTabs();
});