Fix updating the file property

src/style_manager/view/PropertyFileView.js

@@ -82,7 +82,7 @@ module.exports = PropertyView.extend({
    * @return void
    * */
   spreadUrl(url) {
-    this.setValue(url);
+    this.model.set('value', url);
     this.setPreviewView(1);
   },
 
@@ -90,9 +90,9 @@ module.exports = PropertyView.extend({
    * Shows file preview
    * @param string Value
    * */
-  setPreview(url) {
+  setPreview(value) {
-    if(this.$preview)
+    const preview = this.$preview;
-      this.$preview.css('background-image', "url(" + url + ")");
+    preview && preview.css('background-image', value);
   },
 
   /** @inheritdoc */
@@ -132,7 +132,6 @@ module.exports = PropertyView.extend({
         onSelect(target) {
           that.modal.close();
           that.spreadUrl(target.get('src'));
-          that.valueChanged(e);
         }
       });
     }

src/style_manager/view/PropertyStackView.js

@@ -79,26 +79,30 @@ module.exports = PropertyCompositeView.extend({
 
   /** @inheritDoc */
   getPropsConfig(opts) {
-    var that = this;
+    const model = this.model;
+    const detached = model.get('detached');
     var result = PropertyCompositeView.prototype.getPropsConfig.apply(this, arguments);
 
     result.onChange = (el, view, opt) => {
-      var model = view.model;
+      const subModel = view.model;
-      var result = that.build();
+      const subProperty = subModel.get('property');
+      this.build();
 
-      if (that.model.get('detached')) {
+      if (detached) {
         var propVal = '';
-        var index = model.collection.indexOf(model);
+        var index = subModel.collection.indexOf(subModel);
 
-        that.getLayers().each(layer => {
+        this.getLayers().each(layer => {
-          var val = layer.get('values')[model.get('property')];
+          var val = layer.get('values')[subProperty];
-          if(val)
+          if (val) {
             propVal += (propVal ? ',' : '') + val;
+          }
         });
 
+        console.log(`Property ${subProperty}, value to set: ${propVal}`);
         view.updateTargetStyle(propVal, null, opt);
       } else {
-        that.model.set('value', result, opt);
+        model.set('value', model.getFullValue(), opt);
       }
     };
 
@@ -145,25 +149,28 @@ module.exports = PropertyCompositeView.extend({
    * @private
    * */
   build(...args) {
-    var stackIndex = this.model.get('stackIndex');
+    let value = '';
-    if(stackIndex === null)
+    let values = {};
-      return;
+    const model = this.model;
-    let result = '';
+    const stackIndex = model.get('stackIndex');
-    this.model.get('properties').each(prop => result += `${prop.getFullValue()} `);
+    const properties = model.get('properties');
-    var model = this.getLayers().at(stackIndex);
+
-    if(!model)
+    if (stackIndex === null) {
       return;
+    }
 
     // Store properties values inside layer, in this way it's more reliable
     // to fetch them later
-    var valObj = {};
+    console.log(`START Property ${model.get('property')}`);
-    this.model.get('properties').each(prop => {
+    properties.each(prop => {
-      valObj[prop.get('property')] = prop.getFullValue();
+      const propValue = prop.getFullValue();
+      values[prop.get('property')] = propValue;
+      value += `${propValue} `;
     });
-    model.set('values', valObj);
 
-    model.set('value', result);
+    const layerModel = this.getLayers().at(stackIndex);
-    return this.model.getFullValue();
+    layerModel && layerModel.set({values, value});
+    console.log(`END Property ${model.get('property')} value: ${value} values: `, values);
   },
 
   /**

src/style_manager/view/PropertyView.js

@@ -296,9 +296,8 @@ module.exports = Backbone.View.extend({
     const target = this.getTarget();
     const onChange = this.onChange;
 
-    if (this.$input) {
+    console.log('BEFORE valueChanged ', model.get('property'), value, 'this value: ', model.get('value'));
-      this.setValue(value);
+    this.setValue(value);
-    }
 
     if (!target) {
       return;
@@ -389,15 +388,19 @@ module.exports = Backbone.View.extend({
    * @param   {Boolean}  force
    * */
   setValue(value, force) {
-    var f = force === 0 ? 0 : 1;
+    const model = this.model;
-    var def = this.model.getDefaultValue();
+    const f = force === 0 ? 0 : 1;
-    var v = this.model.get('value') || def;
+    const def = model.getDefaultValue();
-    if(value || f){
+    let v = model.get('value') || def;
+
+    if (value || f) {
       v = value;
     }
-    if(this.$input)
+
-      this.$input.val(v);
+    const input = this.$input;
-    this.model.set({value: v}, {silent: true});
+    input && input.val(v);
+
+    //this.model.set({value: v}, {silent: true});
   },
 
   updateVisibility() {