MediaWiki:Common.js: mudanças entre as edições

De otPokemon Wiki
Ir para navegação Ir para pesquisar
Sem resumo de edição
Sem resumo de edição
 
(17 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 3: Linha 3:


function toggleContent(clickedButton, contentToToggle) {
function toggleContent(clickedButton, contentToToggle) {
  // Fechar todos os conteúdos
   var allContents = document.getElementsByClassName("content");
   var allContents = document.getElementsByClassName("content");
   for (var j = 0; j < allContents.length; j++) {
   for (var j = 0; j < allContents.length; j++) {
     allContents[j].style.maxHeight = null; // Fecha todas as divs
     allContents[j].style.maxHeight = null;  
   }
   }


  // Fechar todos os botões (remover a classe "active")
   var allButtons = document.getElementsByClassName("collapsible-battle-pass");
   var allButtons = document.getElementsByClassName("collapsible-battle-pass");
   for (var k = 0; k < allButtons.length; k++) {
   for (var k = 0; k < allButtons.length; k++) {
Linha 19: Linha 17:
   }
   }


  // Agora, abrir o conteúdo da div clicada
   if (contentToToggle.style.maxHeight) {
   if (contentToToggle.style.maxHeight) {
     contentToToggle.style.maxHeight = null; // Fecha se estiver aberto
     contentToToggle.style.maxHeight = null;  
   } else {
   } else {
     contentToToggle.style.maxHeight = contentToToggle.scrollHeight + "px"; // Abre
     contentToToggle.style.maxHeight = contentToToggle.scrollHeight + "px";
   }
   }


  // Adicionar a classe active ao botão clicado
   clickedButton.classList.add("active");
   clickedButton.classList.add("active");
}
}


// Adiciona eventos de clique aos botões
for (var i = 0; i < coll1.length; i++) {
for (var i = 0; i < coll1.length; i++) {
   coll1[i].addEventListener("click", function() {
   coll1[i].addEventListener("click", function() {
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
     var content = this.nextElementSibling;  
     toggleContent(this, content);  // Chama a função para alternar
     toggleContent(this, content);   
   });
   });
}
}
Linha 40: Linha 35:
for (var i = 0; i < coll2.length; i++) {
for (var i = 0; i < coll2.length; i++) {
   coll2[i].addEventListener("click", function() {
   coll2[i].addEventListener("click", function() {
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
     var content = this.nextElementSibling;  
     toggleContent(this, content); // Chama a função para alternar
     toggleContent(this, content);  
   });
   });
}
}
Linha 53: Linha 48:
     }
     }
}
}




mw.loader.using('jquery', function () {
mw.loader.using('jquery', function () {
     $(document).ready(function () {
     $(document).ready(function () {
         // Adiciona um botão para ordenar
         var isAscending = true;
         var $sortButton = $('<div class="sort-button">Ordenar por Shiny Stone</div>');
         var $sortButton = $('<div class="sort-button" style="width: 60px; height: 50px; background-image: url(https://wiki.otpokemon.com/images/9/92/O-c.png); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 3px; cursor: pointer; float: right; margin-right: 0.5%;margin-top: -50px;"></div>');
         $('.square-div-gym').before($sortButton);
         $('.square-div-shiny').before($sortButton);
   


        // Evento de clique no botão
         $sortButton.on('click', function () {
         $sortButton.on('click', function () {
             var $container = $('.square-div-gym');
             var $container = $('.square-div-shiny');
             var $boxes = $container.children('.square-box-gym');
             var $boxes = $container.children('.square-box-shiny');


            // Ordenar os elementos com base no número de Shiny Stones
             $boxes.sort(function (a, b) {
             $boxes.sort(function (a, b) {
                 var numA = parseInt($(a).find('.square-name-gym').text().match(/\d+/)[0], 10);
                 var numA = parseInt($(a).find('.square-name-shiny').text().match(/\d+/)[0], 10);
                 var numB = parseInt($(b).find('.square-name-gym').text().match(/\d+/)[0], 10);
                 var numB = parseInt($(b).find('.square-name-shiny').text().match(/\d+/)[0], 10);
                 return numA - numB; // Ordem crescente
 
                 return isAscending ? numA - numB : numB - numA;
             });
             });


            // Reorganizar no DOM
             $container.append($boxes);
             $container.append($boxes);
            isAscending = !isAscending;
            var newImage = isAscending
                ? 'https://wiki.otpokemon.com/images/e/e2/O-d.png'
                : 'https://wiki.otpokemon.com/images/9/92/O-c.png';
           
            $sortButton.css('background-image', 'url(' + newImage + ')');
         });
         });
     });
     });
});
});

Edição atual tal como às 00h17min de 17 de março de 2025

var coll1 = document.getElementsByClassName("collapsible-battle-pass");
var coll2 = document.getElementsByClassName("collapsible-pokemon");

function toggleContent(clickedButton, contentToToggle) {
  var allContents = document.getElementsByClassName("content");
  for (var j = 0; j < allContents.length; j++) {
    allContents[j].style.maxHeight = null; 
  }

  var allButtons = document.getElementsByClassName("collapsible-battle-pass");
  for (var k = 0; k < allButtons.length; k++) {
    allButtons[k].classList.remove("active");
  }
  allButtons = document.getElementsByClassName("collapsible-pokemon");
  for (var k = 0; k < allButtons.length; k++) {
    allButtons[k].classList.remove("active");
  }

  if (contentToToggle.style.maxHeight) {
    contentToToggle.style.maxHeight = null; 
  } else {
    contentToToggle.style.maxHeight = contentToToggle.scrollHeight + "px";
  }

  clickedButton.classList.add("active");
}

for (var i = 0; i < coll1.length; i++) {
  coll1[i].addEventListener("click", function() {
    var content = this.nextElementSibling; 
    toggleContent(this, content);  
  });
}

for (var i = 0; i < coll2.length; i++) {
  coll2[i].addEventListener("click", function() {
    var content = this.nextElementSibling; 
    toggleContent(this, content); 
  });
}

function toggleShinyList() {
    var shinyList = document.getElementById("shiny-list");
    if (shinyList.style.display === "none" || shinyList.style.display === "") {
        shinyList.style.display = "block";
    } else {
        shinyList.style.display = "flex";
    }
}


mw.loader.using('jquery', function () {
    $(document).ready(function () {
        var isAscending = true;
        var $sortButton = $('<div class="sort-button" style="width: 60px; height: 50px; background-image: url(https://wiki.otpokemon.com/images/9/92/O-c.png); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 3px; cursor: pointer; float: right; margin-right: 0.5%;margin-top: -50px;"></div>');
        $('.square-div-shiny').before($sortButton);
    

        $sortButton.on('click', function () {
            var $container = $('.square-div-shiny');
            var $boxes = $container.children('.square-box-shiny');

            $boxes.sort(function (a, b) {
                var numA = parseInt($(a).find('.square-name-shiny').text().match(/\d+/)[0], 10);
                var numB = parseInt($(b).find('.square-name-shiny').text().match(/\d+/)[0], 10);

                return isAscending ? numA - numB : numB - numA;
            });

            $container.append($boxes);
            isAscending = !isAscending;

            var newImage = isAscending 
                ? 'https://wiki.otpokemon.com/images/e/e2/O-d.png' 
                : 'https://wiki.otpokemon.com/images/9/92/O-c.png';
            
            $sortButton.css('background-image', 'url(' + newImage + ')');
        });
    });
});