Setup default values on property models

src/style_manager/model/Property.js

@@ -67,12 +67,22 @@ module.exports = Backbone.Model.extend({
     return result;
   },
 
+  /**
+   * Get the default value
+   * @return {string}
+   * @private
+   */
+  getDefaultValue() {
+    return this.get('defaults');
+  },
+
   /**
    * Get a complete value of the property.
    * This probably will replace the getValue when all
    * properties models will be splitted
    * @param {string} val Custom value to replace the one on the model
    * @return {string}
+   * @private
    */
   getFullValue(val) {
     const fn = this.get('functionName');

src/style_manager/model/PropertyComposite.js

@@ -18,6 +18,19 @@ module.exports = Property.extend({
     properties: [],
   }),
 
+  getDefaultValue() {
+    let value = this.get('defaults');
+
+    if (value) {
+      return value;
+    }
+
+    value = '';
+    const properties = this.get('properties');
+    properties.each((prop, index) => value += `${prop.getDefaultValue()} `);
+    return value.trim();
+  },
+
   getFullValue() {
     if (this.get('detached')) {
       return '';

src/style_manager/view/PropertyCompositeView.js

@@ -91,18 +91,6 @@ module.exports = PropertyView.extend({
     return result;
   },
 
-  /**
-   * Get default value of the property
-   * @return {string}
-   * */
-  getDefaultValue() {
-    var str = '';
-    this.props.each((prop, index) => {
-      str += prop.get('defaults') + prop.get('unit') + ' ';
-    });
-    return this.model.get('defaults') || str.replace(/ +$/,'');
-  },
-
   /**
    * Extract string from composite value
    * @param {number} index Index

src/style_manager/view/PropertyFileView.js

@@ -30,7 +30,7 @@ module.exports = PropertyView.extend({
   /** @inheritdoc */
   renderInput() {
     if (!this.$input) {
-      this.$input = $('<input>', {placeholder: this.defaultValue, type: 'text' });
+      this.$input = $('<input>', {placeholder: this.model.getDefaultValue(), type: 'text' });
     }
 
     if (!this.$preview) {
@@ -107,7 +107,7 @@ module.exports = PropertyView.extend({
    * @return void
    * */
   removeFile(...args) {
-    this.model.set('value',this.defaultValue);
+    this.model.set('value', this.model.getDefaultValue());
     PropertyView.prototype.cleanValue.apply(this, args);
     this.setPreviewView(0);
   },

src/style_manager/view/PropertyRadioView.js

@@ -55,7 +55,7 @@ module.exports = PropertyView.extend({
 
   /** @inheritdoc */
   setValue(value) {
-    var v = this.model.get('value') || this.defaultValue;
+    var v = this.model.get('value') || this.model.getDefaultValue();
 
     if(value)
       v  = value;

src/style_manager/view/PropertyStackView.js

@@ -153,7 +153,6 @@ module.exports = PropertyCompositeView.extend({
     model.set('values', valObj);
 
     model.set('value', result);
-    //return this.createValue();//this.model.getFullValue();
     return this.model.getFullValue();
   },
 

src/style_manager/view/PropertyView.js

@@ -29,23 +29,24 @@ module.exports = Backbone.View.extend({
     this.onChange = o.onChange || {};
     this.onInputRender = o.onInputRender  || {};
     this.customValue  = o.customValue  || {};
-    this.defaultValue = this.model.get('defaults');
+    const model = this.model;
-    this.property = this.model.get('property');
+    this.property = model.get('property');
     this.input = this.$input = null;
     const pfx = this.pfx;
     this.className = pfx + 'property';
     this.inputHolderId = '#' + pfx + 'input-holder';
-    this.sector = this.model.collection && this.model.collection.sector;
+    this.sector = model.collection && model.collection.sector;
 
-    if(!this.model.get('value'))
+    if (!model.get('value')) {
-      this.model.set('value', this.model.get('defaults'));
+      model.set('value', model.getDefaultValue());
+    }
 
     this.listenTo(this.propTarget, 'update', this.targetUpdated);
-    this.listenTo(this.model, 'destroy remove', this.remove);
+    this.listenTo(model, 'destroy remove', this.remove);
-    this.listenTo(this.model, 'change:value', this.valueChanged);
+    this.listenTo(model, 'change:value', this.valueChanged);
-    this.listenTo(this.model, 'targetUpdated', this.targetUpdated);
+    this.listenTo(model, 'targetUpdated', this.targetUpdated);
-    this.listenTo(this.model, 'change:visible', this.updateVisibility);
+    this.listenTo(model, 'change:visible', this.updateVisibility);
-    this.listenTo(this.model, 'change:status', this.updateStatus);
+    this.listenTo(model, 'change:status', this.updateStatus);
     this.events[`click .${pfx}clear`] = 'clear';
     this.delegateEvents();
   },
@@ -233,7 +234,7 @@ module.exports = Backbone.View.extend({
     if(targetProp)
       this.componentValue = targetProp;
     else
-      this.componentValue = this.defaultValue + (this.unit || ''); // todo model
+      this.componentValue = this.model.getDefaultValue() + (this.unit || ''); // todo model
 
     // Check if wrap inside function is required
     if (propModel.get('functionName')) {
@@ -296,7 +297,7 @@ module.exports = Backbone.View.extend({
    * @private
    */
   getDefaultValue() {
-    return this.model.get('defaults');
+    return this.model.getDefaultValue();
   },
 
   /**
@@ -455,7 +456,7 @@ module.exports = Backbone.View.extend({
    * */
   setValue(value, force) {
     var f = force === 0 ? 0 : 1;
-    var def = this.model.get('defaults');
+    var def = this.model.getDefaultValue();
     var v = this.model.get('value') || def;
     if(value || f){
       v = value;
@@ -517,7 +518,7 @@ module.exports = Backbone.View.extend({
   renderInput() {
     if(!this.$input){
       this.$input = $('<input>', {
-        placeholder: this.model.get('defaults'),
+        placeholder: this.model.getDefaultValue(),
         type: 'text'
       });
       this.$el.find(this.inputHolderId).html(this.$input);