Refactored Property

src/style_manager/model/Property.js

@@ -18,7 +18,28 @@ define(['backbone'],
 				properties: [],
 				layers: [],
 				list: [],
-			}
+			},
+
+			/**
+			 * Return value
+			 * @return {string} Value
+			 * @private
+			 */
+			getValue: function(){
+				var result = '';
+				var type = this.get('type');
+
+				switch(type){
+					case 'integer':
+						result = this.get('value') + this.get('unit');
+						break;
+					default:
+						result = this.get('value');
+						break;
+				}
+
+				return result;
+			},
 
     });
 	});

src/style_manager/view/PropertyCompositeView.js

@@ -120,8 +120,7 @@ define(['backbone','./PropertyView', 'text!./../templates/propertyComposite.html
 		build: function(selectedEl, propertyModel){
 			var result 	= '';
 			this.model.get('properties').each(function(prop){
-				//TODO v = prop.getValueForTarget(); -> functionName inside?!?
-				var v		= (prop.get('value') || prop.get('defaults')) + prop.get('unit'),
+				var v		= prop.getValue();
 					func	= prop.get('functionName');
 				if(func)
 					v =  func + '(' + v + ')';

src/style_manager/view/PropertyView.js

@@ -18,7 +18,6 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
 			this.onChange = o.onChange || {};
 			this.onInputRender = o.onInputRender	|| {};
 			this.customValue	= o.customValue	|| {};
-			this.func = this.model.get('functionName');
 			this.defaultValue = this.model.get('defaults');
 			this.property = this.model.get('property');
 			this.input = this.$input = null;
@@ -122,7 +121,7 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
 		 * @return {string}
 		 */
 		getValueForTarget: function(){
-			return this.model.get('value');
+			return this.model.getValue();
 		},
 
 		/**
@@ -155,8 +154,9 @@ define(['backbone', 'text!./../templates/propertyLabel.html', 'text!./../templat
 
 			value = this.getValueForTarget();
 
-			if(this.func)
-				value =  this.func + '(' + value + ')';
+			var func = this.model.get('functionName');
+			if(func)
+				value =  func + '(' + value + ')';
 
 			if( !this.model.get('doNotStyle') ){
 				var componentCss = _.clone( this.getTarget().get('style') );

test/specs/style_manager/view/PropertyView.js

@@ -90,6 +90,16 @@ define([path + 'PropertyView', 'StyleManager/model/Property', 'DomComponents/mod
               compStyle.should.deep.equal(assertStyle);
             });
 
+            it('Update target on value change with functionName', function() {
+              view.selectedComponent = component;
+              view.model.set('functionName', 'testfunc');
+              view.model.set('value', propValue);
+              var compStyle = view.selectedComponent.get('style');
+              var assertStyle = {};
+              assertStyle[propName] = 'testfunc(' + propValue + ')';
+              compStyle.should.deep.equal(assertStyle);
+            });
+
             it('Clean target from the property if its value is empty', function() {
               view.selectedComponent = component;
               view.model.set('value', propValue);