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
 
(52 revisões intermediárias por 2 usuários não estão sendo mostradas)
Linha 1: Linha 1:
/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */
var coll1 = document.getElementsByClassName("collapsible-battle-pass");
var coll = document.getElementsByClassName("collapsible-battle-pass");
var coll2 = document.getElementsByClassName("collapsible-pokemon");
var i;


for (i = 0; i < coll.length; i++) {
function toggleContent(clickedButton, contentToToggle) {
  coll[i].addEventListener("click", function() {
  var allContents = document.getElementsByClassName("content");
     this.classList.toggle("active");
  for (var j = 0; j < allContents.length; j++) {
    var content = this.nextElementSibling;
    allContents[j].style.maxHeight = null;
     if (content.style.maxHeight){
  }
      content.style.maxHeight = null;
 
    } else {
  var allButtons = document.getElementsByClassName("collapsible-battle-pass");
      content.style.maxHeight = content.scrollHeight + "px";
  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); 
   });
   });
}
}


var coll = document.getElementsByClassName("collapsible-pokemon");
for (var i = 0; i < coll2.length; i++) {
var p;
   coll2[i].addEventListener("click", function() {
 
     var content = this.nextElementSibling;  
for (p = 0; p < coll.length; p++) {
     toggleContent(this, content);  
   coll[p].addEventListener("click", function() {
    this.classList.toggle("active");
     var content = this.nextElementSibling;
     if (content.style.maxHeight){
      content.style.maxHeight = null;
    } else {
      content.style.maxHeight = content.scrollHeight + "px";
    }
   });
   });
}
}
var tUpload = document.getElementById('t-upload');
/* Pokedex */
      var pTb = document.getElementById('p-tb');
var coll3 = document.getElementsByClassName("collapsible-pokedex");


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


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


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


function slider(){
   clickedButton.classList.add("active");
  const slider = document.querySelectorAll('.slide');
}
  const timer = 10000;
   slider[0].style.display = 'block';
  bullets = sliderBulletsCreation(slider);
  sliderLoop(slider, timer, bullets);
};


function sliderLoop(slider, timer, bullets){
for (var i = 0; i < coll3.length; i++) {
  var timeoutFunction = [];
  coll3[i].addEventListener("click", function() {
  for (var i = 0; slide = slider[i] && (i < slider.length); i++) {
    var content = this.nextElementSibling;  
    timeoutFunction.push(setTimeout(sliderAnim.bind(null, slider, i, timer, bullets), i*timer));
    toggleContent(this, content);
  };
   });
  bullets.forEach(function(bullet, index){
}
    bullet.addEventListener("click", function(event){
      console.log(index);
      timeoutFunction.forEach(function(element){
        clearTimeout(element);
      });
      var t=0;
      for (var i = index; slide = slider[i] && (i < slider.length); i++) {
        timeoutFunction.push(setTimeout(sliderAnim.bind(null, slider, i, timer, bullets), t*timer));
        t++;
      };
    })
   })
};


function sliderAnim(slider, i, timer, bullets){
/* Pokedex */
  slider.forEach(function(slide){
    slide.style.display = 'none';
  })
  bullets.forEach(function(bullet){
    bullet.style.backgroundColor = "#e5e5e5";
  })
  slider[i].style.display = 'block';
  bullets[i].style.backgroundColor = "#007ee5";
  if (i == (slider.length - 1)){setTimeout(sliderLoop.bind(null,slider, timer, bullets), timer)};
};


function sliderBulletsCreation(slider){
function toggleShinyList() {
  const sliderContainer = document.querySelector('.slider2');
     var shinyList = document.getElementById("shiny-list");
  const length = slider.length;
     if (shinyList.style.display === "none" || shinyList.style.display === "") {
  const bullets = [];
        shinyList.style.display = "block";
  for (var i = 0; slide = slider[i] && (i < slider.length); i++) {
     } else {
     var bullet = document.createElement("div");
        shinyList.style.display = "flex";
     bullet.classList.add('slider-bullet');
     }
    bullet.style.right = 20 + (i * 30) + 'px';
}
    bullet.style.width = "20px";
     bullet.style.height = "20px";
     sliderContainer.appendChild(bullet);
    bullets.push(bullet);
  }
  return bullets;
};


slider();


/* Teste Menu */
mw.loader.using('jquery', function () {
function showTab(tabNumber) {
    $(document).ready(function () {
    // Esconde todas as partes
        var isAscending = true;
    var contents = document.querySelectorAll('.tab-content');
        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>');
    contents.forEach(function(content) {
        $('.square-div-shiny').before($sortButton);
      content.classList.remove('active');
      
     });


    // Remove a classe 'active' de todos os "botões"
        $sortButton.on('click', function () {
    var buttons = document.querySelectorAll('.tab-button');
            var $container = $('.square-div-shiny');
    buttons.forEach(function(button) {
            var $boxes = $container.children('.square-box-shiny');
      button.classList.remove('active');
    });


    // Mostra a parte selecionada
            $boxes.sort(function (a, b) {
    document.getElementById('tab' + tabNumber).classList.add('active');
                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);


    // Marca o "botão" como ativo
                return isAscending ? numA - numB : numB - numA;
    document.getElementById('button' + tabNumber).classList.add('active');
            });
  }


  // Inicializar a função para mostrar o conteúdo da Parte 1
            $container.append($boxes);
  document.getElementById('button1').addEventListener('click', function() {
            isAscending = !isAscending;
    showTab(1);
  });
  document.getElementById('button2').addEventListener('click', function() {
    showTab(2);
  });
  document.getElementById('button3').addEventListener('click', function() {
    showTab(3);
  });


  // Mostrar a Parte 1 ao carregar a página
            var newImage = isAscending
  showTab(1);
                ? '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 13h51min de 6 de abril 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); 
  });
}
/* Pokedex */
var coll3 = document.getElementsByClassName("collapsible-pokedex");

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

  var allButtons2 = document.getElementsByClassName("collapsible-pokedex");
  for (var k = 0; k < allButtons2.length; k++) {
    allButtons2[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 < coll3.length; i++) {
  coll3[i].addEventListener("click", function() {
    var content = this.nextElementSibling; 
    toggleContent(this, content);  
  });
}

/* Pokedex */

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 + ')');
        });
    });
});
Disponível em “https://wiki.otpokemon.com/index.php?title=MediaWiki:Common.js&oldid=30099”