Make eventhub events specific to the field's unique id

fabianmichael · Jan 23, 2019 · f62b775 · f62b775
1 parent 2307724
commit f62b775
Show file tree

Hide file tree

Showing 9 changed files with 17 additions and 14 deletions.
diff --git a/index.js b/index.js
diff --git a/src/components/input/MarkdownInput.vue b/src/components/input/MarkdownInput.vue
@@ -3,7 +3,7 @@
         <div class="k-markdown-input-wrapper" :data-size="size">
             <k-markdown-toolbar v-if="buttons"
                        ref="toolbar"
-                       :name="name"
+                       :id="id"
                        :modals="modals"
                        :editor="editor"
                        :invisibles="invisibles"
@@ -46,10 +46,10 @@ export default {
             skipNextChangeEvent: false,
             currentDialog: null,
             currentTokenType: null,
+            id: '',
         }
     },
     props: {
-        name: String,
         autofocus: Boolean,
         modals: Boolean,
         blank: Boolean,
@@ -82,6 +82,9 @@ export default {
             },
         },
     },
+    created() {
+        this.id = this._uid
+    },
     mounted() {
         this.editor = CodeMirror.fromTextArea(this.$refs.input, this.options);
         this.editor.setValue(this.value || '');
@@ -96,14 +99,14 @@ export default {
         }
 
         // Register shortcuts
-        this.$root.$on('md-registerShortcut' + this.name, (shortcut, fn) => {
+        this.$root.$on('md-registerShortcut' + this.id, (shortcut, fn) => {
             let map = {}
                 map[shortcut] = fn
             this.editor.addKeyMap(map)
         })
 
         // Open dialogs
-        this.$root.$on('md-openDialog' + this.name, dialog => {
+        this.$root.$on('md-openDialog' + this.id, dialog => {
             let dialogName = dialog == 'images' ? 'files' : dialog
 
             if(this.$refs[dialogName + "Dialog"]) {

diff --git a/src/components/toolbar/MarkdownToolbar.vue b/src/components/toolbar/MarkdownToolbar.vue
@@ -1,7 +1,7 @@
 <template>
     <nav class="k-toolbar k-markdown-toolbar">
         <div class="k-toolbar-buttons k-markdown-toolbar-buttons">
-            <component v-for="(button, index) in layout" :is="'k-markdown-button-' + buttonName(button)" :key="index" :button="button" :name="buttonName(button)" :currentTokenType="currentTokenType" :buttonIndex="index" :editor="editor" :modals="modals" :fieldname="name"/>
+            <component v-for="(button, index) in layout" :is="'k-markdown-button-' + buttonName(button)" :key="index" :button="button" :name="buttonName(button)" :currentTokenType="currentTokenType" :buttonIndex="index" :editor="editor" :modals="modals" :id="id"/>
             <div v-if="invisibles" class="k-markdown-toolbar-buttons-right">
                 <component is="k-markdown-button-invisibles" button="invisibles" name="invisibles" buttonIndex="100" :editor="editor" :modals="modals"/>
             </div>
@@ -12,7 +12,7 @@
 <script>
 export default {
     props: {
-        name: String,
+        id: String,
         buttons: Array,
         editor: Object,
         modals: Boolean,

diff --git a/src/components/toolbar/buttons/button.vue b/src/components/toolbar/buttons/button.vue
@@ -12,7 +12,7 @@ export default {
     props: {
         button: [String, Object],
         buttonIndex: String,
-        fieldname: String,
+        id: String,
         editor: Object,
         modals: Boolean,
         currentTokenType: String,
@@ -40,7 +40,7 @@ export default {
     watch: {
         editor(val) {
             if(typeof val !== 'undefined' && this.shortcut) {
-                this.$root.$emit('md-registerShortcut' + this.fieldname, this.shortcut, this.action)
+                this.$root.$emit('md-registerShortcut' + this.id, this.shortcut, this.action)
             }
         },
     },

diff --git a/src/components/toolbar/buttons/email.vue b/src/components/toolbar/buttons/email.vue
@@ -20,7 +20,7 @@ export default {
         action() {
             // open a modal if allowed
             if(this.modals) {
-                this.$root.$emit('md-openDialog' + this.fieldname, 'email')
+                this.$root.$emit('md-openDialog' + this.id, 'email')
             }
             // else, insert an inline tag
             else {

diff --git a/src/components/toolbar/buttons/file.vue b/src/components/toolbar/buttons/file.vue
@@ -17,7 +17,7 @@ export default {
 	},
 	methods: {
 		action() {
-			this.$root.$emit('md-openDialog' + this.fieldname, 'files')
+			this.$root.$emit('md-openDialog' + this.id, 'files')
 		}
 	}
 };

diff --git a/src/components/toolbar/buttons/image.vue b/src/components/toolbar/buttons/image.vue
@@ -17,7 +17,7 @@ export default {
 	},
 	methods: {
 		action() {
-			this.$root.$emit('md-openDialog' + this.fieldname, 'images')
+			this.$root.$emit('md-openDialog' + this.id, 'images')
 		}
 	}
 };

diff --git a/src/components/toolbar/buttons/link.vue b/src/components/toolbar/buttons/link.vue
@@ -20,7 +20,7 @@ export default {
         action() {
             // open a modal if allowed
             if(this.modals) {
-                this.$root.$emit('md-openDialog' + this.fieldname, 'link')
+                this.$root.$emit('md-openDialog' + this.id, 'link')
             }
             // else, insert an inline tag
             else {

diff --git a/src/components/toolbar/buttons/pagelink.vue b/src/components/toolbar/buttons/pagelink.vue
@@ -17,7 +17,7 @@ export default {
 	},
 	methods: {
 		action() {
-			this.$root.$emit('md-openDialog' + this.fieldname, 'pages')
+			this.$root.$emit('md-openDialog' + this.id, 'pages')
 		}
 	}
 };