MediaWiki:Test.js: различия между версиями

Версия от 16:47, 8 мая 2025

// Ждём загрузки DOM
mw.hook('wikipage.content').add(function() {
  var buttons = document.querySelectorAll('.collapsible-button');
  
  buttons.forEach(function(button) {
    button.addEventListener('click', function() {
      var content = this.nextElementSibling;
      var arrow = this.querySelector('.arrow');
      
      // Переключаем видимость
      if (content.style.display === 'none') {
        content.style.display = 'block';
        arrow.textContent = '▼';
      } else {
        content.style.display = 'none';
        arrow.textContent = '▶';
      }
    });
  });
});

@@ Строка 1: / Строка 1: @@
-mw.loader.using('jquery', function() {
+// Ждём загрузки DOM
-  $(function() {
+mw.hook('wikipage.content').add(function() {
-    $('.faction-header').each(function() {
+  var buttons = document.querySelectorAll('.collapsible-button');
-      const $header = $(this);
-       const $list = $header.next('.faction-list');
+  buttons.forEach(function(button) {
-       const $arrow = $header.find('.arrow');
+    button.addEventListener('click', function() {
+       var content = this.nextElementSibling;
+       var arrow = this.querySelector('.arrow');
-       $list.data('is-open', false);
+       // Переключаем видимость
+       if (content.style.display === 'none') {
-      $header.on('click', function() {
+         content.style.display = 'block';
-         const isOpen = !$list.data('is-open');
+         arrow.textContent = '▼';
+      } else {
-        // Анимация стрелки
+         content.style.display = 'none';
-        $arrow.css('transform', isOpen ? 'rotate(180deg)' : 'rotate(0deg)');
+         arrow.textContent = '▶';
+       }
-         // Анимация списка
-        $list.stop().slideToggle({
-          duration: 300,
-          start: function() {
-            if (isOpen) {
-              $(this).css('display', 'flex');
-            }
-          }
-         });
-        $list.find('.faction-item').each(function(index) {
-          $(this).delay(50 * index).queue(function(next) {
-            $(this).css({
-              opacity: isOpen ? 1 : 0,
-              transform: isOpen ? 'translateY(0)' : 'translateY(-10px)'
-            });
-            next();
-          });
-        });
-        $list.data('is-open', isOpen);
-       });
      });
    });
 });