MediaWiki:Timeless.js: Difference between revisions

From Game Wiki - VortanMU
No edit summary
Tag: Reverted
No edit summary
Tag: Reverted
Line 1: Line 1:
/* ===== Mega-menu LITE — Timeless ===== */
mw.loader.using(['jquery']).then(function () {
  try {
    if (window.__VortanCleanJS) return;
    window.__VortanCleanJS = true;
 
    // ===== 0) Limpeza de handlers antigos =====
    $(document).off('.vt-dd .vt-mega');
    $(window).off('.vt-table .vt-mega .vt-table-sizefix .vt-table-unoverflow');
    $('.custom-submenu').remove();
 
    // ===== 1) DROPDOWNS DO HEADER (não toca na sidebar) =====
    var $dropdowns = $('#personal, #p-variants-desktop');
 
    function closeAll() { $dropdowns.removeClass('dropdown-active'); }
 
    $dropdowns.on('click.vt-dd', function (e) {
      var $self = $(this);
      if ($self.hasClass('dropdown-active')) {
        if ($(e.target).closest($('h2, #p-variants-desktop h3')).length > 0) closeAll();
      } else {
        closeAll();
        e.stopPropagation();
        $self.addClass('dropdown-active');
      }
    });
 
    $(document).on('click.vt-dd', function (e) {
      if ($(e.target).closest($dropdowns).length === 0) closeAll();
    });
 
    // ===== 2) Utilitários de tabela (teu bloco, idempotente) =====
    mw.hook('wikipage.content').add(function ($content) {
      $content.find('div > table:not( table table )').each(function () {
        var $t = $(this);
        if (!$t.parent().hasClass('content-table')) {
          $t.wrap('<div class="content-table-wrapper"><div class="content-table"></div></div>');
          $t.closest('.content-table-wrapper')
            .prepend('<div class="content-table-left"></div><div class="content-table-right"></div>');
        }
      });
 
      function setScrollClass($table) {
        var $tableWrapper = $table.parent();
        var scroll = Math.abs($tableWrapper.scrollLeft());
        $tableWrapper.parent()
          .toggleClass('scroll-left', scroll > 1)
          .toggleClass('scroll-right', $table.outerWidth() - $tableWrapper.innerWidth() - scroll > 1);
      }
 
      $content.find('.content-table').off('scroll.vt-table').on('scroll.vt-table', function () {
        setScrollClass($(this).children('table').first());
        if ($content.attr('dir') === 'rtl') {
          $(this).find('caption').css('margin-right', Math.abs($(this).scrollLeft()) + 'px');
        } else {
          $(this).find('caption').css('margin-left', $(this).scrollLeft() + 'px');
        }
      });
 
      function unOverflowTables() {
        $content.find('.content-table > table').each(function () {
          var $table = $(this),
              $wrapper = $table.parent().parent();
          if ($table.outerWidth() > $wrapper.outerWidth()) {
            $wrapper.addClass('overflowed');
            setScrollClass($table);
          } else {
            $wrapper.removeClass('overflowed scroll-left scroll-right fixed-scrollbar-container');
          }
        });
 
        $content.find('.content-table > table > caption').each(function () {
          var $table = $(this).parent(),
              $wrapper = $table.parent().parent();
          if ($table.outerWidth() > $wrapper.outerWidth()) {
            var $container = $(this).parents('.content-table-wrapper');
            $(this).width($content.width());
            var tableHeight = $container.innerHeight() - $(this).outerHeight();
            $container.find('.content-table-left').height(tableHeight);
            $container.find('.content-table-right').height(tableHeight);
          }
        });
      }
 
      unOverflowTables();
      $(window).off('resize.vt-table-unoverflow').on('resize.vt-table-unoverflow', unOverflowTables);
 
      // Recria barras “spoof”
      $content.find('.content-table-scrollbar').remove();
      $content.find('.content-table').each(function () {
        var $tableWrapper = $(this);
        var $table = $tableWrapper.children('table').first();
        var $scrollbar = $('<div>').addClass('content-table-scrollbar inactive').width($content.width());
        var $spoof = $('<div>').addClass('content-table-spoof').width($table.outerWidth());
        $tableWrapper.parent().prepend($scrollbar.prepend($spoof));
      });
 
      $content.find('.content-table').off('scroll.vt-table-sync').on('scroll.vt-table-sync', function () {
        $(this).siblings('.inactive').first().scrollLeft($(this).scrollLeft());
      });
      $content.find('.content-table-scrollbar').off('scroll.vt-table-sync').on('scroll.vt-table-sync', function () {
        if (!$(this).hasClass('inactive')) {
          $(this).siblings('.content-table').first().scrollLeft($(this).scrollLeft());
        }
      });
 
      function determineActiveSpoofScrollbars() {
        $content.find('.overflowed .content-table').each(function () {
          var $scrollbar = $(this).siblings('.content-table-scrollbar').first();
          var captionHeight = $(this).find('caption').outerHeight() || 0;
          if (captionHeight) captionHeight += 8;
 
          var tableTop = $(this).offset().top;
          var tableBottom = tableTop + $(this).outerHeight();
          var viewBottom = window.scrollY + document.documentElement.clientHeight;
          var active = tableTop + captionHeight < viewBottom && tableBottom > viewBottom;
          $scrollbar.toggleClass('inactive', !active);
        });
      }
 
      determineActiveSpoofScrollbars();
      $(window).off('scroll.vt-table resize.vt-table').on('scroll.vt-table resize.vt-table', determineActiveSpoofScrollbars);
 
      $(window).off('resize.vt-table-sizefix').on('resize.vt-table-sizefix', function () {
        $content.find('.content-table-scrollbar').each(function () {
          var $ct = $(this).siblings().first().find('table').first();
          $(this).find('.content-table-spoof').first().width($ct.width());
          $(this).width($content.width());
        });
      });
    });
 
    // ===== 3) Garante que Navigation/Wiki tools continuam como lista =====
    $('#p-navigation .mw-portlet-body > ul, #p-tb .mw-portlet-body > ul').show();
 
/* ===== Mega-menu LITE — Timeless ===== */
mw.loader.using(['jquery']).then(function () {
mw.loader.using(['jquery']).then(function () {
   try {
   try {

Revision as of 09:44, 7 November 2025

mw.loader.using(['jquery']).then(function () {
  try {
    if (window.__VortanCleanJS) return;
    window.__VortanCleanJS = true;

    // ===== 0) Limpeza de handlers antigos =====
    $(document).off('.vt-dd .vt-mega');
    $(window).off('.vt-table .vt-mega .vt-table-sizefix .vt-table-unoverflow');
    $('.custom-submenu').remove();

    // ===== 1) DROPDOWNS DO HEADER (não toca na sidebar) =====
    var $dropdowns = $('#personal, #p-variants-desktop');

    function closeAll() { $dropdowns.removeClass('dropdown-active'); }

    $dropdowns.on('click.vt-dd', function (e) {
      var $self = $(this);
      if ($self.hasClass('dropdown-active')) {
        if ($(e.target).closest($('h2, #p-variants-desktop h3')).length > 0) closeAll();
      } else {
        closeAll();
        e.stopPropagation();
        $self.addClass('dropdown-active');
      }
    });

    $(document).on('click.vt-dd', function (e) {
      if ($(e.target).closest($dropdowns).length === 0) closeAll();
    });

    // ===== 2) Utilitários de tabela (teu bloco, idempotente) =====
    mw.hook('wikipage.content').add(function ($content) {
      $content.find('div > table:not( table table )').each(function () {
        var $t = $(this);
        if (!$t.parent().hasClass('content-table')) {
          $t.wrap('<div class="content-table-wrapper"><div class="content-table"></div></div>');
          $t.closest('.content-table-wrapper')
            .prepend('<div class="content-table-left"></div><div class="content-table-right"></div>');
        }
      });

      function setScrollClass($table) {
        var $tableWrapper = $table.parent();
        var scroll = Math.abs($tableWrapper.scrollLeft());
        $tableWrapper.parent()
          .toggleClass('scroll-left', scroll > 1)
          .toggleClass('scroll-right', $table.outerWidth() - $tableWrapper.innerWidth() - scroll > 1);
      }

      $content.find('.content-table').off('scroll.vt-table').on('scroll.vt-table', function () {
        setScrollClass($(this).children('table').first());
        if ($content.attr('dir') === 'rtl') {
          $(this).find('caption').css('margin-right', Math.abs($(this).scrollLeft()) + 'px');
        } else {
          $(this).find('caption').css('margin-left', $(this).scrollLeft() + 'px');
        }
      });

      function unOverflowTables() {
        $content.find('.content-table > table').each(function () {
          var $table = $(this),
              $wrapper = $table.parent().parent();
          if ($table.outerWidth() > $wrapper.outerWidth()) {
            $wrapper.addClass('overflowed');
            setScrollClass($table);
          } else {
            $wrapper.removeClass('overflowed scroll-left scroll-right fixed-scrollbar-container');
          }
        });

        $content.find('.content-table > table > caption').each(function () {
          var $table = $(this).parent(),
              $wrapper = $table.parent().parent();
          if ($table.outerWidth() > $wrapper.outerWidth()) {
            var $container = $(this).parents('.content-table-wrapper');
            $(this).width($content.width());
            var tableHeight = $container.innerHeight() - $(this).outerHeight();
            $container.find('.content-table-left').height(tableHeight);
            $container.find('.content-table-right').height(tableHeight);
          }
        });
      }

      unOverflowTables();
      $(window).off('resize.vt-table-unoverflow').on('resize.vt-table-unoverflow', unOverflowTables);

      // Recria barras “spoof”
      $content.find('.content-table-scrollbar').remove();
      $content.find('.content-table').each(function () {
        var $tableWrapper = $(this);
        var $table = $tableWrapper.children('table').first();
        var $scrollbar = $('<div>').addClass('content-table-scrollbar inactive').width($content.width());
        var $spoof = $('<div>').addClass('content-table-spoof').width($table.outerWidth());
        $tableWrapper.parent().prepend($scrollbar.prepend($spoof));
      });

      $content.find('.content-table').off('scroll.vt-table-sync').on('scroll.vt-table-sync', function () {
        $(this).siblings('.inactive').first().scrollLeft($(this).scrollLeft());
      });
      $content.find('.content-table-scrollbar').off('scroll.vt-table-sync').on('scroll.vt-table-sync', function () {
        if (!$(this).hasClass('inactive')) {
          $(this).siblings('.content-table').first().scrollLeft($(this).scrollLeft());
        }
      });

      function determineActiveSpoofScrollbars() {
        $content.find('.overflowed .content-table').each(function () {
          var $scrollbar = $(this).siblings('.content-table-scrollbar').first();
          var captionHeight = $(this).find('caption').outerHeight() || 0;
          if (captionHeight) captionHeight += 8;

          var tableTop = $(this).offset().top;
          var tableBottom = tableTop + $(this).outerHeight();
          var viewBottom = window.scrollY + document.documentElement.clientHeight;
          var active = tableTop + captionHeight < viewBottom && tableBottom > viewBottom;
          $scrollbar.toggleClass('inactive', !active);
        });
      }

      determineActiveSpoofScrollbars();
      $(window).off('scroll.vt-table resize.vt-table').on('scroll.vt-table resize.vt-table', determineActiveSpoofScrollbars);

      $(window).off('resize.vt-table-sizefix').on('resize.vt-table-sizefix', function () {
        $content.find('.content-table-scrollbar').each(function () {
          var $ct = $(this).siblings().first().find('table').first();
          $(this).find('.content-table-spoof').first().width($ct.width());
          $(this).width($content.width());
        });
      });
    });

    // ===== 3) Garante que Navigation/Wiki tools continuam como lista =====
    $('#p-navigation .mw-portlet-body > ul, #p-tb .mw-portlet-body > ul').show();

 /* ===== Mega-menu LITE — Timeless ===== */
mw.loader.using(['jquery']).then(function () {
  try {
    if (window.__megaMenuLite) return;
    window.__megaMenuLite = true;

    var NAV_SEL = '#site-navigation .sidebar-inner';
    var isDesktop = function () { return window.innerWidth >= 851; };

    function build() {
      var $nav = $(NAV_SEL);
      if (!$nav.length) return;

      // limpeza de execuções antigas e lixos que possam ter sobrado
      $nav.find('.mw-portlet').each(function () {
        var $p = $(this);
        var $ulOrig = $p.find('> .mw-portlet-body > ul, > ul').first();

        $p.removeClass('has-mega active has-submenu').off('.megamenu');
        // remove ULs clonados que possam ter sido anexados direto no portlet
        $p.children('ul.submenu').remove();

        // restaura o UL original
        if ($ulOrig.length) {
          $ulOrig.show()
            .removeClass('submenu submenu-2-columns submenu-3-columns submenu-4-columns')
            .off('.megamenu');
        }
      });

      // aplica comportamento sem alterar DOM
      $nav.find('.mw-portlet').each(function () {
        var $p = $(this);
        var $h3 = $p.children('h3').first();
        var $ul = $p.find('> .mw-portlet-body > ul, > ul').first();
        if (!$h3.length || !$ul.length) return;

        var $links = $ul.find('> li > a');
        if (!$links.length) return;

        // marca como tendo submenu e classifica colunas
        $p.addClass('has-submenu');           // usado pelo CSS
        $ul.addClass('submenu');              // painel
        var n = $links.length;
        if (n > 20)       $ul.addClass('submenu-4-columns');
        else if (n > 12)  $ul.addClass('submenu-3-columns');
        else if (n > 6)   $ul.addClass('submenu-2-columns');

        // escondido por padrão; CSS/JS mostram quando necessário
        $ul.hide();

        // interação (hover no desktop, clique no mobile)
        var closeTimer = null;
        function open()  { $p.addClass('active'); $ul.stop(true, true).fadeIn(90); }
        function close() { $p.removeClass('active'); $ul.stop(true, true).fadeOut(90); }
        function toggle(){ $ul.is(':visible') ? close() : open(); }

        $h3.on('mouseenter.megamenu', function () {
          if (isDesktop()) open();
        }).on('mouseleave.megamenu', function () {
          if (isDesktop()) {
            closeTimer = setTimeout(function () {
              if (!$ul.is(':hover') && !$h3.is(':hover')) close();
            }, 120);
          }
        }).on('click.megamenu', function (e) {
          if (!isDesktop()) { e.preventDefault(); toggle(); }
        });

        $ul.on('mouseenter.megamenu', function () {
          if (isDesktop()) { clearTimeout(closeTimer); open(); }
        }).on('mouseleave.megamenu', function () {
          if (isDesktop()) {
            closeTimer = setTimeout(function () {
              if (!$h3.is(':hover')) close();
            }, 120);
          }
        });
      });

      // fechar clicando fora
      $(document).off('click.megamenu').on('click.megamenu', function (e) {
        if ($(e.target).closest(NAV_SEL + ' .mw-portlet').length === 0) {
          var $nav = $(NAV_SEL);
          $nav.find('.mw-portlet.active').removeClass('active');
          $nav.find('.mw-portlet .submenu:visible').fadeOut(90);
        }
      });
    }

    mw.hook('wikipage.content').add(build);
    $(build);
    console.log('[MegaMenu LITE] pronto');
  } catch (err) {
    console.error('[MegaMenu LITE] erro', err);
  }
});