Merge pull request #623 from mailpoet/drag_drop

Enable dragging text blocks

assets/js/src/newsletter_editor/blocks/footer.js

@@ -71,11 +71,17 @@ define([
             that.model.set('text', editor.getContent());
           });
 
+          editor.on('click', function(e) {
+            editor.focus();
+          });
+
           editor.on('focus', function(e) {
+            that.disableDragging();
             that.disableShowingTools();
           });
 
           editor.on('blur', function(e) {
+            that.enableDragging();
             that.enableShowingTools();
           });
         },
@@ -84,6 +90,12 @@ define([
         mailpoet_shortcodes_window_title: MailPoet.I18n.t('shortcodesWindowTitle'),
       });
     },
+    disableDragging: function() {
+      this.$('.mailpoet_content').addClass('mailpoet_ignore_drag');
+    },
+    enableDragging: function() {
+      this.$('.mailpoet_content').removeClass('mailpoet_ignore_drag');
+    },
   });
 
   Module.FooterBlockToolsView = base.BlockToolsView.extend({

assets/js/src/newsletter_editor/blocks/header.js

@@ -71,11 +71,17 @@ define([
             that.model.set('text', editor.getContent());
           });
 
+          editor.on('click', function(e) {
+            editor.focus();
+          });
+
           editor.on('focus', function(e) {
+            that.disableDragging();
             that.disableShowingTools();
           });
 
           editor.on('blur', function(e) {
+            that.enableDragging();
             that.enableShowingTools();
           });
         },
@@ -84,6 +90,12 @@ define([
         mailpoet_shortcodes_window_title: MailPoet.I18n.t('shortcodesWindowTitle'),
       });
     },
+    disableDragging: function() {
+      this.$('.mailpoet_content').addClass('mailpoet_ignore_drag');
+    },
+    enableDragging: function() {
+      this.$('.mailpoet_content').removeClass('mailpoet_ignore_drag');
+    },
   });
 
   Module.HeaderBlockToolsView = base.BlockToolsView.extend({

assets/js/src/newsletter_editor/blocks/text.js

@@ -69,11 +69,17 @@ define([
               that.model.set('text', editor.getContent());
             });
 
+            editor.on('click', function(e) {
+              editor.focus();
+            });
+
             editor.on('focus', function(e) {
+              that.disableDragging();
               that.disableShowingTools();
             });
 
             editor.on('blur', function(e) {
+              that.enableDragging();
               that.enableShowingTools();
             });
           },
@@ -83,6 +89,12 @@ define([
         });
       }
     },
+    disableDragging: function() {
+      this.$('.mailpoet_content').addClass('mailpoet_ignore_drag');
+    },
+    enableDragging: function() {
+      this.$('.mailpoet_content').removeClass('mailpoet_ignore_drag');
+    },
   });
 
   Module.TextBlockToolsView = base.BlockToolsView.extend({

views/newsletter/templates/blocks/footer/block.hbs

@@ -16,5 +16,5 @@
         text-decoration: {{ model.styles.link.textDecoration }};
     }
 </style>
-<div class="mailpoet_content mailpoet_text_content mailpoet_ignore_drag">{{{ model.text }}}</div>
+<div class="mailpoet_content mailpoet_text_content">{{{ model.text }}}</div>
 <div class="mailpoet_block_highlight"></div>

views/newsletter/templates/blocks/header/block.hbs

@@ -16,5 +16,5 @@
         text-decoration: {{ model.styles.link.textDecoration }};
     }
 </style>
-<div class="mailpoet_content mailpoet_text_content mailpoet_ignore_drag">{{{ model.text }}}</div>
+<div class="mailpoet_content mailpoet_text_content">{{{ model.text }}}</div>
 <div class="mailpoet_block_highlight"></div>

views/newsletter/templates/blocks/text/block.hbs

@@ -1,3 +1,3 @@
 <div class="mailpoet_tools"></div>
-<div class="mailpoet_content mailpoet_text_content mailpoet_ignore_drag">{{{ model.text }}}</div>
+<div class="mailpoet_content mailpoet_text_content">{{{ model.text }}}</div>
 <div class="mailpoet_block_highlight"></div>