160 lines
8.3 KiB
JavaScript
160 lines
8.3 KiB
JavaScript
/* /assets/js/bridge/blocks-standard.js (FINAL & LOG-KONTROLLIERT) */
|
|
(function () {
|
|
|
|
const PluginName = 'blocks-standard';
|
|
const B = window.BridgeParts || (window.BridgeParts = {});
|
|
|
|
// ----------------------------------------------------------------------
|
|
// 🎯 NEU: LOKALE LOG-KONFIGURATION UND WRAPPER
|
|
// ----------------------------------------------------------------------
|
|
// Setzen Sie dies auf 'false' in der config.js oder hier, um alle Logs NUR für dieses Plugin zu deaktivieren.
|
|
if (B.LOG_CONFIG && B.LOG_CONFIG.PLUGINS) {
|
|
B.LOG_CONFIG.PLUGINS[PluginName] = false; // <-- HIER IST IHR SCHALTER
|
|
}
|
|
|
|
// NEUER LOKALER WRAPPER, der die zentrale B.log Funktion verwendet:
|
|
const log = (type, message, color = '#0000FF', logType = 'info', force = false) => {
|
|
if (typeof B.log === 'function') {
|
|
B.log(PluginName, `[${type}] ${message}`, color, logType, force);
|
|
} else if (logType === 'error') {
|
|
// Fallback für kritische Fehler, wenn B.log fehlt
|
|
console.error(`%c[${PluginName} - ${type}] %c${message}`, `color:red; font-weight:bold;`, 'color:inherit;');
|
|
} else {
|
|
// Fallback für sonstige Logs
|
|
console.log(`%c[${PluginName} - ${type}] %c${message}`, `color:${color}; font-weight:bold;`, 'color:inherit;');
|
|
}
|
|
};
|
|
// ----------------------------------------------------------------------
|
|
|
|
log('FILE CHECK', 'Datei-IIFE startet.');
|
|
|
|
// Kritische Prüfung, um doppelte Ausführung zu verhindern
|
|
if (window.__STANDARD_BLOCKS_LOADED) return;
|
|
window.__STANDARD_BLOCKS_LOADED = true;
|
|
|
|
const TARGET_CAT_ID = 'mysnips';
|
|
const TARGET_CAT_LABEL = 'Bibliothek';
|
|
const ALL_STANDARD_BLOCK_IDS = [];
|
|
const css = o => Object.entries(o).map(([k,v]) => `${k}:${v}`).join(';');
|
|
|
|
/**
|
|
* Fügt einen Block hinzu oder aktualisiert ihn SICHER
|
|
*/
|
|
function addOrUpdate(bm, id, def) {
|
|
if (bm.get(id)) {
|
|
bm.remove(id);
|
|
log('UPDATE', `Entferne alte Block-Definition: ${id}`, 'gray');
|
|
}
|
|
|
|
const finalDef = {
|
|
...def,
|
|
category: TARGET_CAT_ID,
|
|
force: true
|
|
};
|
|
|
|
try {
|
|
bm.add(id, finalDef);
|
|
} catch (e) {
|
|
log('CRITICAL ERROR', `KRITISCHER FEHLER beim Hinzufügen von '${id}': ${e.message}`, 'red', 'error');
|
|
return;
|
|
}
|
|
|
|
ALL_STANDARD_BLOCK_IDS.push(id);
|
|
}
|
|
|
|
/**
|
|
* Die eigentliche Plugin-Funktion, die von GrapesJS/Bridge aufgerufen wird.
|
|
*/
|
|
const pluginFunction = (editor) => {
|
|
// Aggressiver Log zur Prüfung der Ausführung
|
|
log('EXECUTION CHECK', `Starte Block-Registrierung für ${TARGET_CAT_ID}.`, '#993300');
|
|
|
|
if (!editor || !editor.BlockManager) {
|
|
log('EXECUTION CHECK', 'Fehler: GrapesJS Editor Instanz ist ungültig.', 'red', 'error');
|
|
return;
|
|
}
|
|
|
|
const bm = editor.BlockManager;
|
|
|
|
// =======================================================
|
|
// I. GRAPESJS DEFAULT BLÖCKE (ALLE STANDARD ELEMENTE)
|
|
// =======================================================
|
|
|
|
// TEXT (Registriert als 'std-text')
|
|
addOrUpdate(bm, 'std-text', { label:'Text (Basis)',
|
|
content:`<div data-gjs-type="text" style="${css({'font-family':'Arial,sans-serif','font-size':'14px',color:'#0f172a',margin:'0 0 12px'})}">Absatztext.</div>` });
|
|
|
|
// IMAGE (Registriert als 'std-image')
|
|
addOrUpdate(bm, 'std-image', { label:'Bild (Basis)',
|
|
content:`<img data-gjs-type="image" src="https://placehold.co/600x300" alt="Bild" style="${css({width:'100%',height:'auto','max-width':'600px',border:'0',display:'block'})}">` });
|
|
|
|
// LINK (Registriert als 'std-link')
|
|
addOrUpdate(bm, 'std-link', { label:'Link (Basis)',
|
|
content:`<a href="#" data-gjs-type="link" style="${css({color:'#0ea5e9','text-decoration':'none','font-family':'Arial,sans-serif','font-size':'14px'})}">Hyperlink</a>` });
|
|
|
|
// SECTION (Registriert als 'std-section')
|
|
addOrUpdate(bm, 'std-section', { label:'Sektion',
|
|
content:`<section style="${css({padding:'20px'})}" data-gjs-type="section">
|
|
<div style="${css({'font-family':'Arial,sans-serif','font-size':'14px',color:'#0f172a'})}">Inhalt der Sektion.</div>
|
|
</section>` });
|
|
|
|
// COLUMN (Registriert als 'std-column')
|
|
addOrUpdate(bm, 'std-column', { label:'Spalte',
|
|
content:`<div style="${css({padding:'10px','min-height':'50px','border':'1px dashed #ccc'})}" data-gjs-type="column">
|
|
<div style="${css({'font-family':'Arial,sans-serif','font-size':'12px',color:'#555'})}">Spalteninhalt</div>
|
|
</div>` });
|
|
|
|
// BUTTON (Registriert als 'std-button')
|
|
addOrUpdate(bm, 'std-button', { label:'Button (Basis)',
|
|
content:`<a href="#" data-gjs-type="button" style="${css({display:'inline-block','background-color':'#0ea5e9',color:'#fff','text-decoration':'none',padding:'10px 18px','border-radius':'6px','font-family':'Arial,sans-serif','font-size':'14px'})}">Button</a>` });
|
|
|
|
// TABLE (Registriert als 'std-table')
|
|
addOrUpdate(bm, 'std-table', { label:'Tabelle (Basis)',
|
|
content:`<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="${css({'font-family':'Arial,sans-serif','border-collapse':'collapse','width':'100%'})}">
|
|
<tr>
|
|
<th style="${css({'text-align':'left','padding':'8px','border':'1px solid #e2e8f0','background-color':'#f8fafc','font-size':'13px'})}">Spalte A</th>
|
|
<th style="${css({'text-align':'left','padding':'8px','border':'1px solid #e2e8f0','background-color':'#f8fafc','font-size':'13px'})}">Spalte B</th>
|
|
<th style="${css({'text-align':'left','padding':'8px','border':'1px solid #e2e8f0','background-color':'#f8fafc','font-size':'13px'})}">Spalte C</th>
|
|
</tr>
|
|
<tr>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">Zeile 1</td>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">...</td>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">...</td>
|
|
</tr>
|
|
<tr>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">Zeile 2</td>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">...</td>
|
|
<td style="${css({'padding':'8px','border':'1px solid #e2e8f0','font-size':'13px'})}">...</td>
|
|
</tr>
|
|
</table>` });
|
|
|
|
// DIVIDER (Registriert als 'std-divider')
|
|
addOrUpdate(bm, 'std-divider',{ label:'Trenner (Basis)',
|
|
content:`<hr data-gjs-type="divider" style="${css({border:'0',height:'1px','background-color':'#e2e8f0',margin:'16px 0'})}">` });
|
|
|
|
// MAP (Registriert als 'std-map')
|
|
addOrUpdate(bm, 'std-map', { label:'Karte',
|
|
content:`<iframe data-gjs-type="map" src="https://maps.google.com/maps?width=100%25&height=600&hl=de&q=Berlin&t=&z=14&ie=UTF8&iwloc=B&output=embed" width="100%" height="300" frameborder="0" style="${css({'border':'0',width:'100%',height:'300px'})}"></iframe>` });
|
|
|
|
// Löst die notwendigen Events für den Bridge Core / Cleanup aus.
|
|
editor.trigger('block:add');
|
|
|
|
log('SUCCESS', `Erfolgreich ${ALL_STANDARD_BLOCK_IDS.length} Standardblöcke in Kategorie '${TARGET_CAT_LABEL}' registriert.`, '#008000', 'info', true);
|
|
};
|
|
|
|
// Exportiere für den manuellen Aufruf in bridge-core.js
|
|
window.BridgeBlocksStandard = {
|
|
IDS: ALL_STANDARD_BLOCK_IDS,
|
|
register: pluginFunction,
|
|
};
|
|
|
|
// Registriere das Modul als GrapesJS Plugin (für den Fall, dass es doch anderswo benötigt wird)
|
|
if (B && B.registerGrapesJSPlugin) {
|
|
B.registerGrapesJSPlugin('bridge-blocks-standard', window.BridgeBlocksStandard.register);
|
|
log('PLUGIN REGISTER', `'bridge-blocks-standard' erfolgreich zur Bridge Plugin Registry hinzugefügt.`, '#008000');
|
|
} else {
|
|
log('CRITICAL ERROR', `BridgeParts oder registerGrapesJSPlugin fehlt! Plugin-Registrierung gescheitert.`, 'red', 'error');
|
|
}
|
|
|
|
})();
|