MediaWiki:Common.js: Difference between revisions

From Ultimate Dragon Ball Online Wiki

Ravenalien (talk | contribs)
No edit summary
Ravenalien (talk | contribs)
No edit summary
Line 5: Line 5:
      
      
     // Main tab click handler
     // Main tab click handler
     $('.tab-button').click(function(e) {
     $('.tab-navigation > .tab-nav > .tab-button').click(function(e) {
         e.preventDefault();
         e.preventDefault();
          
          
         var targetId = $(this).data('target');
         var targetId = $(this).data('target');
          
          
         if ($(this).closest('.tab-navigation').length) {
         // Main tab navigation
            // Main tab clicked
        $(this).siblings('.tab-button').removeClass('active');
            $('.tab-navigation .tab-button').removeClass('active');
        $(this).addClass('active');
             $('.tab-pane').removeClass('active');
       
        // Hide all main tab panes
        $('.tab-navigation > .tab-content > .tab-pane').removeClass('active');
        // Show clicked tab's content
        $('#' + targetId).addClass('active');
       
        // Reset sub-tabs to first tab
        var $subNav = $('#' + targetId).find('.sub-tab-navigation');
        if ($subNav.length) {
             var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
            $subNav.find('> .tab-nav > .tab-button').removeClass('active');
            $firstSubTab.addClass('active');
              
              
             $(this).addClass('active');
             // Reset sub-tab content
             $('#' + targetId).addClass('active');
            var firstSubTargetId = $firstSubTab.data('target');
            $subNav.find('> .tab-content > .tab-pane').removeClass('active');
            $('#' + firstSubTargetId).addClass('active');
        }
    });
   
    // Sub-tab click handler
    $('.sub-tab-navigation > .tab-nav > .tab-button').click(function(e) {
        e.preventDefault();
       
        var targetId = $(this).data('target');
        var $subNav = $(this).closest('.sub-tab-navigation');
       
        // Update sub-tab buttons
        $subNav.find('> .tab-nav > .tab-button').removeClass('active');
        $(this).addClass('active');
       
        // Update sub-tab content
        $subNav.find('> .tab-content > .tab-pane').removeClass('active');
        $('#' + targetId).addClass('active');
    });
   
    // Set initial states
    $('.tab-navigation').each(function() {
        var $mainNav = $(this);
       
        // Set first main tab active if none are
        if (!$mainNav.find('> .tab-nav > .tab-button.active').length) {
            var $firstMainTab = $mainNav.find('> .tab-nav > .tab-button').first();
            $firstMainTab.addClass('active');
           
            var mainTargetId = $firstMainTab.data('target');
             $('#' + mainTargetId).addClass('active');
              
              
             // Reset sub-tabs
             // Initialize its sub-tabs if any
             var $subNav = $('#' + targetId).find('.sub-tab-navigation');
             var $subNav = $('#' + mainTargetId).find('.sub-tab-navigation');
             if ($subNav.length) {
             if ($subNav.length) {
                 var $firstSubTab = $subNav.find('.tab-button').first();
                 var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
                $subNav.find('.tab-button').removeClass('active');
                 $firstSubTab.addClass('active');
                 $subNav.find('.tab-pane').removeClass('active');
                  
                  
                 $firstSubTab.addClass('active');
                 var subTargetId = $firstSubTab.data('target');
                 $('#' + $firstSubTab.data('target')).addClass('active');
                 $('#' + subTargetId).addClass('active');
             }
             }
        } else {
            // Sub tab clicked
            var $subNav = $(this).closest('.sub-tab-navigation');
            $subNav.find('.tab-button').removeClass('active');
            $subNav.find('.tab-pane').removeClass('active');
           
            $(this).addClass('active');
            $('#' + targetId).addClass('active');
         }
         }
     });
     });
      
      
     // Set initial states
     // Initialize any sub-tabs in the active main tab
     $('.tab-navigation').each(function() {
     var $activeMainTab = $('.tab-navigation > .tab-nav > .tab-button.active');
         var $nav = $(this);
    if ($activeMainTab.length) {
         var $activeTab = $nav.find('.tab-button.active');
         var mainTargetId = $activeMainTab.data('target');
         var $subNav = $('#' + mainTargetId).find('.sub-tab-navigation');
          
          
         if (!$activeTab.length) {
         if ($subNav.length && !$subNav.find('> .tab-nav > .tab-button.active').length) {
             $activeTab = $nav.find('.tab-button').first();
             var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
             $activeTab.addClass('active');
             $firstSubTab.addClass('active');
             $('#' + $activeTab.data('target')).addClass('active');
              
            var subTargetId = $firstSubTab.data('target');
            $('#' + subTargetId).addClass('active');
         }
         }
       
     }
        // Initialize sub-tabs
        var $mainContent = $('#' + $activeTab.data('target'));
        var $subNav = $mainContent.find('.sub-tab-navigation');
       
        if ($subNav.length) {
            var $activeSubTab = $subNav.find('.tab-button.active');
            if (!$activeSubTab.length) {
                $activeSubTab = $subNav.find('.tab-button').first();
                $activeSubTab.addClass('active');
                $('#' + $activeSubTab.data('target')).addClass('active');
            }
        }
     });
});
});

