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
 
(Uma revisão intermediária pelo mesmo usuário não está sendo mostrada)
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");
   // 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 40:
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 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
  });
}