Update BlockView, avoid false positives with the Sorter

GrapesJS · Aug 17, 2017 · 9f39cdf · 9f39cdf
1 parent 6e18b21
commit 9f39cdf
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 11 deletions.
diff --git a/src/block_manager/view/BlockView.js b/src/block_manager/view/BlockView.js
@@ -3,11 +3,11 @@ var Backbone = require('backbone');
 module.exports = Backbone.View.extend({
 
   events: {
-    mousedown: 'onDrag'
+    mousedown: 'startDrag'
   },
 
   initialize(o, config) {
-    _.bindAll(this, 'onDrop');
+    _.bindAll(this, 'endDrag');
     this.config = config || {};
     this.ppfx = this.config.pStylePrefix || '';
     this.listenTo(this.model, 'destroy remove', this.remove);
@@ -18,7 +18,7 @@ module.exports = Backbone.View.extend({
    * Start block dragging
    * @private
    */
-  onDrag(e) {
+  startDrag(e) {
     //Right or middel click
     if (e.button !== 0) {
       return;
@@ -33,16 +33,23 @@ module.exports = Backbone.View.extend({
     sorter.setDragHelper(this.el, e);
     sorter.startSort(this.el);
     sorter.setDropContent(this.model.get('content'));
-    this.doc.on('mouseup', this.onDrop);
+    this.doc.on('mouseup', this.endDrag);
   },
 
   /**
    * Drop block
    * @private
    */
-  onDrop() {
-    this.doc.off('mouseup', this.onDrop);
-    this.config.getSorter().endMove();
+  endDrag(e) {
+    this.doc.off('mouseup', this.endDrag);
+    const sorter = this.config.getSorter();
+
+    // After dropping the block in the canvas the mouseup event is not yet
+    // triggerd on 'this.doc' and so clicking outside, the sorter, tries to move
+    // things (throws false positives). As this method just need to drop away
+    // the block helper I use the trick of 'moved = 0' to void those errors.
+    sorter.moved = 0;
+    sorter.endMove();
   },
 
   render() {

diff --git a/src/block_manager/view/BlocksView.js b/src/block_manager/view/BlocksView.js
@@ -73,7 +73,8 @@ module.exports = Backbone.View.extend({
    * @private
    */
   onDrop(model) {
-    this.em.runDefault();
+    const em = this.em;
+    em.runDefault();
 
     if (model && model.get) {
       if(model.get('activeOnRender')) {
@@ -82,9 +83,9 @@ module.exports = Backbone.View.extend({
       }
 
       // Register all its components (eg. for the Undo Manager)
-      this.em.initChildrenComp(model);
+      em.initChildrenComp(model);
+      em.trigger('block:drag:stop', model);
     }
-    this.em.trigger('block:drag:stop', model);
   },
 
   /**

diff --git a/src/utils/Sorter.js b/src/utils/Sorter.js
@@ -769,8 +769,10 @@ module.exports = Backbone.View.extend({
       }
     }
 
-    if(this.moved)
+    if (this.moved) {
       created = this.move(this.target, src, this.lastPos);
+    }
+
     if(this.plh)
       this.plh.style.display = 'none';