Emit event on frame resize

src/canvas/model/Frame.js

@@ -20,6 +20,7 @@ export default Backbone.Model.extend({
   initialize(props, opts = {}) {
     const { root, styles, components } = this.attributes;
     this.set('head', []);
+    this.em = opts.em;
     const modOpts = {
       em: opts.em,
       config: opts.em.get('DomComponents').getConfig(),
@@ -110,5 +111,9 @@ export default Backbone.Model.extend({
 
   removeScript(src) {
     this.removeHeadByAttr('src', src, 'script');
+  },
+
+  _emitResized(data = {}) {
+    this.em.trigger('frame:resized', { frame: this, ...data });
   }
 });

src/canvas/view/FrameView.js

@@ -20,7 +20,13 @@ export default Backbone.View.extend({
   },
 
   initialize(o) {
-    bindAll(this, 'updateClientY', 'stopAutoscroll', 'autoscroll');
+    bindAll(
+      this,
+      'updateClientY',
+      'stopAutoscroll',
+      'autoscroll',
+      '_emitResize'
+    );
     const { model, el } = this;
     this.config = {
       ...(o.config || {}),
@@ -136,6 +142,7 @@ export default Backbone.View.extend({
 
   remove() {
     const { root, model } = this;
+    this._toggleEffects();
     Backbone.View.prototype.remove.apply(this, arguments);
     root.remove();
     model.remove();
@@ -248,6 +255,7 @@ export default Backbone.View.extend({
     const doc = this.getDoc();
     const head = this.getHead();
     const body = this.getBody();
+    const win = this.getWindow();
     const conf = em.get('Config');
     const extStyles = [];
 
@@ -385,6 +393,16 @@ export default Backbone.View.extend({
       })
     );
 
+    this._toggleEffects(1);
     model.trigger('loaded');
+  },
+
+  _toggleEffects(enable) {
+    const method = enable ? on : off;
+    method(this.getWindow(), 'resize', this._emitResize);
+  },
+
+  _emitResize() {
+    this.model._emitResized();
   }
 });

src/canvas/view/FrameWrapView.js

@@ -81,7 +81,7 @@ export default Backbone.View.extend({
     const { em, $el, frame } = this;
     em.runDefault({ preserveSelected: 1 });
     $el.removeClass(this.classAnim);
-    em.trigger('frame:resized', { frame });
+    frame._emitResized();
   }),
 
   updatePos(md) {

src/commands/view/SelectComponent.js

@@ -104,6 +104,7 @@ export default {
   },
 
   onFrameResized() {
+    console.log('onFrameResized');
     this.updateToolsLocal({}); // clear last cached component
   },