Prevent component selection on frame resize

src/canvas/view/FrameView.js

@@ -1,6 +1,8 @@
-var Backbone = require('backbone');
+import { bindAll } from 'underscore'
 
-module.exports = Backbone.View.extend({
+const motionsEv = 'transitionend oTransitionEnd transitionend webkitTransitionEnd';
+
+module.exports = require('backbone').View.extend({
 
   tagName: 'iframe',
 
@@ -10,11 +12,10 @@ module.exports = Backbone.View.extend({
   },
 
   initialize(o) {
-    _.bindAll(this, 'udpateOffset');
+    bindAll(this, 'udpateOffset');
     this.config = o.config || {};
     this.ppfx = this.config.pStylePrefix || '';
     this.em = this.config.em;
-    this.motionsEv = 'transitionend oTransitionEnd transitionend webkitTransitionEnd';
     this.listenTo(this.em, 'change:device', this.updateWidth);
   },
 
@@ -23,16 +24,20 @@ module.exports = Backbone.View.extend({
    * @private
    */
   updateWidth(model) {
-    var device = this.em.getDeviceModel();
+    const em = this.em;
+    const device = em.getDeviceModel();
     this.el.style.width = device ? device.get('width') : '';
     this.udpateOffset();
-    this.$el.on(this.motionsEv, this.udpateOffset);
+    em.stopDefault({ preserveSelected: 1 });
+    this.$el.on(motionsEv, this.udpateOffset);
   },
 
   udpateOffset() {
-    var offset = this.em.get('Canvas').getOffset();
-    this.em.set('canvasOffset', offset);
-    this.$el.off(this.motionsEv, this.udpateOffset);
+    const em = this.em;
+    const offset = em.get('Canvas').getOffset();
+    em.set('canvasOffset', offset);
+    em.runDefault({ preserveSelected: 1 });
+    this.$el.off(motionsEv, this.udpateOffset);
   },
 
   getBody() {

src/commands/view/SelectComponent.js

@@ -555,11 +555,10 @@ module.exports = {
    * @private
    */
   cleanPrevious(model) {
-    if(model)
-      model.set({
-        status: '',
-        state: '',
-      });
+    model && model.set({
+      status: '',
+      state: '',
+    });
   },
 
   /**
@@ -573,20 +572,21 @@ module.exports = {
   run(editor) {
     this.editor = editor && editor.get('Editor');
     this.enable();
+    this.onSelect();
   },
 
-  stop() {
+  stop(editor, sender, opts = {}) {
+    const em = this.em;
     this.stopSelectComponent();
-    this.cleanPrevious(this.em.get('selectedComponent'));
+    !opts.preserveSelected && em.setSelected(null);
     this.clean();
-    this.em.set('selectedComponent', null);
     this.toggleClipboard();
     this.hideBadge();
     this.hideFixedElementOffset();
     this.canvas.getToolbarEl().style.display = 'none';
 
-    this.em.off('component:update', this.updateAttached, this);
-    this.em.off('change:canvasOffset', this.updateAttached, this);
-    this.em.off('change:selectedComponent', this.updateToolbar, this);
+    em.off('component:update', this.updateAttached, this);
+    em.off('change:canvasOffset', this.updateAttached, this);
+    em.off('change:selectedComponent', this.updateToolbar, this);
   }
 };

src/editor/model/Editor.js

@@ -570,26 +570,28 @@ module.exports = Backbone.Model.extend({
 
   /**
    * Run default command if setted
+   * @param {Object} [opts={}] Options
    * @private
    */
-  runDefault() {
+  runDefault(opts = {}) {
     var command = this.get('Commands').get(this.config.defaultCommand);
     if(!command || this.defaultRunning)
       return;
-    command.stop(this, this);
-    command.run(this, this);
+    command.stop(this, this, opts);
+    command.run(this, this, opts);
     this.defaultRunning = 1;
   },
 
   /**
    * Stop default command
+   * @param {Object} [opts={}] Options
    * @private
    */
-  stopDefault() {
+  stopDefault(opts = {}) {
     var command = this.get('Commands').get(this.config.defaultCommand);
     if(!command)
       return;
-    command.stop(this, this);
+    command.stop(this, this, opts);
     this.defaultRunning = 0;
   },