From 16675cbc378f1188a245165a1476571f1aad22b8 Mon Sep 17 00:00:00 2001 From: Ivan Usenkov Date: Thu, 26 Sep 2019 15:58:55 +0300 Subject: [PATCH 1/4] get content from RTE --- src/dom_components/view/ComponentTextView.js | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/src/dom_components/view/ComponentTextView.js b/src/dom_components/view/ComponentTextView.js index 853fffabe..e48316d9c 100644 --- a/src/dom_components/view/ComponentTextView.js +++ b/src/dom_components/view/ComponentTextView.js @@ -71,13 +71,28 @@ export default ComponentView.extend({ this.toggleEvents(); }, + /** + * get content from RTE + * @return string + */ + getContent() { + const { rte } = this; + let content = ''; + if(rte.activeRte && typeof rte.activeRte.getContent === 'function') { + content = rte.activeRte.getContent(); + } else { + content = this.getChildrenContainer().innerHTML; + } + return content; + }, + /** * Merge content from the DOM to the model */ syncContent(opts = {}) { const { model, rte, rteEnabled } = this; if (!rteEnabled && !opts.force) return; - const content = this.getChildrenContainer().innerHTML; + const content = this.getContent(); const comps = model.components(); const contentOpt = { fromDisable: 1, ...opts }; comps.length && comps.reset(null, opts); From c2ecf4be86eb042cb744dfce433ef86d5311ca62 Mon Sep 17 00:00:00 2001 From: Tom Sherman Date: Thu, 26 Sep 2019 16:51:05 +0100 Subject: [PATCH 2/4] Guard against parentNode being undefined Fixes #2294 --- src/dom_components/view/ComponentTextView.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/dom_components/view/ComponentTextView.js b/src/dom_components/view/ComponentTextView.js index 853fffabe..8a4393b27 100644 --- a/src/dom_components/view/ComponentTextView.js +++ b/src/dom_components/view/ComponentTextView.js @@ -161,8 +161,9 @@ export default ComponentView.extend({ while (el) { el.draggable = enable ? !1 : !0; + // Note: el.parentNode is sometimes null here el = el.parentNode; - el.tagName == 'BODY' && (el = 0); + el && el.tagName == 'BODY' && (el = 0); } } } From 6f566ece6527adb80da6ec651453cf12722e72f0 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Sat, 28 Sep 2019 20:59:08 +0200 Subject: [PATCH 3/4] Fix text component issue on toolbar commands execution. Closes #2294 --- src/commands/view/SelectComponent.js | 3 ++- src/dom_components/view/ComponentTextView.js | 9 +++++---- src/dom_components/view/ToolbarButtonView.js | 8 ++++++-- src/dom_components/view/ToolbarView.js | 4 ++-- 4 files changed, 15 insertions(+), 9 deletions(-) diff --git a/src/commands/view/SelectComponent.js b/src/commands/view/SelectComponent.js index d69d8b7fd..790324378 100644 --- a/src/commands/view/SelectComponent.js +++ b/src/commands/view/SelectComponent.js @@ -518,7 +518,8 @@ export default { this.toolbar = new Toolbar(toolbar); var toolbarView = new ToolbarView({ collection: this.toolbar, - editor: this.editor + editor: this.editor, + em }); toolbarEl.appendChild(toolbarView.render().el); } diff --git a/src/dom_components/view/ComponentTextView.js b/src/dom_components/view/ComponentTextView.js index 853fffabe..9a1fd14bb 100644 --- a/src/dom_components/view/ComponentTextView.js +++ b/src/dom_components/view/ComponentTextView.js @@ -45,7 +45,6 @@ export default ComponentView.extend({ } } - this.rteEnabled = 1; this.toggleEvents(1); }, @@ -67,7 +66,6 @@ export default ComponentView.extend({ this.syncContent(); } - this.rteEnabled = 0; this.toggleEvents(); }, @@ -141,14 +139,17 @@ export default ComponentView.extend({ * @param {Boolean} enable */ toggleEvents(enable) { - var method = enable ? 'on' : 'off'; + const { em } = this; const mixins = { on, off }; - this.em.setEditing(enable); + const method = enable ? 'on' : 'off'; + em.setEditing(enable); + this.rteEnabled = !!enable; // The ownerDocument is from the frame var elDocs = [this.el.ownerDocument, document]; mixins.off(elDocs, 'mousedown', this.disableEditing); mixins[method](elDocs, 'mousedown', this.disableEditing); + em[method]('toolbar:run:before', this.disableEditing); // Avoid closing edit mode on component click this.$el.off('mousedown', this.disablePropagation); diff --git a/src/dom_components/view/ToolbarButtonView.js b/src/dom_components/view/ToolbarButtonView.js index 164302e3f..21d7dd9d6 100644 --- a/src/dom_components/view/ToolbarButtonView.js +++ b/src/dom_components/view/ToolbarButtonView.js @@ -13,13 +13,17 @@ export default Backbone.View.extend({ return this.model.get('attributes'); }, - initialize(opts) { - this.editor = opts.config.editor; + initialize(opts = {}) { + const { config = {} } = opts; + this.em = config.em; + this.editor = config.editor; }, handleClick(event) { event.preventDefault(); event.stopPropagation(); + const { em } = this; + em.trigger('toolbar:run:before'); this.execCommand(event); }, diff --git a/src/dom_components/view/ToolbarView.js b/src/dom_components/view/ToolbarView.js index ff920b8b0..d786e1416 100644 --- a/src/dom_components/view/ToolbarView.js +++ b/src/dom_components/view/ToolbarView.js @@ -4,8 +4,8 @@ import ToolbarButtonView from './ToolbarButtonView'; export default DomainViews.extend({ itemView: ToolbarButtonView, - initialize(opts) { - this.config = { editor: opts.editor || '' }; + initialize(opts = {}) { + this.config = { editor: opts.editor || '', em: opts.em }; this.listenTo(this.collection, 'reset', this.render); } }); From 03d1464e0fb2fe9bf349c1535649d6c0d7df2c04 Mon Sep 17 00:00:00 2001 From: Artur Arseniev Date: Sat, 28 Sep 2019 21:55:19 +0200 Subject: [PATCH 4/4] Update getContent in text component --- src/dom_components/view/ComponentTextView.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/dom_components/view/ComponentTextView.js b/src/dom_components/view/ComponentTextView.js index 92905daa1..e4291e6cf 100644 --- a/src/dom_components/view/ComponentTextView.js +++ b/src/dom_components/view/ComponentTextView.js @@ -75,12 +75,15 @@ export default ComponentView.extend({ */ getContent() { const { rte } = this; + const { activeRte } = rte || {}; let content = ''; - if(rte.activeRte && typeof rte.activeRte.getContent === 'function') { - content = rte.activeRte.getContent(); + + if (activeRte && typeof activeRte.getContent === 'function') { + content = activeRte.getContent(); } else { content = this.getChildrenContainer().innerHTML; } + return content; },