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
Etiqueta: Reversão manual
 
(70 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("collapsible-battle-pass");
var i;


$('document').ready(function() {
for (i = 0; i < coll.length; i++) {
  var slideshow = document.getElementById('slideshow');
  coll[i].addEventListener("click", function() {
  var images = $('.image');
    this.classList.toggle("active");
  var num_images = images.length;
    var content = this.nextElementSibling;
  var bars = $('.bar');
    if (content.style.maxHeight){
   var titles = $('.image-title');
      content.style.maxHeight = null;
  var active = 0;
    } else {
  var next;
      content.style.maxHeight = content.scrollHeight + "px";
    }
   });
}


  function changeTitleToLeft(slide) {
var coll = document.getElementsByClassName("collapsible-pokemon");
var p;


    $(titles[active]).addClass('slide-out-to-left');
for (p = 0; p < coll.length; p++) {
    $(titles[active]).one('animationend', function(e) {
  coll[p].addEventListener("click", function() {
      $(titles[active]).addClass('hidden');
    this.classList.toggle("active");
       $(titles[active]).removeClass('slide-out-to-left');
    var content = this.nextElementSibling;
       if ($(titles[active]).hasClass('slide-in-from-right')) {
    if (content.style.maxHeight){
         $(titles[active]).removeClass('slide-in-from-right');
      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';
        }
       }
       }
      else if ($(titles[active]).hasClass('slide-in-from-left')) {
        $(titles[active]).removeClass('slide-in-from-left');
      }
      $(titles[slide]).removeClass('hidden');
      $(titles[slide]).addClass('slide-in-from-right');
      active=slide;
    });


  }


/* Teste */


  function changeTitleToRight(slide) {
function slider(){
 
  const slider = document.querySelectorAll('.slide');
    $(titles[active]).addClass('slide-out-to-right');
  const timer = 10000;
    $(titles[active]).one('animationend', function(e) {
  slider[0].style.display = 'block';
      $(titles[active]).addClass('hidden');
  bullets = sliderBulletsCreation(slider);
      $(titles[active]).removeClass('slide-out-to-right');
  sliderLoop(slider, timer, bullets);
      if ($(titles[active]).hasClass('slide-in-from-right')) {
};
        $(titles[active]).removeClass('slide-in-from-right');
      }
      else if ($(titles[active]).hasClass('slide-in-from-left')) {
        $(titles[active]).removeClass('slide-in-from-left');
      }
      $(titles[slide]).removeClass('hidden');
      $(titles[slide]).addClass('slide-in-from-left');
      active=slide;
    });


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 changeActiveBar(slide) {
function sliderBulletsCreation(slider){
    $(bars[active]).toggleClass('active-bar');
  const sliderContainer = document.querySelector('.slider2');
     $(bars[slide]).toggleClass('active-bar');
  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();
  function showSlide(slide) {
    $(images[active]).toggleClass('hidden');
    $(images[slide]).toggleClass('hidden');
  }
 
 
  $('#prev').click(function() {
    if (active == 0) {
      next = num_images-1;
      showSlide(next);
      changeActiveBar(next);
      changeTitleToLeft(next);
    }
    else {
      next = active-1
      showSlide(next);
      changeActiveBar(next);
      changeTitleToLeft(next);
    }
  });
 
  $('#next').click(function() {
    if (active == num_images - 1) {
      next = 0;
      showSlide(next);
      changeActiveBar(next);
      changeTitleToRight(next);
    }
    else {
      next = active + 1;
      showSlide(next);
      changeActiveBar(next);
      changeTitleToRight(next);
    }
  });
 
});

Edição atual tal como às 22h52min de 4 de novembro 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();