diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js index 97919a1b3..91853e57e 100644 --- a/src/dom_components/model/Component.js +++ b/src/dom_components/model/Component.js @@ -195,7 +195,6 @@ const Component = Backbone.Model.extend(Styleable).extend( this.on('change:toolbar', this.__emitUpdateTlb); this.set('status', ''); this.views = []; - this.__isSymbol() && this.__initSymb(); // Register global updates for collection properties ['classes', 'traits', 'components'].forEach(name => { @@ -207,6 +206,7 @@ const Component = Backbone.Model.extend(Styleable).extend( if (!opt.temporary) { this.init(); + this.__isSymbol() && this.__initSymb(); em && em.trigger('component:create', this); } }, @@ -382,7 +382,6 @@ const Component = Backbone.Model.extend(Styleable).extend( */ attrUpdated(m, v, opts = {}) { const attrs = this.get('attributes'); - // Handle classes const classes = attrs.class; classes && this.setClass(classes); @@ -422,10 +421,13 @@ const Component = Backbone.Model.extend(Styleable).extend( * component.addAttributes({ 'data-key': 'value' }); */ addAttributes(attrs, opts = {}) { - const newAttrs = { ...this.getAttributes(), ...attrs }; - this.setAttributes(newAttrs, opts); - - return this; + return this.setAttributes( + { + ...this.getAttributes({ noClass: 1 }), + ...attrs + }, + opts + ); }, /** @@ -482,7 +484,7 @@ const Component = Backbone.Model.extend(Styleable).extend( * Return all component's attributes * @return {Object} */ - getAttributes() { + getAttributes(opts = {}) { const { em } = this; const classes = []; const attributes = { ...this.get('attributes') }; @@ -490,10 +492,12 @@ const Component = Backbone.Model.extend(Styleable).extend( const id = this.getId(); // Add classes - this.get('classes').forEach(cls => - classes.push(isString(cls) ? cls : cls.get('name')) - ); - classes.length && (attributes.class = classes.join(' ')); + if (!opts.noClass) { + this.get('classes').forEach(cls => + classes.push(isString(cls) ? cls : cls.get('name')) + ); + classes.length && (attributes.class = classes.join(' ')); + } // Check if we need an ID on the component if (!has(attributes, 'id')) { diff --git a/src/dom_components/model/ComponentImage.js b/src/dom_components/model/ComponentImage.js index 4d4702792..b5929a507 100644 --- a/src/dom_components/model/ComponentImage.js +++ b/src/dom_components/model/ComponentImage.js @@ -33,8 +33,8 @@ export default Component.extend( initialize(o, opt) { Component.prototype.initialize.apply(this, arguments); - var attr = this.get('attributes'); - if (attr.src) this.set('src', attr.src); + const { src } = this.get('attributes'); + if (src) this.set('src', src, { silent: 1 }); }, initToolbar(...args) { diff --git a/src/dom_components/view/ComponentImageView.js b/src/dom_components/view/ComponentImageView.js index 9b1bb51e7..a427cb757 100644 --- a/src/dom_components/view/ComponentImageView.js +++ b/src/dom_components/view/ComponentImageView.js @@ -13,13 +13,9 @@ export default ComponentView.extend({ }, initialize(o) { - const model = this.model; ComponentView.prototype.initialize.apply(this, arguments); - this.listenTo(model, 'change:src', this.updateSrc); + this.listenTo(this.model, 'change:src', this.updateSrc); this.classEmpty = `${this.ppfx}plh-image`; - const config = this.config; - config.modal && (this.modal = config.modal); - config.am && (this.am = config.am); this.fetchFile(); },