Merge pull request #115 from mostafaznv/dev

feat: update editor data in source-editing mode
mostafaznv · Feb 29, 2024 · ddc3677 · ddc3677
2 parents 6ed45d8 + fd77edb
commit ddc3677
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 5 deletions.
diff --git a/dist/js/field.js b/dist/js/field.js
diff --git a/docs/README.md b/docs/README.md
@@ -7,11 +7,9 @@
 The **Nova Ckeditor** package combines the power of Laravel Nova with the advanced features of **CKEditor 5**, a modern and versatile text editor. It aims to bring CKEditor 5 integration to Laravel Nova, providing you with an enhanced content creation experience within your Laravel applications.\
 With "Nova Ckeditor," you can seamlessly integrate CKEditor 5 into Laravel Nova and unlock advanced text editing capabilities within your Laravel applications. Whether you're building a blog, a content management system, or any other application that requires rich text editing, "Nova Ckeditor" provides the tools and features you need for a seamless content creation experience.
 
-<div align="left">
 
-<figure><img src="https://mostafaznv.github.io/donate/donate.svg" alt="" width="188"><figcaption></figcaption></figure>
 
-</div>
+[![Donate](https://mostafaznv.github.io/donate/donate.svg)](https://mostafaznv.github.io/donate)
 
 
 

diff --git a/docs/getting-started/support-us.md b/docs/getting-started/support-us.md
@@ -6,7 +6,7 @@ I believe in open source software and its power to change the world for the bett
 
 Your contribution, no matter how small, is deeply appreciated.&#x20;
 
-Thank you for your support!
+Thank you for your support
 
 
 

diff --git a/resources/js/fields/editor-field.vue b/resources/js/fields/editor-field.vue
@@ -122,6 +122,7 @@ export default {
                         this.editorResizeFix(editor, writer)
                     });
 
+                    this.syncDataOnSourceEditing()
 
                     if (this.currentField.readonly) {
                         editor.enableReadOnlyMode(this.$options[this.editorUUID]);
@@ -234,6 +235,27 @@ export default {
             return string
         },
 
+        syncDataOnSourceEditing() {
+            const editor = this.$options[this.editorName]
+            const sourceEditing = editor.plugins.get('SourceEditing')
+
+
+            sourceEditing.on('change:isSourceEditingMode', (_eventInfo, _name, value) => {
+                if (value) {
+                    const sourceEditingTextarea = editor.editing.view.getDomRoot()?.nextSibling?.firstChild
+
+                    if (!sourceEditingTextarea) {
+                        throw new Error('This should not be possible')
+                    }
+
+
+                    sourceEditingTextarea.addEventListener('input', debounce(() => {
+                        sourceEditing.updateEditorData()
+                    }, 500))
+                }
+            })
+        },
+
         fill(formData) {
             if (this.currentlyIsVisible) {
                 formData.append(this.currentField.attribute, this.value || '')