script.js

const chapters = document.querySelectorAll(".chapter");
let currentChapter = 0;

/* =========================
   YOUR LITTLE THINGS
========================= */
const littleThings = [
  "The way you miss me.",
  "The way hours feel like seconds with you.",
  "Your care towards me.",
  "Talks about our future.",
  "How you make me feel understood.",
  "Your quiet kindness.",
  "The comfort of just being with you.",
  "How you make ordinary moments feel special."
];

const memories = [
  "Locking eyes with one another.",
  "Sitting together for the first time in Punjabi class.",
  "Our little-little talks in Room-6.",
  "Dropping you home for the first time — and you know what you did.",
  "Our first outing together — Siswan Dam.",
  "Me missing you for the first time during Independence Week holidays.",
  "You asking me to be your teacher.",
  "Exchanging phone numbers and the start of chatting.",
  "Your Birthday Week.",
  "Room-6 in the library, where everything felt quietly beautiful.",
  "The change of library location — we got afraid maybe everything would change, but somehow we managed.",
  "Going out to eat for the first time, just the two of us.",
  "Our talks after 4pm in Room-6.",
  "You telling me that you are attracted to me.",
  "Finally on Oct 4, telling me all about your feelings.",
  "Then came 11 Oct.",
  "Holding hands for the first time.",
  "Saying 'I love you' for the first time.",
  "Saying bye to each other before Diwali holidays.",
  "Trying to stay connected during the holidays.",
  "Meetings after sunset.",
  "Getting to know each other on a whole different level.",
  "Our first hug at the rose garden — I still feel it.",
  "Then came the long distance phase, which taught us many things.",
  "You coming to see me on 19th December — best moment.",
  "The time we spent apart and how it taught me how deeply I love you.",
  "Finally coming back to Chandigarh.",
  "Our first movie date.",
  "Spending the whole day together on 6 Jan for the first time.",
  "Joining the library.",
  "You gifting me something for the first time.",
  "19th Jan.",
  "Again long distance.",
  "You showing me all the photos and telling stories behind them.",
  "Finally 1 Feb and 2 Feb."
];


let memoryIndex = 0;

/* =========================
   SHOW MEMORY
========================= */
function showMemory() {
  const memoryText = document.getElementById("memoryText");

  if (memoryIndex < memories.length) {
    memoryText.innerText = memories[memoryIndex];
    memoryIndex++;
  } else {
    memoryText.innerText = "And so many more beautiful moments… 💖";
  }
}

/* =========================
   SHOW LITTLE THING
========================= */
function showLittleThing() {
  const littleText = document.getElementById("littleText");
  const random =
    littleThings[Math.floor(Math.random() * littleThings.length)];
  littleText.innerText = random;
}

/* =========================
   TYPEWRITER
========================= */
const lines = [
  "You are my peace.",
  "My chaos.",
  "My comfort.",
  "My home.",
  "And loving you is the easiest thing",
  "I have ever done."
];

function startLoveLetter() {
  const container = document.getElementById("typeText");
  container.innerHTML = "";

  lines.forEach((line, index) => {
    const div = document.createElement("div");
    div.textContent = line;
    div.style.opacity = 0;
    div.style.transition = "opacity 0.8s ease";
    container.appendChild(div);

    setTimeout(() => {
      div.style.opacity = 1;
    }, index * 800);
  });
}

/* =========================
   CHAPTER NAVIGATION
========================= */
function nextChapter() {
  chapters[currentChapter].classList.remove("active");
  currentChapter++;

  if (currentChapter < chapters.length) {
    chapters[currentChapter].classList.add("active");

    if (currentChapter === 3) {
      startLoveLetter();
      showValentineMessage();
    }
  }
}


/* =========================
   MOVING NO BUTTON
========================= */
function moveNo() {
  const noBtn = document.getElementById("noBtn");
  const x = Math.random() * 200 - 100;
  const y = Math.random() * 200 - 100;
  noBtn.style.transform = `translate(${x}px, ${y}px)`;
}

