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


Linha 15: Linha 15:
}
}


document.addEventListener('DOMContentLoaded', function () {
var coll = document.getElementsByClassName("collapsible-pokemon");
    const toggleDarkModeDiv = document.getElementById('toggleDarkMode');
var p;
    const body = document.body;


     // Verifica se o modo escuro está ativado
for (p = 0; p < coll.length; p++) {
     if (localStorage.getItem('darkMode') === 'enabled') {
  coll[p].addEventListener("click", function() {
        enableDarkMode();
    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');


    // Adiciona um ouvinte de evento para alternar o modo escuro
      if (!tUpload) {
    toggleDarkModeDiv.addEventListener('click', function () {
         if (pTb) {
         if (body.classList.contains('dark-mode')) {
          pTb.style.display = 'none';
            // Desativa o modo escuro se estiver ativado
            disableDarkMode();
        } else {
            // Ativa o modo escuro se estiver desativado
            enableDarkMode();
         }
         }
     });
      }
 
 
/* 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 enableDarkMode() {
function sliderBulletsCreation(slider){
        // Ativa o modo escuro
  const sliderContainer = document.querySelector('.slider2');
        body.classList.add('dark-mode');
  const length = slider.length;
        // Salva o estado no localStorage
  const bullets = [];
        localStorage.setItem('darkMode', 'enabled');
  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;
};


    function disableDarkMode() {
slider();
        // Desativa o modo escuro
        body.classList.remove('dark-mode');
        // Salva o estado no localStorage
        localStorage.setItem('darkMode', null);
    }
});

Edição atual tal como às 18h40min de 15 de julho de 2024

/* 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 i;

for (i = 0; i < coll.length; i++) {
  coll[i].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 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';
        }
      }


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