2 files changed, 31 insertions, 2 deletions

diff --git a/js/panels/components-panel.reel/components-panel.js b/js/panels/components-panel.reel/components-panel.js
index 96713691..acbf702f 100755
--- a/js/panels/components-panel.reel/components-panel.js
+++ b/js/panels/components-panel.reel/components-panel.js
@@ -230,9 +230,9 @@ exports.ComponentsPanel = Montage.create(Component, {
                 case "select":
                     return "dropdown";
                 case "number":
-                    return "hottext";
+                    return "ht";
                 default:
-                    alert("Conversion not implemented for ", type);
+                    alert("Conversion not implemented for " + type);
             }
         }
     },
diff --git a/js/panels/properties.reel/sections/custom.reel/custom.js b/js/panels/properties.reel/sections/custom.reel/custom.js
index ac316907..876fe110 100755
--- a/js/panels/properties.reel/sections/custom.reel/custom.js
+++ b/js/panels/properties.reel/sections/custom.reel/custom.js
@@ -15,6 +15,7 @@ var ColorSelect = require("js/panels/properties.reel/sections/custom-rows/color-
 
 // Components Needed to make this work
 var Hottext = require("js/components/hottextunit.reel").HotTextUnit;
+var HT = require("js/components/hottext.reel").HotText;
 var Dropdown = require("js/components/combobox.reel").Combobox;
 var TextField = require("js/components/textfield.reel").TextField;
 var FileInput = require("js/components/ui/file-input.reel").FileInput;
@@ -168,6 +169,7 @@ exports.CustomSection = Montage.create(Component, {
         value: function(fields) {
             switch(fields.type) {
                 case "hottext"  : return this.createHottext(fields);
+                case "ht"  : return this.createHT(fields);
                 case "dropdown" : return this.createDropdown(fields);
                 case "textbox"  : return this.createTextField(fields);
                 case "file"     : return this.createFileInput(fields);
@@ -178,6 +180,33 @@ exports.CustomSection = Montage.create(Component, {
         }
     },
 
+    createHT: {
+        value: function(aField) {
+
+            // Generate Hottext
+            var obj = HT.create();
+
+            // Set Values for HottextRow
+            if (aField.id)          obj.id = aField.id;
+            if (aField.value)       obj.value = aField.value;
+            if (aField.min)         obj._minValue = aField.min;
+            if (aField.max)         obj._maxValue = aField.max;
+            if (aField.prop)        obj.prop = aField.prop;
+
+            //Initiate onChange Events
+            obj.addEventListener("change", this, false);
+            obj.addEventListener("changing", this, false);
+
+            //Bind object value to controls list so it can be manipulated
+            Object.defineBinding(this.controls, aField.id, {
+              boundObject: obj,
+              boundObjectPropertyPath: "value"
+            });
+
+            return obj;
+        }
+    },
+
     //Breaking Up Switch Case Statement to functions to return a row
     createHottext: {
         value: function(aField) {