TaroTime/app/ui-section-state.js

(function () {
  "use strict";

  const VALID_SECTIONS = new Set([
    "home",
    "timeline",
    "calendar",
    "holidays",
    "tarot",
    "astronomy",
    "planets",
    "cycles",
    "natal",
    "elements",
    "iching",
    "kabbalah",
    "kabbalah-tree",
    "cube",
    "alphabet",
    "alphabet-letters",
    "alphabet-text",
    "numbers",
    "zodiac",
    "quiz",
    "gods",
    "enochian"
  ]);

  let activeSection = "home";
  let config = {
    elements: {},
    ensure: {},
    getReferenceData: () => null,
    getMagickDataset: () => null,
    calendarVisualsUi: null,
    tarotSpreadUi: null,
    settingsUi: null,
    homeUi: null,
    calendar: null
  };

  function setHidden(element, hidden) {
    if (element) {
      element.hidden = hidden;
    }
  }

  function setPressed(element, pressed) {
    if (element) {
      element.setAttribute("aria-pressed", pressed ? "true" : "false");
    }
  }

  function toggleActive(element, active) {
    if (element) {
      element.classList.toggle("is-active", active);
    }
  }

  function getReferenceData() {
    return config.getReferenceData?.() || null;
  }

  function getMagickDataset() {
    return config.getMagickDataset?.() || null;
  }

  function renderHomeFallback() {
    requestAnimationFrame(() => {
      config.calendar?.render?.();
      config.calendarVisualsUi?.updateMonthStrip?.();
      config.homeUi?.syncNowPanelTheme?.(new Date());
    });
  }

  function setActiveSection(nextSection) {
    const normalized = VALID_SECTIONS.has(nextSection) ? nextSection : "home";
    activeSection = normalized;

    const elements = config.elements || {};
    const ensure = config.ensure || {};
    const referenceData = getReferenceData();
    const magickDataset = getMagickDataset();

    const isHomeOpen = activeSection === "home";
    const isTimelineOpen = activeSection === "timeline";
    const isCalendarOpen = activeSection === "calendar";
    const isHolidaysOpen = activeSection === "holidays";
    const isCalendarMenuOpen = isTimelineOpen || isCalendarOpen || isHolidaysOpen;
    const isTarotOpen = activeSection === "tarot";
    const isAstronomyOpen = activeSection === "astronomy";
    const isPlanetOpen = activeSection === "planets";
    const isCyclesOpen = activeSection === "cycles";
    const isNatalOpen = activeSection === "natal";
    const isZodiacOpen = activeSection === "zodiac";
    const isAstronomyMenuOpen = isAstronomyOpen || isPlanetOpen || isCyclesOpen || isZodiacOpen || isNatalOpen;
    const isElementsOpen = activeSection === "elements";
    const isIChingOpen = activeSection === "iching";
    const isKabbalahOpen = activeSection === "kabbalah";
    const isKabbalahTreeOpen = activeSection === "kabbalah-tree";
    const isCubeOpen = activeSection === "cube";
    const isKabbalahMenuOpen = isKabbalahOpen || isKabbalahTreeOpen || isCubeOpen;
    const isAlphabetOpen = activeSection === "alphabet";
    const isAlphabetLettersOpen = activeSection === "alphabet-letters";
    const isAlphabetTextOpen = activeSection === "alphabet-text";
    const isAlphabetMenuOpen = isAlphabetOpen || isAlphabetLettersOpen || isAlphabetTextOpen;
    const isNumbersOpen = activeSection === "numbers";
    const isQuizOpen = activeSection === "quiz";
    const isGodsOpen = activeSection === "gods";
    const isEnochianOpen = activeSection === "enochian";

    setHidden(elements.timelineSectionEl, !isTimelineOpen);
    setHidden(elements.calendarSectionEl, !isCalendarOpen);
    setHidden(elements.holidaySectionEl, !isHolidaysOpen);
    setHidden(elements.tarotSectionEl, !isTarotOpen);
    setHidden(elements.astronomySectionEl, !isAstronomyOpen);
    setHidden(elements.planetSectionEl, !isPlanetOpen);
    setHidden(elements.cyclesSectionEl, !isCyclesOpen);
    setHidden(elements.natalSectionEl, !isNatalOpen);
    setHidden(elements.elementsSectionEl, !isElementsOpen);
    setHidden(elements.ichingSectionEl, !isIChingOpen);
    setHidden(elements.kabbalahSectionEl, !isKabbalahOpen);
    setHidden(elements.kabbalahTreeSectionEl, !isKabbalahTreeOpen);
    setHidden(elements.cubeSectionEl, !isCubeOpen);
    setHidden(elements.alphabetSectionEl, !isAlphabetOpen);
    setHidden(elements.alphabetLettersSectionEl, !isAlphabetLettersOpen);
    setHidden(elements.alphabetTextSectionEl, !isAlphabetTextOpen);
    setHidden(elements.numbersSectionEl, !isNumbersOpen);
    setHidden(elements.zodiacSectionEl, !isZodiacOpen);
    setHidden(elements.quizSectionEl, !isQuizOpen);
    setHidden(elements.godsSectionEl, !isGodsOpen);
    setHidden(elements.enochianSectionEl, !isEnochianOpen);
    setHidden(elements.nowPanelEl, !isHomeOpen);

    setPressed(elements.openHomeEl, isHomeOpen);
    setPressed(elements.openCalendarEl, isCalendarMenuOpen);
    toggleActive(elements.openCalendarTimelineEl, isTimelineOpen);
    toggleActive(elements.openCalendarMonthsEl, isCalendarOpen);
    toggleActive(elements.openHolidaysEl, isHolidaysOpen);
    setPressed(elements.openTarotEl, isTarotOpen);
    config.tarotSpreadUi?.applyViewState?.();
    setPressed(elements.openAstronomyEl, isAstronomyMenuOpen);
    toggleActive(elements.openPlanetsEl, isPlanetOpen);
    toggleActive(elements.openCyclesEl, isCyclesOpen);
    setPressed(elements.openElementsEl, isElementsOpen);
    setPressed(elements.openIChingEl, isIChingOpen);
    setPressed(elements.openKabbalahEl, isKabbalahMenuOpen);
    toggleActive(elements.openKabbalahTreeEl, isKabbalahTreeOpen);
    toggleActive(elements.openKabbalahCubeEl, isCubeOpen);
    setPressed(elements.openAlphabetEl, isAlphabetMenuOpen);
    toggleActive(elements.openAlphabetLettersEl, isAlphabetLettersOpen);
    toggleActive(elements.openAlphabetTextEl, isAlphabetTextOpen);
    setPressed(elements.openNumbersEl, isNumbersOpen);
    toggleActive(elements.openZodiacEl, isZodiacOpen);
    toggleActive(elements.openNatalEl, isNatalOpen);
    setPressed(elements.openQuizEl, isQuizOpen);
    setPressed(elements.openGodsEl, isGodsOpen);
    setPressed(elements.openEnochianEl, isEnochianOpen);

    if (!isHomeOpen) {
      config.settingsUi?.closeSettingsPopup?.();
    }

    if (isTimelineOpen) {
      renderHomeFallback();
      return;
    }

    if (isCalendarOpen) {
      ensure.ensureCalendarSection?.(referenceData, magickDataset);
      return;
    }

    if (isHolidaysOpen) {
      ensure.ensureHolidaySection?.(referenceData, magickDataset);
      return;
    }

    if (isTarotOpen) {
      if (typeof config.tarotSpreadUi?.handleSectionActivated === "function") {
        config.tarotSpreadUi.handleSectionActivated();
      } else {
        ensure.ensureTarotSection?.(referenceData, magickDataset);
      }
      return;
    }

    if (isPlanetOpen) {
      ensure.ensurePlanetSection?.(referenceData, magickDataset);
      return;
    }

    if (isCyclesOpen) {
      ensure.ensureCyclesSection?.(referenceData);
      return;
    }

    if (isElementsOpen) {
      ensure.ensureElementsSection?.(magickDataset);
      return;
    }

    if (isIChingOpen) {
      ensure.ensureIChingSection?.(referenceData);
      return;
    }

    if (isKabbalahOpen || isKabbalahTreeOpen) {
      ensure.ensureKabbalahSection?.(magickDataset);
      return;
    }

    if (isCubeOpen) {
      ensure.ensureCubeSection?.(magickDataset, referenceData);
      return;
    }

    if (isAlphabetOpen || isAlphabetLettersOpen) {
      ensure.ensureAlphabetSection?.(magickDataset, referenceData);
      return;
    }

    if (isAlphabetTextOpen) {
      ensure.ensureAlphabetTextSection?.();
      return;
    }

    if (isNumbersOpen) {
      ensure.ensureNumbersSection?.();
      return;
    }

    if (isZodiacOpen) {
      ensure.ensureZodiacSection?.(referenceData, magickDataset);
      return;
    }

    if (isNatalOpen) {
      ensure.ensureNatalPanel?.(referenceData);
      return;
    }

    if (isQuizOpen) {
      ensure.ensureQuizSection?.(referenceData, magickDataset);
      return;
    }

    if (isGodsOpen) {
      ensure.ensureGodsSection?.(magickDataset, referenceData);
      return;
    }

    if (isEnochianOpen) {
      ensure.ensureEnochianSection?.(magickDataset, referenceData);
      return;
    }

    config.homeUi?.syncNowPanelTheme?.(new Date());
  }

  function getActiveSection() {
    return activeSection;
  }

  function init(nextConfig = {}) {
    config = {
      ...config,
      ...nextConfig,
      elements: {
        ...(config.elements || {}),
        ...(nextConfig.elements || {})
      },
      ensure: {
        ...(config.ensure || {}),
        ...(nextConfig.ensure || {})
      }
    };
  }

  window.TarotSectionStateUi = {
    ...(window.TarotSectionStateUi || {}),
    init,
    getActiveSection,
    setActiveSection
  };
})();