R1 foundation - Phase 1 live build

static/app.js

@@ -0,0 +1,56 @@
+/* Life OS - UI Interactions */
+
+document.addEventListener('DOMContentLoaded', () => {
+    // Theme toggle
+    const theme = localStorage.getItem('lifeos-theme') || 'dark';
+    document.documentElement.setAttribute('data-theme', theme);
+
+    // Domain tree collapse
+    document.querySelectorAll('.domain-header').forEach(header => {
+        header.addEventListener('click', () => {
+            const children = header.nextElementSibling;
+            if (children && children.classList.contains('domain-children')) {
+                children.classList.toggle('collapsed');
+                const key = 'sidebar-' + header.dataset.domainId;
+                localStorage.setItem(key, children.classList.contains('collapsed'));
+            }
+        });
+    });
+
+    // Restore collapsed state
+    document.querySelectorAll('.domain-children').forEach(el => {
+        const key = 'sidebar-' + el.dataset.domainId;
+        if (localStorage.getItem(key) === 'true') {
+            el.classList.add('collapsed');
+        }
+    });
+
+    // Auto-submit filters on change
+    document.querySelectorAll('.filter-select[data-auto-submit]').forEach(select => {
+        select.addEventListener('change', () => {
+            select.closest('form').submit();
+        });
+    });
+
+    // Confirm delete dialogs
+    document.querySelectorAll('form[data-confirm]').forEach(form => {
+        form.addEventListener('submit', (e) => {
+            if (!confirm(form.dataset.confirm)) {
+                e.preventDefault();
+            }
+        });
+    });
+});
+
+// Theme toggle function
+function toggleTheme() {
+    const current = document.documentElement.getAttribute('data-theme');
+    const next = current === 'dark' ? 'light' : 'dark';
+    document.documentElement.setAttribute('data-theme', next);
+    localStorage.setItem('lifeos-theme', next);
+}
+
+// Collapsed style
+document.head.insertAdjacentHTML('beforeend',
+    '<style>.domain-children.collapsed { display: none; }</style>'
+);