Merge branch 'newPropertySliders' of github.com:dback2/hifi into newPropertySliders

scripts/system/html/css/edit-style.css

@@ -309,34 +309,6 @@ input[type=number].hover-down::-webkit-inner-spin-button:after {
     color: #ffffff;
 }
 
-.draggable-number {
-    position: relative;
-    right: 10px;
-}
-.draggable-number span {
-    position: relative;
-    top: -2px;
-    display: inline-block;
-    font-family: hifi-glyphs;
-    font-size: 20px;
-    z-index: 2;
-}
-.draggable-number.left-arrow {
-    left: 18px;
-    transform: rotate(180deg);
-}
-.draggable-number.right-arrow {
-    right: 18px;
-}
-.draggable-number input {
-}
-.draggable-number input::selection {
-}
-.draggable-number input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-    visibility: hidden;
-}
-
 input[type=range] {
     -webkit-appearance: none;
     background: #2e2e2e;
@@ -881,6 +853,9 @@ div.refresh input[type="button"] {
     border-color: #afafaf;
 }
 
+.colpick {
+    z-index: 3;
+}
 .colpick[disabled="disabled"] {
     display: none !important;
 }
@@ -903,6 +878,33 @@ div.refresh input[type="button"] {
     clear: both;
 }
 
+.draggable-number {
+    position: relative;
+    right: 10px;
+}
+.draggable-number span {
+    position: relative;
+    top: -2px;
+    display: inline-block;
+    font-family: hifi-glyphs;
+    font-size: 20px;
+    z-index: 2;
+}
+.draggable-number.left-arrow {
+    left: 17px;
+    transform: rotate(180deg);
+}
+.draggable-number.right-arrow {
+    right: 17px;
+}
+.draggable-number.fstuple span {
+    top: 0;
+}
+.draggable-number input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    visibility: hidden;
+}
+
 .row .property {
     width: auto;
     display: inline-block;

scripts/system/html/js/draggableNumber.js

@@ -6,15 +6,12 @@
 //  Distributed under the Apache License, Version 2.0.
 //  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
 
-debugPrint = function (message) {
-    console.log(message);
-};
-
 function DraggableNumber(min, max, step) {
     this.min = min;
     this.max = max;
     this.step = step !== undefined ? step : 1;
     this.startEvent = null;
+    this.inputChangeFunction = null;
     this.initialize();
 }
 
@@ -41,7 +38,9 @@ DraggableNumber.prototype = {
                 newValue = this.max;
             }
             this.elInput.value = newValue;
-            this.inputChangeFunction();
+            if (this.inputChangeFunction) {
+                this.inputChangeFunction();
+            }
             this.startEvent = event;
         }
     },
@@ -53,6 +52,9 @@ DraggableNumber.prototype = {
     },
     
     setInputChangeFunction: function(inputChangeFunction) {
+        if (this.inputChangeFunction) {
+            this.elInput.removeEventListener('change', this.inputChangeFunction);
+        }
         this.inputChangeFunction = inputChangeFunction.bind(this.elInput);
         this.elInput.addEventListener('change', this.inputChangeFunction);
     },

scripts/system/html/js/entityProperties.js

@@ -260,7 +260,7 @@ const GROUPS = [
                 buttons: [ { id: "copy", label: "Copy from Skybox", 
                              className: "black", onClick: copySkyboxURLToAmbientURL } ],
                 propertyID: "copyURLToAmbient",
-                showPropertyRule: { "skyboxMode": "enabled" },
+                showPropertyRule: { "ambientLightMode": "enabled" },
             },
             {
                 label: "Haze",
@@ -1827,9 +1827,14 @@ function createNumberProperty(property, elProperty) {
     let elementID = property.elementID;
     let propertyData = property.data;
     
-    elProperty.className = "property draggable-number";
+    elProperty.className = "draggable-number";
     
     let elDraggableNumber = new DraggableNumber(propertyData.min, propertyData.max, propertyData.step);
+    
+    let defaultValue = propertyData.defaultValue;   
+    if (defaultValue !== undefined) {   
+        elDraggableNumber.elInput.value = defaultValue; 
+    }
 
     let inputChangeFunction = createEmitNumberPropertyUpdateFunction(propertyName, propertyData.multiplier, propertyData.decimals, property.isParticleProperty);
     elDraggableNumber.setInputChangeFunction(inputChangeFunction);
@@ -1894,7 +1899,7 @@ function createVec2Property(property, elProperty) {
     let elNumberY = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Y_INPUT], 
                                            propertyData.min, propertyData.max, propertyData.step);
     
-    let inputChangeFunction = createEmitVec3PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput,
+    let inputChangeFunction = createEmitVec2PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput,
                                                                    propertyData.multiplier, property.isParticleProperty);
     elNumberX.setInputChangeFunction(inputChangeFunction);
     elNumberY.setInputChangeFunction(inputChangeFunction);
@@ -1926,7 +1931,7 @@ function createColorProperty(property, elProperty) {
     let elNumberB = createTupleNumberInput(elTuple, elementID, "blue", COLOR_MIN, COLOR_MAX, COLOR_STEP);
     
     let inputChangeFunction = createEmitColorPropertyUpdateFunction(propertyName, elNumberR.elInput, elNumberG.elInput,
-                                                                    elNumberB.elInput, property.isParticleProperty);    
+                                                                    elNumberB.elInput, property.isParticleProperty);
     elNumberR.setInputChangeFunction(inputChangeFunction);
     elNumberG.setInputChangeFunction(inputChangeFunction);
     elNumberB.setInputChangeFunction(inputChangeFunction);
@@ -1942,9 +1947,9 @@ function createColorProperty(property, elProperty) {
             // The original color preview within the picker needs to be updated on show because
             // prior to the picker being shown we don't have access to the selections' starting color.
             colorPickers[colorPickerID].colpickSetColor({
-                "r": elInputR.value,
+                "r": elNumberR.elInput.value,
-                "g": elInputG.value,
+                "g": elNumberG.elInput.value,
-                "b": elInputB.value
+                "b": elNumberB.elInput.value
             });
         },
         onHide: function(colpick) {
@@ -2110,6 +2115,7 @@ function createTupleNumberInput(elTuple, propertyElementID, subLabel, min, max,
     
     let elDraggableNumber = new DraggableNumber(min, max, step);
     elDraggableNumber.elInput.setAttribute("id", elementID);
+    elDraggableNumber.elDiv.className += " fstuple";
     elDraggableNumber.elDiv.insertBefore(elLabel, elDraggableNumber.elLeftArrow);
     elTuple.appendChild(elDraggableNumber.elDiv);
     
@@ -2821,10 +2827,10 @@ function loaded() {
                     if (propertyData.indentedLabel || propertyData.showPropertyRule !== undefined) {
                         let elSpan = document.createElement('span');
                         elSpan.className = 'indented';
-                        elSpan.innerText = propertyData.label;
+                        elSpan.innerText = propertyData.label !== undefined ? propertyData.label : "";
                         elLabel.appendChild(elSpan);
                     } else {
-                        elLabel.innerText = propertyData.label;
+                        elLabel.innerText = propertyData.label !== undefined ? propertyData.label : "";
                     }
                     elContainer.appendChild(elLabel);
                 } else {