Add rte enable/disable events

src/dom_components/view/ComponentTextView.js

@@ -23,6 +23,10 @@ module.exports = ComponentView.extend({
    * @private
    * */
   enableEditing() {
+    if (this.rteEnabled) {
+      return;
+    }
+
     const editable = this.model.get('editable');
     const rte = this.rte;
 
@@ -34,6 +38,7 @@ module.exports = ComponentView.extend({
       }
     }
 
+    this.rteEnabled = 1;
     this.toggleEvents(1);
   },
 
@@ -88,6 +93,7 @@ module.exports = ComponentView.extend({
       }
     }
 
+    this.rteEnabled = 0;
     this.toggleEvents();
   },
 

src/editor/index.js

@@ -54,6 +54,8 @@
  * * `storage:end` - After the storage request is ended
  * * `storage:error` - On any error on storage request, passes the error as an argument
  * * `selector:add` - Triggers when a new selector/class is created
+ * * `rte:enable` - RTE enabled. The view, on which RTE is enabled, is passed as an argument
+ * * `rte:disable` - RTE disabled. The view, on which RTE is disabled, is passed as an argument
  * * `canvasScroll` - Triggered when the canvas is scrolled
  * * `run:{commandName}` - Triggered when some command is called to run (eg. editor.runCommand('preview'))
  * * `stop:{commandName}` - Triggered when some command is called to stop (eg. editor.stopCommand('preview'))

src/rich_text_editor/index.js

@@ -162,6 +162,14 @@ module.exports = () => {
       return globalRte.getActions();
     },
 
+    /**
+     * Get the toolbar element
+     * @return {HTMLElement}
+     */
+    getToolbarEl() {
+      return toolbar;
+    },
+
     /**
      * Triggered when the offset of the editor is changed
      * @private
@@ -205,6 +213,7 @@ module.exports = () => {
         const event = 'change:canvasOffset canvasScroll';
         em.off(event, this.udpatePosition, this);
         em.on(event, this.udpatePosition, this);
+        em.trigger('rte:enable', view, rte);
       }
 
       return rte;
@@ -217,6 +226,7 @@ module.exports = () => {
      * @private
      * */
     disable(view, rte) {
+      const em = config.em;
       const customRte = this.customRte;
       const style = toolbar.style;
       var el = view.getChildrenContainer();
@@ -230,14 +240,7 @@ module.exports = () => {
       style.display = 'none';
       style.top = 0;
       style.left = 0;
-    },
-
-    /**
-     * Get the toolbar element
-     * @return {HTMLElement}
-     */
-    getToolbarEl() {
-      return toolbar;
+      em && em.trigger('rte:disable', view, rte);
     },
   };
 };

src/rich_text_editor/model/RichTextEditor.js

@@ -58,8 +58,6 @@ export default class RichTextEditor {
     el[RTE_KEY] = this;
     this.el = el;
     this.doc = el.ownerDocument;
-    //el.oninput = e => settings.onChange && settings.onChange(e.target.innerHTML);
-    //el.onkeydown = e => (e.which === 9 && e.preventDefault());
 
     this.updateActiveActions = this.updateActiveActions.bind(this);