ZDDC/tables/js/main.js

(function (app) {
    'use strict';

    async function init() {
        const ctx = await app.modules.context.load();
        app.context = ctx;

        const titleEl = document.getElementById('table-title');
        if (ctx.title && titleEl) {
            titleEl.textContent = ctx.title;
            document.title = 'ZDDC — ' + ctx.title;
        }

        const descEl = document.getElementById('table-description');
        if (descEl && ctx.description) {
            descEl.textContent = ctx.description;
            descEl.hidden = false;
        }

        const tableEl = document.getElementById('table-root');
        const theadEl = tableEl.querySelector('thead');
        const tbodyEl = tableEl.querySelector('tbody');
        const emptyEl = document.getElementById('table-empty');
        const countEl = document.getElementById('table-rowcount');
        const clearBtn = document.getElementById('table-clear-filters');

        const columns = Array.isArray(ctx.columns) ? ctx.columns : [];
        const allRows = Array.isArray(ctx.rows) ? ctx.rows : [];

        const state = app.state;
        state.rows = allRows;
        state.sort = app.modules.sort.defaultsFromContext(ctx);
        state.filter = {};

        // Seed default filters from context.defaults.filter (per-column).
        if (ctx.defaults && ctx.defaults.filter && typeof ctx.defaults.filter === 'object') {
            for (let i = 0; i < columns.length; i++) {
                const col = columns[i];
                const seeded = ctx.defaults.filter[col.field];
                if (seeded == null) {
                    continue;
                }
                if (app.modules.filters.isEnumColumn(col)) {
                    state.filter[col.field] = {
                        kind: 'enum',
                        value: Array.isArray(seeded) ? seeded.slice() : [String(seeded)]
                    };
                } else {
                    state.filter[col.field] = { kind: 'contains', value: String(seeded) };
                }
            }
        }

        function anyFilterActive() {
            const filters = app.modules.filters;
            const keys = Object.keys(state.filter);
            for (let i = 0; i < keys.length; i++) {
                if (!filters.isEmpty(state.filter[keys[i]])) {
                    return true;
                }
            }
            return false;
        }

        function paint() {
            const filtered = app.modules.filters.apply(state.rows, columns, state.filter, app.modules.util.resolveField);
            const sorted = app.modules.sort.apply(filtered, state.sort, columns, app.modules.util);
            app.modules.render.header(theadEl, columns, state.sort, state.filter, onHeaderClick, onFilterChange);
            app.modules.render.body(tbodyEl, sorted, columns);
            app.modules.render.rowCount(countEl, sorted.length, state.rows.length);
            if (emptyEl) {
                emptyEl.hidden = sorted.length > 0 || state.rows.length === 0;
            }
            if (clearBtn) {
                clearBtn.hidden = !anyFilterActive();
            }
        }

        function onHeaderClick(field, shiftKey) {
            state.sort = app.modules.sort.cycle(state.sort, field, shiftKey);
            paint();
        }

        function onFilterChange(field, value) {
            state.filter[field] = value;
            paint();
        }

        if (clearBtn) {
            clearBtn.addEventListener('click', function () {
                state.filter = {};
                paint();
            });
        }

        paint();
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
})(window.tablesApp);