/* =========================
   YES BUTTON EFFECT
========================= */
function sayYes() {
  document.getElementById("finalMessage").innerText =
    "You just made me the happiest person alive 💖";

  // Hearts
  for (let i = 0; i < 30; i++) {
    createHeart();
  }

  // Sparkles
  for (let i = 0; i < 25; i++) {
    createSparkle();
  }

  // Confetti
  for (let i = 0; i < 40; i++) {
    createConfetti();
  }

  // Extra petals moment
  for (let i = 0; i < 20; i++) {
    createPetal();
  }
  document.getElementById("songBtn").style.display = "inline-block";

}
function showValentineMessage() {
  const message = document.getElementById("valentineMessage");
  const question = document.getElementById("proposalQuestion");
  const buttons = document.getElementById("finalButtons");

  message.innerHTML = `
    <p><strong>Happy Valentine’s Day, my love.</strong></p>

    <p>From Room-6 conversations to long distance nights,
    from our first hand hold to every “I love you” —
    every memory with you lives in my heart.</p>

    <p>You are my peace. My comfort. My safest place.</p>

    <p>Loving you isn’t just a feeling.</p>
    <p>It’s home.</p>

    <p>Today, I celebrate us.</p>
  `;

  // Fade message
  setTimeout(() => {
    message.style.opacity = 1;
  }, 500);

  // Fade question
  setTimeout(() => {
    question.style.opacity = 1;
  }, 5000);

  // Fade buttons
  setTimeout(() => {
    buttons.style.opacity = 1;
  }, 6500);
}

const introLyrics = [
  "This one is for you…",
  "For every late night we stayed up talking…",
  "For every moment I missed you…",
  "For every time you held my hand…",
  "And now… listen carefully ❤️"
];
const syncedLyrics = [
  { time: 1, text: "This one is for you…" },
  { time: 3.5, text: "For every late night we stayed up talking…" },
  { time: 7, text: "For every moment I missed you…" },
  { time: 10.5, text: "For every time you held my hand…" },
  { time: 14, text: "And now… listen carefully ❤️" },
  { time: 22, text: "Zulfan De Vichon Vich Ni" },
  { time: 25, text: "Karke Tu Cheer Nikaldi" },
  { time: 27, text: "Lagda Ae Canvas Vichon" },
  { time: 30, text: "Koyi Tasveer Nikaldi" },
  
  { time: 33, text: "Jidde Na Dissdi Pariye" },
  { time: 35, text: "Seene Chon Peed Nikaldi" },
  { time: 38, text: "Ranjhe Jehi Feeling Aundi" },
  { time: 41, text: "Kolon Jadon Heer Nikaldi" },
  
  { time: 43, text: "Tera Hunn Sadde Dil Vich" },
  { time: 46, text: "Rehna Te Banda Aa Ni" },
  { time: 49, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 51, text: "Kahna Te Banda Aa Ni" },
  
  { time: 54, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 57, text: "Kahna Te Banda Aa Ni" },
  { time: 60, text: "Taithon Vadh Sohna Koi Nahi" },
  
  { time: 86, text: "Lagda Ae Rab Ne Koyi" },
  { time: 89, text: "Shayari Jeondi Karti" },
  { time: 91, text: "Addhi Ankh Baddal Baaki" },
  { time: 93, text: "Saagar Ton Doongi Ghadti" },
  
  { time: 97, text: "Jithe Tussi Milde Ho Ji" },
  { time: 99, text: "Jannat Jehi Lagdi Dharti" },
  { time: 102, text: "Thodda Naa Jad Laine Aa" },
  { time: 105, text: "Lagda Main Aayat Padhti" },
  { time: 108, text: "Lagda Main Aayat Padhti" },
  
  { time: 110, text: "Mudd Mudd Ke Naam Tera Pher" },
  { time: 113, text: "Laina Te Banda Aa Ni" },
  { time: 115, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 118, text: "Kahna Te Banda Aa Ni" },
  
  { time: 121, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 123, text: "Kahna Te Banda Aa Ni" },
  { time: 126, text: "Taithon Vadh Sohna Koi Nahi" },
  
  { time: 142, text: "Balldi Tu Laat Ni Agg Di" },
  { time: 145, text: "Gabbru Parvana Kudiye" },
  { time: 147, text: "Ghoori Tere Mathe Fikki" },
  { time: 150, text: "Aashiq Nu Taana Kudiye" },
  
  { time: 153, text: "Labh Lainda Munda Tainu" },
  { time: 155, text: "Vekhan Da Bahana Kudiye" },
  { time: 158, text: "Ban’na Ae Tera Mara" },
  { time: 161, text: "Sohna Afsana Kudiye" },
  
  { time: 163, text: "Nakhra Hunn Tera Adiye" },
  { time: 166, text: "Sehna Te Banda Aa Ni" },
  { time: 169, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 172, text: "Kahna Te Banda Aa Ni" },
  { time: 174, text: "Taithon Vadh Sohna Koi Nahi" },
  
  { time: 177, text: "Kahna Te Banda Aa Ni" },
  { time: 179, text: "Taithon Vadh Sohna Koi Nahi" },
  { time: 182, text: "Kahna Te Banda Aa Ni" },
  { time: 185, text: "Taithon Vadh Sohna Koi Nahi" }

  
];


