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