diff --git a/public/assets/js/bridge/blocks-custom.js b/public/assets/js/bridge/blocks-custom.js index c3a8ba7..9ffd2a5 100644 --- a/public/assets/js/bridge/blocks-custom.js +++ b/public/assets/js/bridge/blocks-custom.js @@ -66,6 +66,7 @@ }) .catch(err => { placeholderSchemaStore.tables = []; + placeholderSchemaStore.promise = null; log('PLACEHOLDER ERROR', `Schema konnte nicht geladen werden: ${err.message || err}`, 'red', 'error'); throw err; }); @@ -90,18 +91,12 @@ const domc = editor.DomComponents; if (domc.getType(PLACEHOLDER_COMPONENT)) return; - const defaultType = domc.getType('default'); - const defaultModel = defaultType ? defaultType.model : null; - const defaultView = defaultType ? defaultType.view : null; - domc.addType(PLACEHOLDER_COMPONENT, { - model: (defaultModel || editor.DomComponents.Component).extend({ + extend: 'text', + model: { defaults: { - ...(defaultModel && defaultModel.prototype?.defaults ? defaultModel.prototype.defaults : {}), name: 'Placeholder', tagName: 'span', - selectable: true, - hoverable: true, droppable: false, attributes: { 'data-placeholder-type': 'custom', @@ -145,14 +140,17 @@ init() { this.listenTo(this, 'change:attributes', this.updatePlaceholderState); this.updatePlaceholderState(); - fetchPlaceholderSchema().then(() => { - this.updateSchemaTraits(); - }).catch(() => { - this.updateSchemaTraits([]); - }); + fetchPlaceholderSchema() + .then(() => this.updateSchemaTraits()) + .catch(() => this.updateSchemaTraits([])); }, updatePlaceholderState() { + const attrs = this.getAttributes(); + const type = attrs['data-placeholder-type'] || 'custom'; + if (type === 'database' && placeholderSchemaStore.tables.length === 0) { + this.addAttributes({ 'data-placeholder-type': 'custom' }); + } this.updateTraitVisibility(); this.updateSchemaTraits(); this.updateLabel(); @@ -181,11 +179,18 @@ const tables = Array.isArray(tablesOverride) ? tablesOverride : placeholderSchemaStore.tables; const tableTrait = getTraitByName(this, 'data-placeholder-table'); const columnTrait = getTraitByName(this, 'data-placeholder-column'); + const loading = !tablesOverride && placeholderSchemaStore.promise && !tables.length; if (tableTrait) { - const opts = tables.map(tbl => ({ id: tbl.name, label: tbl.name })); - tableTrait.set('options', opts); - if (tableTrait.view && tableTrait.view.render) tableTrait.view.render(); + let opts; + if (tables.length) { + opts = tables.map(tbl => ({ id: tbl.name, label: tbl.name })); + } else if (loading) { + opts = [{ id: '', label: 'Tabellen werden geladen…', disabled: true }]; + } else { + opts = [{ id: '', label: 'Keine Tabellen verfügbar', disabled: true }]; + } + setTraitOptions(tableTrait, opts); } if (columnTrait) { @@ -193,13 +198,9 @@ const tableName = (attrs['data-placeholder-table'] || '').toLowerCase(); const table = tables.find(tbl => tbl.name.toLowerCase() === tableName); const colOpts = table - ? table.columns.map(col => ({ - id: col.name, - label: `${col.name} (${col.type})`, - })) - : []; - columnTrait.set('options', colOpts); - if (columnTrait.view && columnTrait.view.render) columnTrait.view.render(); + ? table.columns.map(col => ({ id: col.name, label: `${col.name} (${col.type})` })) + : [{ id: '', label: table ? 'Keine Felder' : 'Feld wählen', disabled: !table }]; + setTraitOptions(columnTrait, colOpts); } }, @@ -230,11 +231,9 @@ return false; }, }), - view: (defaultView || editor.DomComponents.View).extend({ + view: editor.DomComponents.View.extend({ render() { - defaultView && defaultView.prototype.render - ? defaultView.prototype.render.apply(this, arguments) - : editor.DomComponents.View.prototype.render.apply(this, arguments); + editor.DomComponents.View.prototype.render.apply(this, arguments); this.el.classList.add('placeholder-block'); this.el.style.display = 'inline-block'; this.el.style.padding = '2px 8px'; @@ -249,6 +248,14 @@ }); }; + function setTraitOptions(trait, options) { + if (!trait) return; + trait.set('options', options); + if (trait.view && typeof trait.view.render === 'function') { + trait.view.render(); + } + } + function register(editor) { log('EXECUTION', `Starte Block-Registrierung für ${TARGET_CAT_ID}.`, '#DAA520'); diff --git a/public/assets/js/ui-user.js b/public/assets/js/ui-user.js index 6fa1d12..4aea837 100644 --- a/public/assets/js/ui-user.js +++ b/public/assets/js/ui-user.js @@ -40,6 +40,8 @@ let debugStylesInjected = false; let consolePatched = false; const consoleBuffer = []; +ensureConsoleCapture(); + export function initUserPanel() { avatarBtn = document.getElementById('btn-user'); userMenuPanel = document.getElementById('userMenuPanel');