ZDDC/tables/js/mode.js

// mode.js — picks table-mode vs form-mode at boot time and unhides the
// matching container. Both apps (tablesApp, formApp) ship in the same
// bundle but each only paints when its container is visible.
//
// Decision rule:
//   /<dir>/table.html        → table mode
//   /<dir>/form.html         → form mode (empty / create)
//   /<dir>/<id>.yaml.html    → form mode (re-edit)
//   anything else / file://  → table mode (legacy default; tables tool
//                              was the original consumer of this bundle)
//
// In offline / file:// mode the inline-context placeholders decide:
// whichever blob is non-empty wins. Tests that inject only
// #form-context render in form mode; tests that inject only
// #table-context render in table mode.
(function () {
    'use strict';

    function modeFromUrl() {
        const path = String((typeof location !== 'undefined' && location.pathname) || '');
        if (/\/form\.html$/.test(path) || /\.yaml\.html$/.test(path)) {
            return 'form';
        }
        if (/\/table\.html$/.test(path)) {
            return 'table';
        }
        return null; // unknown — will be decided once DOM is parsed.
    }

    function readInline(id) {
        const el = document.getElementById(id);
        if (!el) return null;
        try {
            return JSON.parse(el.textContent || '{}');
        } catch (_) {
            return null;
        }
    }

    function modeFromInline() {
        // file:// or unrecognised URL — whichever inline-context blob is
        // non-empty wins. Tests that inject only #form-context render in
        // form mode; tests that inject only #table-context render in
        // table mode. Default to table for legacy compatibility.
        const formCtx = readInline('form-context');
        if (formCtx && Object.keys(formCtx).length > 0) {
            return 'form';
        }
        return 'table';
    }

    // Best-effort synchronous decision so per-app boot guards can read
    // window.zddcMode without waiting for DOM. URL-based decision is
    // always known up-front; inline-context fallback only matters for
    // file:// and is finalized at DOMContentLoaded.
    window.zddcMode = modeFromUrl() || 'table';

    function activate() {
        if (modeFromUrl() == null) {
            window.zddcMode = modeFromInline();
        }
        const tableEl = document.getElementById('table-mode');
        const formEl = document.getElementById('form-mode');
        if (window.zddcMode === 'form' && formEl) {
            formEl.hidden = false;
        } else if (tableEl) {
            tableEl.hidden = false;
        }
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', activate, { once: true });
    } else {
        activate();
    }
})();