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
 
(8 revisões intermediárias pelo mesmo usuário 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() {
   // Fechar todos os conteúdos
    this.classList.toggle("active");
   var allContents = document.getElementsByClassName("content");
    var content = this.nextElementSibling;
  for (var j = 0; j < allContents.length; j++) {
    if (content.style.maxHeight){
    allContents[j].style.maxHeight = null; // Fecha todas as divs
      content.style.maxHeight = null;
   }
    } else {
      content.style.maxHeight = content.scrollHeight + "px";
    }
   });
}
 
var coll = document.getElementsByClassName("collapsible-pokemon");
var p;
 
for (p = 0; p < coll.length; p++) {
  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');
      var pTb = document.getElementById('p-tb');
 
      if (!tUpload) {
        if (pTb) {
          pTb.style.display = 'none';
        }
      }


  // Fechar todos os botões (remover a classe "active")
  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");
  }


/* Teste */
  // Agora, abrir o conteúdo da div clicada
 
   if (contentToToggle.style.maxHeight) {
function slider(){
     contentToToggle.style.maxHeight = null; // Fecha se estiver aberto
   const slider = document.querySelectorAll('.slide');
   } else {
  const timer = 10000;
     contentToToggle.style.maxHeight = contentToToggle.scrollHeight + "px"; // Abre
  slider[0].style.display = 'block';
  bullets = sliderBulletsCreation(slider);
  sliderLoop(slider, timer, bullets);
};
 
function sliderLoop(slider, timer, bullets){
  var timeoutFunction = [];
  for (var i = 0; slide = slider[i] && (i < slider.length); i++) {
     timeoutFunction.push(setTimeout(sliderAnim.bind(null, slider, i, timer, bullets), i*timer));
  };
  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){
  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){
  const sliderContainer = document.querySelector('.slider2');
  const length = slider.length;
  const bullets = [];
  for (var i = 0; slide = slider[i] && (i < slider.length); i++) {
    var bullet = document.createElement("div");
    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();
  // Adicionar a classe active ao botão clicado
  clickedButton.classList.add("active");
}


/* Teste Menu */
// Adiciona eventos de clique aos botões
var coll2 = document.getElementsByClassName("collapsible-btn-2");
for (var i = 0; i < coll1.length; i++) {
var p;
   coll1[i].addEventListener("click", function() {
 
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
for (p = 0; p < coll2.length; p++) {
     toggleContent(this, content); // Chama a função para alternar
   coll2[p].addEventListener("click", function() {
  });
    this.classList.toggle("active");
}
     var content = this.nextElementSibling;
   
    // Fecha todos os outros conteúdos
     var allContents = document.getElementsByClassName("content-2");
    for (var j = 0; j < allContents.length; j++) {
      if (allContents[j] !== content) {
        allContents[j].style.maxHeight = null;
      }
    }


    // Alterna o conteúdo clicado
for (var i = 0; i < coll2.length; i++) {
    if (content.style.maxHeight) {
  coll2[i].addEventListener("click", function() {
      content.style.maxHeight = null;
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
     } else {
     toggleContent(this, content);  // Chama a função para alternar
      content.style.maxHeight = content.scrollHeight + "px";
     }
   });
   });
}
}

Edição atual tal como às 01h32min de 25 de dezembro de 2024

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

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

  // Fechar todos os botões (remover a classe "active")
  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");
  }

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

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

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

for (var i = 0; i < coll2.length; i++) {
  coll2[i].addEventListener("click", function() {
    var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
    toggleContent(this, content);  // Chama a função para alternar
  });
}