Centralize drag event

src/commands/index.js

@@ -30,6 +30,7 @@
 import { isFunction, includes } from 'underscore';
 import CommandAbstract from './view/CommandAbstract';
 import defaults from './config/config';
+import { eventDrag } from 'dom_components/model/Component';
 
 export default () => {
   let em;
@@ -140,17 +141,17 @@ export default () => {
           nativeDrag ? setTimeout(hideTlb, 0) : hideTlb();
 
           const onStart = data => {
-            em.trigger('component:drag:start', data);
+            em.trigger(`${eventDrag}:start`, data);
           };
           const onDrag = data => {
-            em.trigger('component:drag', data);
+            em.trigger(eventDrag, data);
           };
           const onEnd = (e, opts, data) => {
             em.runDefault(defComOptions);
             selAll.forEach(sel => sel.set('status', 'selected'));
             ed.select(selAll);
             sel.emitUpdate();
-            em.trigger('component:drag:end', data);
+            em.trigger(`${eventDrag}:end`, data);
           };
 
           if (includes(modes, mode)) {

src/dom_components/model/Component.js

@@ -28,6 +28,8 @@ const escapeRegExp = str => {
 
 const avoidInline = em => em && em.getConfig('avoidInlineStyle');
 
+export const eventDrag = 'component:drag';
+
 /**
  * The Component object represents a single node of our template structure, so when you update its properties the changes are
  * immediately reflected on the canvas and in the code to export (indeed, when you ask to export the code we just go through all

src/navigator/view/ItemView.js

@@ -2,6 +2,7 @@ import { isUndefined, isString } from 'underscore';
 import { getModel } from 'utils/mixins';
 import Backbone from 'backbone';
 import ComponentView from 'dom_components/view/ComponentView';
+import { eventDrag } from 'dom_components/model/Component';
 
 const inputProp = 'contentEditable';
 const $ = Backbone.$;
@@ -249,8 +250,8 @@ export default Backbone.View.extend({
     if (e.button && e.button !== 0) return;
 
     if (sorter) {
-      sorter.onStart = data => em.trigger('component:drag:start', data);
-      sorter.onMoveClb = data => em.trigger('component:drag', data);
+      sorter.onStart = data => em.trigger(`${eventDrag}:start`, data);
+      sorter.onMoveClb = data => em.trigger(eventDrag, data);
       sorter.startSort(e.target);
     }
   },

src/navigator/view/ItemsView.js

@@ -1,5 +1,6 @@
 import Backbone from 'backbone';
 import ItemView from './ItemView';
+import { eventDrag } from 'dom_components/model/Component';
 
 export default Backbone.View.extend({
   initialize(o = {}) {
@@ -32,7 +33,7 @@ export default Backbone.View.extend({
         onEndMove(created, sorter, data) {
           const srcModel = sorter.getSourceModel();
           em.setSelected(srcModel, { forceChange: 1 });
-          em.trigger('component:drag:end', data);
+          em.trigger(`${eventDrag}:end`, data);
         },
         avoidSelectOnEnd: 1,
         nested: 1,