MediaWiki:Common.js: mudanças entre as edições

/* =======================================================
   CARROSSEL UNIFICADO - WIKI EVERLIGHT
   ======================================================= */
mw.loader.using(['jquery', 'mediawiki.util'], function () {
    $(function() {
        const $wrapper = $('.carousel-wrapper');
        const $items = $('.carousel-item');
        const $next = $('.right-btn');
        const $prev = $('.left-btn');
        
        if (!$wrapper.length) return; // Só executa se o carrossel existir na página

        let current = 0;
        let autoPlayTimer;

        function updateCarousel() {
            // Atualiza a classe ativa para o efeito visual de destaque
            $items.removeClass('active').eq(current).addClass('active');

            const activeItem = $items.get(current);
            const scrollPosition = 
                activeItem.offsetLeft - 
                ($wrapper.width() / 2) + 
                ($(activeItem).outerWidth() / 2);

            $wrapper.stop().animate({
                scrollLeft: scrollPosition
            }, 500);
        }

        // Funções de Navegação
        function moveNext() {
            current = (current + 1) % $items.length;
            updateCarousel();
        }

        function movePrev() {
            current = (current - 1 + $items.length) % $items.length;
            updateCarousel();
        }

        // Eventos de Clique
        $next.on('click', function() {
            stopAutoPlay();
            moveNext();
        });

        $prev.on('click', function() {
            stopAutoPlay();
            movePrev();
        });

        // Auto-Play (4 segundos)
        function startAutoPlay() {
            autoPlayTimer = setInterval(moveNext, 4000);
        }

        function stopAutoPlay() {
            clearInterval(autoPlayTimer);
        }

        // Inicialização
        updateCarousel();
        startAutoPlay();

        // Pausa o carrossel se o mouse estiver em cima
        $wrapper.hover(stopAutoPlay, startAutoPlay);
    });
});


/* =======================================================
   ARVORE HABILIDADE - WIKI EVERLIGHT
   ======================================================= */


document.addEventListener('DOMContentLoaded', () => {
    const cards = document.querySelectorAll('.skill-card');

    cards.forEach(card => {
        card.addEventListener('click', () => {
            const skillName = card.querySelector('.skill-name').innerText;
            console.log(`Habilidade clicada: ${skillName}`);
            
            // Exemplo de efeito visual simples
            card.style.filter = "brightness(1.2)";
            setTimeout(() => {
                card.style.filter = "brightness(1)";
            }, 150);
        });
    });
});

document.querySelectorAll('.carousel-track').forEach(track => {
  track.addEventListener('mouseenter', () => {
    track.querySelectorAll('.carousel-item').forEach(item => {
      item.style.animationPlayState = 'paused';
    });
  });
  track.addEventListener('mouseleave', () => {
    track.querySelectorAll('.carousel-item').forEach(item => {
      item.style.animationPlayState = 'running';
    });
  });
});

// Adiciona ao MediaWiki:Common.js
document.addEventListener('DOMContentLoaded', function() {
  const wikiLinks = document.querySelectorAll('.wiki-top-link');
  
  // Adiciona índice para animação sequencial
  wikiLinks.forEach((link, index) => {
    link.style.setProperty('--link-index', index);
    
    // Marca como ativo se for a página atual
    const currentPath = window.location.pathname;
    const linkPath = new URL(link.href).pathname;
    
    if (currentPath.includes(linkPath) || 
        link.href === window.location.href) {
      link.classList.add('active');
    }
    
    // Efeito de clique (ripple)
    link.addEventListener('click', function(e) {
      // Remove animação de outros links
      wikiLinks.forEach(l => l.classList.remove('clicked'));
      
      // Adiciona efeito visual
      this.classList.add('clicked');
      
      // Cria efeito ripple
      const ripple = document.createElement('span');
      const rect = this.getBoundingClientRect();
      const size = Math.max(rect.width, rect.height);
      const x = e.clientX - rect.left - size / 2;
      const y = e.clientY - rect.top - size / 2;
      
      ripple.style.cssText = `
        position: absolute;
        border-radius: 50%;
        background: rgba(139, 92, 246, 0.15);
        transform: scale(0);
        animation: wikiRipple 0.6s linear;
        width: ${size}px;
        height: ${size}px;
        top: ${y}px;
        left: ${x}px;
        pointer-events: none;
        z-index: 0;
      `;
      
      this.appendChild(ripple);
      
      setTimeout(() => {
        ripple.remove();
        this.classList.remove('clicked');
      }, 600);
    });
  });
  
  // Adiciona estilo para ripple
  const style = document.createElement('style');
  style.textContent = `
    @keyframes wikiRipple {
      to {
        transform: scale(2.5);
        opacity: 0;
      }
    }
    
    .wiki-top-link.clicked {
      animation: clickPulse 0.3s ease;
    }
    
    @keyframes clickPulse {
      0% { transform: translateY(-2px) scale(1); }
      50% { transform: translateY(-2px) scale(0.98); }
      100% { transform: translateY(-2px) scale(1); }
    }
  `;
  document.head.appendChild(style);
  
  // Atualiza contador
  function updateLinkCount() {
    const count = wikiLinks.length;
    const container = document.querySelector('.everlight-top-links-white');
    if (container) {
      container.style.setProperty('--link-count', count);
    }
  }
  
  updateLinkCount();
});