CSS Style Component - Moved unit identification to local change handler instead of delegate

1 files changed, 12 insertions, 1 deletions

diff --git a/js/panels/css-panel/css-style.reel/css-style.js b/js/panels/css-panel/css-style.reel/css-style.js
index dd84c7e9..331faa2f 100644
--- a/js/panels/css-panel/css-style.reel/css-style.js
+++ b/js/panels/css-panel/css-style.reel/css-style.js
@@ -15,6 +15,7 @@ exports.CssStyle = Montage.create(Component, {
     invalidStyleClass : { value: "style-item-invalid" },
     emptyStyleClass   : { value: "empty-css-style" },
     source            : { value: null },
+    units             : { value: null },
 
     propertyText : {
         value: "property",
@@ -292,7 +293,17 @@ exports.CssStyle = Montage.create(Component, {
         value: function(e) {
             var property    = this.propertyField.value,
                 value       = this.valueField.value,
-                rule        = this.getRule();
+                rule        = this.getRule(),
+                units;
+
+            ///// Auto-fill units if not provided and units
+            ///// not previously stored
+            units = this.getUnits(value);
+            if(this.units && units === null && parseInt(value)) {
+                value += this.units;
+            } else if (value !== '0') {
+                this.units = units;
+            }
 
             this.valueText = value;