diff --git a/src/style_manager/view/PropertiesView.js b/src/style_manager/view/PropertiesView.js index 1e11b0a50..7fe5a9951 100644 --- a/src/style_manager/view/PropertiesView.js +++ b/src/style_manager/view/PropertiesView.js @@ -5,11 +5,6 @@ export default Backbone.View.extend({ initialize(o) { this.config = o.config || {}; this.pfx = this.config.stylePrefix || ''; - this.target = o.target || {}; - this.propTarget = o.propTarget || {}; - this.onChange = o.onChange; - this.onInputRender = o.onInputRender || {}; - this.customValue = o.customValue || {}; this.properties = []; this.parent = o.parent; const coll = this.collection; @@ -22,40 +17,24 @@ export default Backbone.View.extend({ }, add(model, frag, opts = {}) { - const { parent } = this; + const { parent, config } = this; const appendTo = frag || this.el; - const view = new model.typeView({ - model, - name: model.get('name'), - id: this.pfx + model.get('property'), - target: this.target, - propTarget: this.propTarget, - onChange: this.onChange, - onInputRender: this.onInputRender, - config: this.config, - }); + const view = new model.typeView({ model, config }); parent && (view.parent = parent); - - if (model.get('type') != 'composite') { - view.customValue = this.customValue; - } - view.render(); const rendered = view.el; this.properties.push(view); - view.updateVisibility(); - appendAtIndex(appendTo, rendered, opts.at); }, render() { - const { $el } = this; + const { $el, pfx } = this; this.clearItems(); const fragment = document.createDocumentFragment(); this.collection.forEach(model => this.add(model, fragment)); $el.empty(); $el.append(fragment); - $el.attr('class', `${this.pfx}properties`); + $el.attr('class', `${pfx}properties`); return this; }, diff --git a/src/style_manager/view/PropertyView.js b/src/style_manager/view/PropertyView.js index 960f7bfed..e7f6c71ba 100644 --- a/src/style_manager/view/PropertyView.js +++ b/src/style_manager/view/PropertyView.js @@ -1,10 +1,8 @@ import Backbone from 'backbone'; -import { bindAll, isArray, isUndefined, debounce } from 'underscore'; -import { camelCase, isObject, find } from 'utils/mixins'; -import { includes, each } from 'underscore'; +import { bindAll, isUndefined, debounce } from 'underscore'; +import { isObject } from 'utils/mixins'; const clearProp = 'data-clear-style'; -const evStyleUp = 'component:styleUpdate'; export default Backbone.View.extend({ template() { @@ -19,13 +17,12 @@ export default Backbone.View.extend({ const { pfx, em } = this; const { parent } = model; const { icon = '', info = '' } = model.attributes; - const label = model.getLabel(); const icons = em?.getConfig('icons'); const iconClose = icons?.close || ''; return ` - ${label} + ${model.getLabel()} ${!parent ? `` : ''} `; @@ -46,23 +43,14 @@ export default Backbone.View.extend({ initialize(o = {}) { bindAll(this, '__change', '__updateStyle'); - this.config = o.config || {}; - const em = this.config.em; + const config = o.config || {}; + const { em } = config; + this.config = config; this.em = em; - this.pfx = this.config.stylePrefix || ''; - this.ppfx = this.config.pStylePrefix || ''; - this.target = o.target || {}; - this.propTarget = o.propTarget || {}; - this.onChange = o.onChange; - this.onInputRender = o.onInputRender || {}; - this.customValue = o.customValue || {}; - const model = this.model; - this.property = model.get('property'); - this.input = null; - const pfx = this.pfx; - this.inputHolderId = '#' + pfx + 'input-holder'; - this.sector = model.collection && model.collection.sector; + this.pfx = config.stylePrefix || ''; + this.ppfx = config.pStylePrefix || ''; this.__destroyFn = this.destroy ? this.destroy.bind(this) : () => {}; + const { model } = this; model.view = this; this.listenTo(model, 'destroy remove', this.remove); @@ -82,7 +70,7 @@ export default Backbone.View.extend({ remove() { Backbone.View.prototype.remove.apply(this, arguments); - ['em', 'target', 'input', '$input', 'propTarget', 'sector'].forEach(i => (this[i] = {})); + ['em', 'input', '$input', 'view'].forEach(i => (this[i] = {})); this.__destroyFn(this._getClbOpts()); }, @@ -142,15 +130,6 @@ export default Backbone.View.extend({ this.model.upValue(ev.target.value); }, - /** - * Returns value from input - * @return {string} - */ - getInputValue() { - const input = this.getInputEl(); - return input ? input.value : ''; - }, - onValueChange(m, val, opt = {}) { this.setValue(this.model.getFullValue()); this.updateStatus(); @@ -236,9 +215,8 @@ export default Backbone.View.extend({ render() { this.clearCached(); const { pfx, model, el, $el } = this; - const property = model.get('property'); - const type = model.get('type'); - const full = model.get('full'); + const name = model.getName(); + const type = model.getType(); const cls = model.get('className') || ''; const className = `${pfx}property`; // Support old integer classname @@ -251,8 +229,8 @@ export default Backbone.View.extend({ this.createdEl = create && create(this._getClbOpts()); $el.find('[data-sm-fields]').append(this.createdEl || this.templateInput(model)); - el.className = `${className} ${clsType} ${className}__${property} ${cls}`.trim(); - el.className += full ? ` ${className}--full` : ''; + el.className = `${className} ${clsType} ${className}__${name} ${cls}`.trim(); + el.className += model.isFull() ? ` ${className}--full` : ''; const onRender = this.onRender && this.onRender.bind(this); onRender && onRender();