diff --git a/src/demo.js b/src/demo.js index c0510c37b..dab9f5785 100644 --- a/src/demo.js +++ b/src/demo.js @@ -72,6 +72,11 @@ panels: { className : 'fa fa-plus-square-o icon-add-comp', command : 'create-comp', stopDefaultCommand: 1, + },{ + id : 'move-comp', + className : 'fa fa-arrows', + command : 'move-comp', + stopDefaultCommand: 1, },{ id: 'image-comp', className: 'fa fa-picture-o', diff --git a/src/rich_text_editor/main.js b/src/rich_text_editor/main.js index c5a3f9e44..6d513c211 100644 --- a/src/rich_text_editor/main.js +++ b/src/rich_text_editor/main.js @@ -21,20 +21,34 @@ define(function(require) { return { /** + * Triggered when the offset of the editro is changed + * @private + */ + udpatePosition: function(){ + if(!this.lastEl || !c.em) + return; + var u = 'px'; + var eOffset = c.em.get('canvasOffset'); + var cvsView = c.em.get('Canvas').CanvasView; + var dims = cvsView.getElementPos(this.lastEl); + var toolS = toolbar.el.style; + var toolH = toolbar.$el.outerHeight(); + toolS.top = (dims.top - toolH) + u; + toolS.left = (dims.left + eOffset.left) + u; + }, + + /** * Bind rich text editor to element * @param {View} view * */ attach: function(view){ view.$el.wysiwyg({}).focus(); + this.lastEl = view.el; if(c.em){ - var u = 'px'; - var cvsView = c.em.get('Canvas').CanvasView; - var dims = cvsView.getElementPos(view.el); - var toolEl = toolbar.el; - var toolS = toolbar.el.style; - toolS.top = (dims.top - toolbar.$el.outerHeight()) + u; - toolS.left = dims.left + u; + this.udpatePosition(); + c.em.off('change:canvasOffset', this.udpatePosition, this); + c.em.on('change:canvasOffset', this.udpatePosition, this); } this.show(); //Avoid closing edit mode clicking on toolbar