diff --git a/dist/grapes.js b/dist/grapes.js index 42a0b4ba2..e3d8e80f8 100644 --- a/dist/grapes.js +++ b/dist/grapes.js @@ -3747,14 +3747,11 @@ module.exports = Backbone.View.extend({ * @private */ handleChange: function handleChange() { - var em = this.em; - if (em) { - var model = this.model; - em.trigger('component:update', model); + var model = this.model; + model.emitUpdate(); - for (var prop in model.changed) { - em.trigger('component:update:' + prop, model); - } + for (var prop in model.changed) { + model.emitUpdate(prop); } }, @@ -4190,6 +4187,8 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ }, initialize: function initialize() { + var _this = this; + var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var opt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; @@ -4227,11 +4226,15 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ this.listenTo(this, 'change:script', this.scriptUpdated); this.listenTo(this, 'change:traits', this.traitsUpdated); this.listenTo(this, 'change:tagName', this.tagUpdated); + this.listenTo(this, 'change:attributes', this.attrUpdated); this.loadTraits(); this.initClasses(); this.initComponents(); this.initToolbar(); this.set('status', ''); + this.listenTo(this.get('classes'), 'add remove change', function () { + return _this.emitUpdate('classes'); + }); this.init(); }, @@ -4281,6 +4284,21 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ }, + /** + * Emit changes for each updated attribute + */ + attrUpdated: function attrUpdated() { + var _this2 = this; + + var attrPrev = _extends({}, this.previous('attributes')); + var attrCurrent = _extends({}, this.get('attributes')); + var diff = (0, _mixins.shallowDiff)(attrPrev, attrCurrent); + (0, _underscore.keys)(diff).forEach(function (pr) { + return _this2.trigger('change:attributes:' + pr); + }); + }, + + /** * Update attributes of the model * @param {Object} attrs Key value attributes @@ -4319,7 +4337,7 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ return _Styleable2.default.getStyle.call(this); }, setStyle: function setStyle() { - var _this = this; + var _this3 = this; var prop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; @@ -4334,7 +4352,7 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ this.rule = cc.setIdRule(this.getId(), prop, _extends({}, opts, { state: state })); var diff = (0, _mixins.shallowDiff)(propOrig, prop); (0, _underscore.keys)(diff).forEach(function (pr) { - return _this.trigger('change:style:' + pr); + return _this3.trigger('change:style:' + pr); }); } else { prop = _Styleable2.default.setStyle.apply(this, arguments); @@ -4350,7 +4368,7 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ */ getAttributes: function getAttributes() { var classes = []; - var attributes = this.get('attributes') || {}; + var attributes = _extends({}, this.get('attributes')); // Add classes this.get('classes').each(function (cls) { @@ -4769,7 +4787,7 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ * @private */ getScriptString: function getScriptString(script) { - var _this2 = this; + var _this4 = this; var scr = script || this.get('script'); @@ -4791,11 +4809,16 @@ module.exports = Backbone.Model.extend(_Styleable2.default).extend({ scr = scr.replace(reg, function (match, v) { // If at least one match is found I have to track this change for a // better optimization inside JS generator - _this2.scriptUpdated(); - return _this2.attributes[v]; + _this4.scriptUpdated(); + return _this4.attributes[v]; }); return scr; + }, + emitUpdate: function emitUpdate(property) { + var em = this.em; + var event = 'component:update' + (property ? ':' + property : ''); + em && em.trigger(event, this.model); } }, { @@ -4823,6 +4846,10 @@ var _underscore = __webpack_require__(1); var _mixins = __webpack_require__(2); +function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } + +var clearProp = 'data-clear-style'; + module.exports = Backbone.View.extend({ template: function template(model) { var pfx = this.pfx; @@ -4832,16 +4859,16 @@ module.exports = Backbone.View.extend({ var pfx = this.pfx; var icon = model.get('icon'); var info = model.get('info'); - return '\n \n ' + model.get('name') + '\n \n ⨯\n '; + return '\n \n ' + model.get('name') + '\n \n ⨯\n '; }, templateInput: function templateInput(model) { return '\n