diff --git a/static/js/my-editor.js b/static/js/my-editor.js index a435272..58eace8 100644 --- a/static/js/my-editor.js +++ b/static/js/my-editor.js @@ -1211,6 +1211,7 @@ patchPageTree(); patchI18n(); enableSaveBtn(); + initCKEditorOverride(); }); } else { patchSaveAjax(); @@ -1219,5 +1220,116 @@ patchPageTree(); patchI18n(); enableSaveBtn(); + initCKEditorOverride(); + } + + // ── 動態載入並覆寫 CKEditor ─────────────────────────────────────── + function initCKEditorOverride() { + const script = document.createElement("script"); + script.src = "https://cdn.ckeditor.com/4.22.1/full-all/ckeditor.js"; + script.onload = () => { + // 隱藏版本過期警告 + if (CKEDITOR.config) { + CKEDITOR.config.versionCheck = false; + } + + const ckeditorOptions = { + extraPlugins: "sharedspace", + removePlugins: "exportpdf", // 解決 exportpdf-no-token-url 錯誤 + sharedSpaces: { + top: "#wysiwyg-editor", + } + }; + + // 覆寫 Vvveb 原生的 WysiwygEditor,改用 Vanilla JS + Vvveb.WysiwygEditor = { + isActive: false, + oldValue: '', + doc: false, + editor: false, + toolbar: false, + + init: function(doc) { + this.doc = doc; + this.toolbar = document.getElementById('wysiwyg-editor'); + if (this.toolbar) { + this.toolbar.classList.remove("default-editor"); + this.toolbar.classList.add("ckeditor"); + this.toolbar.innerHTML = ''; + } + }, + + edit: function(element) { + this.element = element; + this.isActive = true; + this.oldValue = element.innerHTML; + Vvveb.Builder.selectPadding = 10; + + element.setAttribute('contenteditable', true); + element.setAttribute('spellcheckker', false); + + CKEDITOR.disableAutoInline = true; + ckeditorOptions.sharedSpaces.top = this.toolbar; + + if (this.editor) { + try { this.editor.destroy(); } catch(e) {} + } + this.editor = CKEDITOR.inline(element, ckeditorOptions); + + if (this.toolbar) { + this.toolbar.style.display = "block"; + } + }, + + destroy: function(element) { + this.isActive = false; + + if (this.editor) { + try { + this.editor.destroy(); + } catch (e) { + console.warn("[my-editor] CKEditor destroy error", e); + } + this.editor = false; + } + + if (element) { + element.removeAttribute('contenteditable'); + element.removeAttribute('spellcheckker'); + + // 清除 CKEditor 殘留屬性,避免破壞 DOM 導致 VvvebJs 報錯 + element.classList.remove('cke_editable', 'cke_editable_inline', 'cke_focus'); + + // 嘗試修復 Vvveb.Builder.selectedEl 為 null 的問題 + if (typeof Vvveb.Builder !== "undefined" && !Vvveb.Builder.selectedEl) { + Vvveb.Builder.selectedEl = element; + } + } + + if (this.toolbar) { + this.toolbar.style.display = "none"; + } + + const node = this.element || element; + if (node && Vvveb.Undo) { + Vvveb.Undo.addMutation({ + type: 'characterData', + target: node, + oldValue: this.oldValue, + newValue: node.innerHTML + }); + } + } + }; + + // 嘗試立即初始化,以綁定 `#wysiwyg-editor` 元素 + if (typeof Vvveb !== "undefined" && Vvveb.Builder && Vvveb.Builder.iframe) { + Vvveb.WysiwygEditor.init(Vvveb.Builder.iframe.contentDocument); + } + + console.log("[my-editor] CKEditor 4 external override injected successfully."); + }; + + document.head.appendChild(script); } })(); diff --git a/websites/my-website/about-final.html b/websites/my-website/about-final.html index 79e902e..5763c3a 100644 --- a/websites/my-website/about-final.html +++ b/websites/my-website/about-final.html @@ -1,5 +1,5 @@ -
+ @@ -23,7 +23,7 @@Start by dragging components to page or double click to edit text
Start by dragging components to page or double click to edit text
+Start by dragging components to page or double click to edit text
-Lorem ipsum
Start by dragging components to page or double click to edit text
+