diff --git a/src/css_composer/index.js b/src/css_composer/index.js index 565b0f5cc..c4d9c27ae 100644 --- a/src/css_composer/index.js +++ b/src/css_composer/index.js @@ -113,14 +113,14 @@ export default () => { um && um.add(rules); em.stopListening(rules, ev, this.handleChange); em.listenTo(rules, ev, this.handleChange); - rules.each(rule => this.handleChange(rule, { avoidStore: 1 })); + rules.each(rule => this.handleChange(rule, null, { avoidStore: 1 })); }, /** * Handle rule changes * @private */ - handleChange(model, opts = {}) { + handleChange(model, val, opts = {}) { const ev = 'change:style'; const um = em.get('UndoManager'); um && um.add(model); @@ -183,7 +183,8 @@ export default () => { * @param {Array} selectors Array of selectors * @param {String} state Css rule state * @param {String} width For which device this style is oriented - * @param {Object} opts Other options for the rule + * @param {Object} props Other props for the rule + * @param {Object} opts Options for the add of new rule * @return {Model} * @example * var sm = editor.SelectorManager; @@ -195,7 +196,7 @@ export default () => { * color: '#fff', * }); * */ - add(selectors, state, width, opts = {}) { + add(selectors, state, width, opts = {}, addOpts = {}) { var s = state || ''; var w = width || ''; var opt = { ...opts }; @@ -211,8 +212,8 @@ export default () => { opt.mediaText = w; opt.selectors = []; rule = new CssRule(opt, c); - rule.get('selectors').add(selectors); - rules.add(rule); + rule.get('selectors').add(selectors, addOpts); + rules.add(rule, addOpts); return rule; } }, @@ -406,12 +407,13 @@ export default () => { * // #myid:hover { color: blue } */ setIdRule(name, style = {}, opts = {}) { + const { addOpts = {} } = opts; const state = opts.state || ''; const media = opts.mediaText || em.getCurrentMedia(); const sm = em.get('SelectorManager'); - const selector = sm.add({ name, type: Selector.TYPE_ID }); - const rule = this.add(selector, state, media); - rule.setStyle(style, opts); + const selector = sm.add({ name, type: Selector.TYPE_ID }, addOpts); + const rule = this.add(selector, state, media, {}, addOpts); + rule.setStyle(style, { ...opts, ...addOpts }); return rule; }, diff --git a/src/editor/model/Editor.js b/src/editor/model/Editor.js index a037ea58d..ffdda1a0a 100644 --- a/src/editor/model/Editor.js +++ b/src/editor/model/Editor.js @@ -247,15 +247,13 @@ export default Backbone.Model.extend({ * */ handleUpdates(model, val, opt = {}) { // Component has been added temporarily - do not update storage or record changes - if (opt.temporary) { + if (opt.temporary || opt.noCount || opt.avoidStore) { return; } - timedInterval && clearInterval(timedInterval); + timedInterval && clearTimeout(timedInterval); timedInterval = setTimeout(() => { - if (!opt.avoidStore) { - this.set('changesCount', this.get('changesCount') + 1, opt); - } + this.set('changesCount', this.get('changesCount') + 1, opt); }, 0); }, diff --git a/src/style_manager/index.js b/src/style_manager/index.js index e6bc46dde..f0e5f9b1d 100644 --- a/src/style_manager/index.js +++ b/src/style_manager/index.js @@ -279,7 +279,8 @@ export default () => { const valid = classes.getStyleable(); const hasClasses = valid.length; const useClasses = !smConf.componentFirst || options.useClasses; - const opts = { state }; + const addOpts = { noCount: 1 }; + const opts = { state, addOpts }; let rule; // I stop undo manager here as after adding the CSSRule (generally after @@ -293,7 +294,7 @@ export default () => { rule = cssC.get(valid, state, deviceW); if (!rule && !skipAdd) { - rule = cssC.add(valid, state, deviceW); + rule = cssC.add(valid, state, deviceW, {}, addOpts); } } else if (config.avoidInlineStyle) { rule = cssC.getIdRule(id, opts);