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
Linha 1: Linha 1:
/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */
/* Códigos JavaScript aqui colocados serão carregados por todos aqueles que acessarem alguma página deste wiki */
var coll = document.getElementsByClassName("collapsible-battle-pass");
var coll1 = document.getElementsByClassName("collapsible-battle-pass");
var i;
var coll2 = document.getElementsByClassName("collapsible-pokemon");


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");
   // Fechar todos os botões (remover a classe "active")
var p;
   var allButtons = document.getElementsByClassName("collapsible-battle-pass");
 
   for (var k = 0; k < allButtons.length; k++) {
for (p = 0; p < coll.length; p++) {
     allButtons[k].classList.remove("active");
   coll[p].addEventListener("click", function() {
   }
    this.classList.toggle("active");
   allButtons = document.getElementsByClassName("collapsible-pokemon");
    var content = this.nextElementSibling;
   for (var k = 0; k < allButtons.length; k++) {
    if (content.style.maxHeight){
     allButtons[k].classList.remove("active");
      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';
        }
      }
 
 
/* Teste */
 
function slider(){
  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){
  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();
/* Teste Menu */
var coll1 = document.getElementsByClassName("collapsible-battle-pass");
var coll2 = document.getElementsByClassName("collapsible-pokemon");


function toggleContent(button, content) {
   // Agora, abrir o conteúdo da div clicada
   // Se o conteúdo estiver visível, feche
   if (contentToToggle.style.maxHeight) {
   if (content.style.maxHeight) {
     contentToToggle.style.maxHeight = null; // Fecha se estiver aberto
     content.style.maxHeight = null;
   } else {
   } else {
     // Feche o conteúdo de todas as outras divs
     contentToToggle.style.maxHeight = contentToToggle.scrollHeight + "px"; // Abre
    var allContent = document.getElementsByClassName("content");
    for (var j = 0; j < allContent.length; j++) {
      allContent[j].style.maxHeight = null;
    }
   
    // Abra o conteúdo associado ao botão clicado
    content.style.maxHeight = content.scrollHeight + "px";
   }
   }


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


// Adiciona os eventos de clique para as divs de botão
// 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
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
     toggleContent(this, content);  // Chama a função de alternância
     toggleContent(this, content);  // Chama a função para alternar
   });
   });
}
}
Linha 132: Linha 41:
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
     var content = this.nextElementSibling; // Conteúdo relacionado à div de botão
     toggleContent(this, content);  // Chama a função de alternância
     toggleContent(this, content);  // Chama a função para alternar
   });
   });
}
}

Edição das 01h31min de 25 de dezembro de 2024

/* 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 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
  });
}