feat: implement instant live DOM rendering and debounced auto-save to backend

This commit is contained in:
Daniel S
2026-08-10 00:21:22 +02:00
parent 4b7f3f554b
commit 9c166817fa
4 changed files with 699 additions and 242 deletions

View File

@@ -21,13 +21,39 @@
const { type, payload } = event.data || {};
if (type === 'THEME_UPDATE') {
// Injiziert CSS-Variablen live in den DOM (<head>)
const root = document.documentElement;
if (payload.colors) {
Object.entries(payload.colors).forEach(([key, val]) => {
root.style.setProperty(`--${key}`, val);
});
}
// Live Section DOM Patching
if (payload.sectionId && payload.settings) {
const secElement = document.querySelector(`[data-section-id="${payload.sectionId}"], #${payload.sectionId}`) || document.querySelector('section');
if (secElement) {
const { title, subtitle, cta_text, bg_color, accent_color } = payload.settings;
if (title !== undefined) {
const h1OrH2 = secElement.querySelector('h1, h2, h3');
if (h1OrH2) h1OrH2.textContent = title;
}
if (subtitle !== undefined) {
const p = secElement.querySelector('p');
if (p) p.textContent = subtitle;
}
if (cta_text !== undefined) {
const btn = secElement.querySelector('a, button');
if (btn) btn.textContent = cta_text;
}
if (bg_color !== undefined && bg_color !== '') {
secElement.style.backgroundColor = bg_color;
}
if (accent_color !== undefined && accent_color !== '') {
secElement.style.setProperty('--accent-color', accent_color);
}
}
}
}
if (type === 'RELOAD_CANVAS') {