script.js

(() => {
  // Cache DOM references once
  const setupDiv = document.getElementById("setup");
  const containerDiv = document.getElementById("container");
  const ageElem = document.getElementById("age");
  const dateInput = document.getElementById("dobDate");
  const timeInput = document.getElementById("dobTime");
  const saveBtn = document.getElementById("save");

  // Start the age calculation loop
  const startAgeCalculation = (birthday) => {
    containerDiv.style.display = "block";
    setupDiv.style.display = "none";

    const birthdayMs = birthday.getTime(); // cache timestamp
    const msPerYear = 1000 * 60 * 60 * 24 * 365.2425;

    const updateAge = () => {
      const ageYears = (Date.now() - birthdayMs) / msPerYear;
      ageElem.textContent = ageYears.toFixed(9);
      requestAnimationFrame(updateAge);
    };

    updateAge();
  };

  // Load DOB from storage safely
  const loadDOB = () => {
    if (chrome?.storage?.sync) {
      chrome.storage.sync.get(["dobDate", "dobTime"], (result) => {
        const { dobDate, dobTime } = result || {};

        if (!dobDate || !dobTime) {
          setupDiv.style.display = "block";
          containerDiv.style.display = "none";

          saveBtn.addEventListener("click", () => {
            const date = dateInput.value;
            const time = timeInput.value;
            if (!date || !time) return alert("Please fill both fields.");

            chrome.storage.sync.set({ dobDate: date, dobTime: time }, () => {
              startAgeCalculation(new Date(`${date}T${time}Z`));
            });
          });

        } else {
          startAgeCalculation(new Date(`${dobDate}T${dobTime}Z`));
        }
      });
    } else {
      // fallback if storage is unavailable
      containerDiv.style.display = "block";
      setupDiv.style.display = "none";
      ageElem.textContent = "Storage unavailable";
    }
  };

  loadDOB();
})();