<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>ELDYK</title>
    <link rel="stylesheet" href="style2.css" />

    <meta name="robots" content="noindex" />
  </head>

  <body>
    <div class="cen">
      <span id="timer"></span>
      <h2>ΕΠΑΝΑΠΑΤΡΙΣΜΟ</h2>

      <span class="letter" data-word="Τεχνικός" data-worde="  Χαζούλης"
        >Τ.</span
      >
      <span class="letter" data-word="Σύγχρονης" data-worde="  Χαζούλης"
        >Σ.</span
      >
      <span class="letter" data-word="Οργανωμένης">Ο.</span>
      <span class="letter" data-word="Λαθραίας">Λ.</span>
      <span class="letter" data-word="Εξαγωγής">Ε.</span>
      <span class="letter" data-word="Ρυζιού">Ρ.</span>
      <span class="letter" data-word="Ημιπαράνομου">Η.</span>
      <span class="letter" data-word="Δικτύου">Δ.</span>
      <span class="letter" data-word="Υπαξιωματικών">Υ.</span>
    </div>

    <div class="bot">
      <a href="index.html">back</a>
    </div>

    <script>
      console.log("time");

      function updateTimer() {
        const now = new Date().getTime();
        const target = new Date("2025-05-12T16:15:00").getTime();
        const d = target - now;

        const days = Math.floor(d / (1000 * 60 * 60 * 24));
        const hours = Math.floor(
          (d % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
        );
        const mins = Math.floor((d % (1000 * 60 * 60)) / (1000 * 60));
        const secs = Math.floor((d % (1000 * 60)) / 1000);

        let text = `ΠΕΡΑΣΑΝ
${-hours - (days + 1) * 24} ώρες ${-mins} λεπτά ${-secs} δευτερόλεπτα από `;
        document.getElementById("timer").textContent = text;
      }
      updateTimer();
      setInterval(updateTimer, 1000);

      let letters = document.querySelectorAll(".letter");
      letters.forEach((l) => {
        const originalText = l.textContent;
        const targetText = l.dataset.word;

        l.addEventListener("mouseenter", () => {
          let index = 0;
          console.log(originalText);
          l.textContent = originalText[0];

          const interval = setInterval(() => {
            l.textContent += targetText[index + 1];
            index++;
            if (index >= targetText.length - 1) {
              clearInterval(interval);
            }
          }, 20);
          l.dataset.intervalId = interval;
          //l.textContent = targetText;
        });

        l.addEventListener("mouseleave", () => {
          clearInterval(l.dataset.intervalId);
          l.textContent = originalText;
        });
      });
    </script>
  </body>
</html>