function startSong() {
  const overlay = document.getElementById("songOverlay");
  const audio = document.getElementById("loveSong");
  const lyricsBox = document.getElementById("lyricsBox");
  document.querySelector(".dance-container").style.display = "flex";


  overlay.style.display = "flex";
  audio.play();

  audio.ontimeupdate = function () {
    const currentTime = Math.floor(audio.currentTime);

    for (let i = 0; i < syncedLyrics.length; i++) {
      if (currentTime === syncedLyrics[i].time) {
        lyricsBox.style.opacity = 0;

        setTimeout(() => {
          lyricsBox.innerText = syncedLyrics[i].text;
          lyricsBox.style.opacity = 1;
        }, 300);
      }
    }
  };
}





function createHeart() {
  const heart = document.createElement("div");
  heart.innerText = "💖";
  heart.style.position = "fixed";
  heart.style.left = Math.random() * 100 + "vw";
  heart.style.top = "100vh";
  heart.style.fontSize = "20px";
  heart.style.animation = "rise 2s ease forwards";
  document.body.appendChild(heart);

  setTimeout(() => heart.remove(), 2000);
}

/* =========================
   HEART RISE ANIMATION
========================= */
const style = document.createElement("style");
style.innerHTML = `
@keyframes rise {
  from { transform: translateY(0); opacity: 1; }
  to { transform: translateY(-100vh); opacity: 0; }
}`;
document.head.appendChild(style);

/* =========================
   FALLING PETALS
========================= */
function createPetal() {
  const petal = document.createElement("div");
  petal.classList.add("petal");
  petal.innerText = "🌸";
  petal.style.left = Math.random() * 100 + "vw";
  petal.style.animationDuration = 5 + Math.random() * 5 + "s";
  document.querySelector(".petals").appendChild(petal);

  setTimeout(() => petal.remove(), 10000);
}
function createSparkle() {
  const sparkle = document.createElement("div");
  sparkle.classList.add("sparkle");
  sparkle.innerText = "✨";
  sparkle.style.left = Math.random() * 100 + "vw";
  sparkle.style.top = Math.random() * 100 + "vh";
  document.body.appendChild(sparkle);

  setTimeout(() => sparkle.remove(), 1500);
}

function createConfetti() {
  const confetti = document.createElement("div");
  confetti.classList.add("confetti");
  confetti.style.left = Math.random() * 100 + "vw";
  confetti.style.backgroundColor =
    ["#ff4d88", "#ff99cc", "#ffd6e8", "#ff66a3"][
      Math.floor(Math.random() * 4)
    ];
  document.body.appendChild(confetti);

  setTimeout(() => confetti.remove(), 3000);
}


setInterval(createPetal, 500);

/* Initialize */
chapters[0].classList.add("active");