// ping
async function checkStatus() {
  const cards = document.querySelectorAll(".card");

  cards.forEach(async (card) => {
    const url = card.getAttribute("data-url");
    const dot = card.querySelector(".card__decor.card__decor--tr");

    try {
      const controller = new AbortController();
      const timeoutId = setTimeout(() => controller.abort(), 5000);

      await fetch(url, {
        mode: "no-cors",
        cache: "no-cache",
        signal: controller.signal,
      });

      dot.classList.remove("status-offline");
      dot.classList.add("status-online");
      clearTimeout(timeoutId);
    } catch (e) {
      dot.classList.remove("status-online");
      dot.classList.add("status-offline");
    }
  });
}

checkStatus();
setInterval(checkStatus, 300000);

// 🔴 테스트 ON
// const TEST_ONLY_SECOND_CARD = true;
// 🟢 테스트 OFF
const TEST_ONLY_SECOND_CARD = false;

// bolt animation
function startBoltAction() {
  let allBolts = [];

  if (TEST_ONLY_SECOND_CARD) {
    // 🔧 2번째 카드만 선택 (0-based index)
    const secondCard = document.querySelectorAll(".card")[1];
    if (!secondCard) return;

    allBolts = secondCard.querySelectorAll(".card__decor");
  } else {
    // 🔹 전체 카드 대상
    allBolts = document.querySelectorAll(".card__decor");
  }

  if (allBolts.length === 0) return;

  const availableBolts = Array.from(allBolts).filter(
    (bolt) => !bolt.classList.contains("card__decor-acting")
  );

  if (availableBolts.length > 0) {
    const randomBolt =
      availableBolts[Math.floor(Math.random() * availableBolts.length)];

    const baseRot =
      randomBolt.style.getPropertyValue("--r") || "0deg";

    randomBolt.style.setProperty("--r", baseRot);

    const BOLT_ANIMATION_DURATION = 16000; // CSS와 반드시 일치

    randomBolt.classList.add("card__decor-acting");

    setTimeout(() => {
      randomBolt.classList.remove("card__decor-acting");
    }, BOLT_ANIMATION_DURATION);
  }

  const nextInterval = Math.random() * 4000 + 3000;
  setTimeout(startBoltAction, nextInterval);
}

window.addEventListener("load", () => {
  setTimeout(startBoltAction, 2000);
});

// 나사 랜덤 각도 부연
document.querySelectorAll('.card').forEach((card, cardIndex) => {
  card.querySelectorAll('.card__decor').forEach((decor, decorIndex) => {

    // -30 ~ 150 정도가 나사 느낌 제일 안정적
    const angle = Math.floor(Math.random() * 180) - 30;

    decor.style.setProperty('--r', `${angle}deg`);
  });
});

window.addEventListener('keydown', (e) => {
  const isMac = navigator.platform.toUpperCase().includes('MAC');

  if (
    isMac &&
    e.metaKey &&
    e.shiftKey &&
    e.code === 'KeyD' &&
    !['INPUT', 'TEXTAREA'].includes(document.activeElement?.tagName)
  ) {
    e.preventDefault();
    document.body.classList.toggle('is-nova');
  }
});