Revision as of 06:45, 26 February 2025

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

$(document).ready(function() {
    'use strict';
    
    // Main tab click handler
    $('.tab-navigation > .tab-nav > .tab-button').click(function(e) {
        e.preventDefault();
        
        var targetId = $(this).data('target');
        
        // Main tab navigation
        $(this).siblings('.tab-button').removeClass('active');
        $(this).addClass('active');
        
        // Hide all main tab panes
        $('.tab-navigation > .tab-content > .tab-pane').removeClass('active');
        // Show clicked tab's content
        $('#' + targetId).addClass('active');
        
        // Reset sub-tabs to first tab
        var $subNav = $('#' + targetId).find('.sub-tab-navigation');
        if ($subNav.length) {
            var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
            $subNav.find('> .tab-nav > .tab-button').removeClass('active');
            $firstSubTab.addClass('active');
            
            // Reset sub-tab content
            var firstSubTargetId = $firstSubTab.data('target');
            $subNav.find('> .tab-content > .tab-pane').removeClass('active');
            $('#' + firstSubTargetId).addClass('active');
        }
    });
    
    // Sub-tab click handler
    $('.sub-tab-navigation > .tab-nav > .tab-button').click(function(e) {
        e.preventDefault();
        
        var targetId = $(this).data('target');
        var $subNav = $(this).closest('.sub-tab-navigation');
        
        // Update sub-tab buttons
        $subNav.find('> .tab-nav > .tab-button').removeClass('active');
        $(this).addClass('active');
        
        // Update sub-tab content
        $subNav.find('> .tab-content > .tab-pane').removeClass('active');
        $('#' + targetId).addClass('active');
    });
    
    // Set initial states
    $('.tab-navigation').each(function() {
        var $mainNav = $(this);
        
        // Set first main tab active if none are
        if (!$mainNav.find('> .tab-nav > .tab-button.active').length) {
            var $firstMainTab = $mainNav.find('> .tab-nav > .tab-button').first();
            $firstMainTab.addClass('active');
            
            var mainTargetId = $firstMainTab.data('target');
            $('#' + mainTargetId).addClass('active');
            
            // Initialize its sub-tabs if any
            var $subNav = $('#' + mainTargetId).find('.sub-tab-navigation');
            if ($subNav.length) {
                var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
                $firstSubTab.addClass('active');
                
                var subTargetId = $firstSubTab.data('target');
                $('#' + subTargetId).addClass('active');
            }
        }
    });
    
    // Initialize any sub-tabs in the active main tab
    var $activeMainTab = $('.tab-navigation > .tab-nav > .tab-button.active');
    if ($activeMainTab.length) {
        var mainTargetId = $activeMainTab.data('target');
        var $subNav = $('#' + mainTargetId).find('.sub-tab-navigation');
        
        if ($subNav.length && !$subNav.find('> .tab-nav > .tab-button.active').length) {
            var $firstSubTab = $subNav.find('> .tab-nav > .tab-button').first();
            $firstSubTab.addClass('active');
            
            var subTargetId = $firstSubTab.data('target');
            $('#' + subTargetId).addClass('active');
        }
    }
});