(() => {
    const normalizeUrl = (url) => {
        const next = new URL(url, window.location.origin);
        next.searchParams.set('partial', '1');
        return next.toString();
    };

    const renderError = (host, message) => {
        host.innerHTML = `
            <div class="window-app-shell cm-shell">
                <div class="window-app-frame cm-frame">
                    <main class="window-app-main cm-main">
                        <div class="window-app-panel cm-panel">
                            <section class="window-app-card cm-card">
                                <p class="cm-message is-error">${String(message || 'Cron Tool konnte nicht geladen werden.')}</p>
                            </section>
                        </div>
                    </main>
                </div>
            </div>
        `;
    };

    const bindInteractions = (host, loadRoute) => {
        host.querySelectorAll('[data-cm-edit-toggle]').forEach((button) => {
            if (button.dataset.cmBound === '1') {
                return;
            }

            button.dataset.cmBound = '1';
            button.addEventListener('click', () => {
                const targetId = String(button.getAttribute('data-cm-edit-toggle') || '');
                const target = targetId !== '' ? host.querySelector(`[data-cm-edit-target="${CSS.escape(targetId)}"]`) : null;
                if (!(target instanceof HTMLElement)) {
                    return;
                }

                target.hidden = !target.hidden;
            });
        });

        host.querySelectorAll('[data-cm-edit-close]').forEach((button) => {
            if (button.dataset.cmBound === '1') {
                return;
            }

            button.dataset.cmBound = '1';
            button.addEventListener('click', () => {
                const targetId = String(button.getAttribute('data-cm-edit-close') || '');
                const target = targetId !== '' ? host.querySelector(`[data-cm-edit-target="${CSS.escape(targetId)}"]`) : null;
                if (target instanceof HTMLElement) {
                    target.hidden = true;
                }
            });
        });

        host.querySelectorAll('form[action]').forEach((form) => {
            if (form.dataset.cmBound === '1') {
                return;
            }

            const action = String(form.getAttribute('action') || '');
            if (!action.startsWith('/admin/cron/')) {
                return;
            }

            form.dataset.cmBound = '1';
            form.addEventListener('submit', async (event) => {
                event.preventDefault();

                try {
                    host.classList.add('is-loading');
                    const response = await fetch(normalizeUrl(action), {
                        method: 'POST',
                        credentials: 'same-origin',
                        body: new FormData(form),
                    });

                    const html = await response.text();
                    if (!response.ok) {
                        throw new Error(`HTTP ${response.status}`);
                    }

                    host.innerHTML = html;
                    bindInteractions(host, loadRoute);
                } catch (error) {
                    renderError(host, error?.message || 'Cron Tool konnte nicht geladen werden.');
                } finally {
                    host.classList.remove('is-loading');
                }
            });
        });
    };

    window.initCronManagementApp = function initCronManagementApp(host, options = {}) {
        if (!(host instanceof Element)) {
            return;
        }

        if (host.dataset.cmAppBound === '1') {
            return;
        }

        host.dataset.cmAppBound = '1';

        const entryRoute = String(options.entryRoute || '/admin/cron/');
        const loadRoute = async (route) => {
            try {
                host.classList.add('is-loading');
                const response = await fetch(normalizeUrl(route), {
                    credentials: 'same-origin',
                    headers: { Accept: 'text/html' },
                });
                const html = await response.text();
                if (!response.ok) {
                    throw new Error(`HTTP ${response.status}`);
                }

                host.innerHTML = html;
                bindInteractions(host, loadRoute);
            } catch (error) {
                renderError(host, error?.message || 'Cron Tool konnte nicht geladen werden.');
            } finally {
                host.classList.remove('is-loading');
            }
        };

        if (options.standalone) {
            bindInteractions(host, loadRoute);
            return;
        }

        loadRoute(entryRoute);
    };
})();