script.js

// script.js - Dinamismo moderno para Ajuda Mush

// Toast notification
function showToast(msg, type = 'info') {
  let toast = document.createElement('div');
  toast.className = `toast toast-${type}`;
  toast.innerText = msg;
  document.body.appendChild(toast);
  setTimeout(() => { toast.classList.add('show'); }, 10);
  setTimeout(() => {
    toast.classList.remove('show');
    setTimeout(() => toast.remove(), 400);
  }, 2200);
}

// Efeito de digitação no título principal
function typeWriterEffect(element, text, speed = 60) {
  element.innerHTML = '';
  let i = 0;
  function type() {
    if (i < text.length) {
      element.innerHTML += text.charAt(i);
      i++;
      setTimeout(type, speed);
    }
  }
  type();
}

document.addEventListener('DOMContentLoaded', () => {
  // Efeito de digitação no título
  const h1 = document.querySelector('header h1');
  if (h1) {
    typeWriterEffect(h1, h1.textContent.trim());
  }

  // Animação de entrada para seções
  document.querySelectorAll('main section').forEach((sec, idx) => {
    sec.style.opacity = 0;
    sec.style.transform = 'translateY(30px)';
    setTimeout(() => {
      sec.style.transition = 'all 0.7s cubic-bezier(.23,1.01,.32,1)';
      sec.style.opacity = 1;
      sec.style.transform = 'none';
    }, 400 + idx * 200);
  });

  // Animação nos cards de modos
  document.querySelectorAll('ul.modos li').forEach(card => {
    card.addEventListener('mouseenter', () => {
      card.style.boxShadow = '0 8px 32px #6c63ff33';
      card.style.transform = 'scale(1.06)';
    });
    card.addEventListener('mouseleave', () => {
      card.style.boxShadow = '';
      card.style.transform = '';
    });
  });

  // Efeito de foco na barra de busca
  const input = document.getElementById('nickInput');
  if (input) {
    input.addEventListener('focus', () => {
      input.style.boxShadow = '0 0 8px 2px var(--primary)';
    });
    input.addEventListener('blur', () => {
      input.style.boxShadow = 'none';
    });
  }

  // Troca de tema claro/escuro
  let dark = false;
  const themeBtn = document.createElement('button');
  themeBtn.innerHTML = '<i class="fas fa-moon"></i>';
  themeBtn.className = 'theme-toggle';
  themeBtn.title = 'Alternar tema';
  document.querySelector('header .header-top')?.appendChild(themeBtn);
  themeBtn.addEventListener('click', () => {
    dark = !dark;
    document.body.classList.toggle('dark', dark);
    themeBtn.innerHTML = dark ? '<i class="fas fa-sun"></i>' : '<i class="fas fa-moon"></i>';
    showToast(dark ? 'Tema escuro ativado!' : 'Tema claro ativado!', 'info');
  });

  // Toast para copiar IP
  document.querySelectorAll('.copy-ip-button').forEach(btn => {
    btn.addEventListener('click', e => {
      const ip = btn.textContent.trim();
      navigator.clipboard.writeText(ip).then(() => {
        showToast('IP copiado!', 'success');
      });
    });
  });

  // Scroll suave para âncoras
  document.querySelectorAll('a[href^="#"]').forEach(link => {
    link.addEventListener('click', function(e) {
      const target = document.querySelector(this.getAttribute('href'));
      if (target) {
        e.preventDefault();
        target.scrollIntoView({ behavior: 'smooth' });
      }
    });
  });

  // Carregar jogadores online
  carregarPlayersOnline();
});

// Busca de jogador
function buscarJogador() {
  const nick = document.getElementById('nickInput').value.trim();
  if (nick !== "") {
    const url = `https://mush.com.br/player/${encodeURIComponent(nick)}`;
    window.open(url, '_blank');
  } else {
    showToast('Digite um nick válido.', 'error');
  }
}

// Carregar jogadores online
async function carregarPlayersOnline(ip = "mush.com.br") {
  const onlineSpan = document.getElementById("onlineCount");
  if (!onlineSpan) return;
  try {
    const resposta = await fetch(`https://api.mcsrvstat.us/2/${ip}`);
    const dados = await resposta.json();
    const online = dados.players && dados.players.online ? dados.players.online : "Indisponível";
    onlineSpan.textContent = online;
  } catch (error) {
    onlineSpan.textContent = "Erro ao carregar";
  }
}

// Toast CSS (injetado)
(function(){
  const style = document.createElement('style');
  style.innerHTML = `
    .toast {
      position: fixed;
      left: 50%;
      bottom: 40px;
      transform: translateX(-50%) scale(0.95);
      background: var(--glass, #fff);
      color: var(--text, #222);
      border-radius: 18px;
      box-shadow: 0 2px 16px #6c63ff33;
      padding: 14px 32px;
      font-size: 1.08rem;
      opacity: 0;
      pointer-events: none;
      z-index: 9999;
      transition: all 0.4s cubic-bezier(.23,1.01,.32,1);
      border: 1.5px solid var(--glass-border, #b3b3ff44);
    }
    .toast.show {
      opacity: 1;
      pointer-events: auto;
      transform: translateX(-50%) scale(1);
    }
    .toast-success { color: #00c9a7; }
    .toast-error { color: #e63946; }
    .toast-info { color: var(--primary, #6c63ff); }
    .theme-toggle {
      background: var(--glass, #fff);
      border: 1.5px solid var(--glass-border, #b3b3ff44);
      border-radius: 50%;
      color: var(--primary, #6c63ff);
      font-size: 1.3rem;
      margin-left: 18px;
      padding: 8px 12px;
      cursor: pointer;
      box-shadow: 0 2px 8px #b3b3ff33;
      transition: background 0.2s, color 0.2s;
    }
    .theme-toggle:hover {
      background: var(--primary, #6c63ff);
      color: #fff;
    }
    body.dark {
      --background: linear-gradient(135deg, #232946 0%, #121629 100%);
      --glass: rgba(30,34,60,0.85);
      --glass-border: rgba(108,99,255,0.25);
      --text: #f4f4f4;
      --primary: #f4f4f4;
      --secondary: #00c9a7;
    }
  `;
  document.head.appendChild(style);
})();