fix property bugs / style issues

This commit is contained in:
unknown 2018-11-09 17:08:10 -08:00
parent 615ffebb2c
commit 08d9eda7d7
3 changed files with 46 additions and 35 deletions

View file

@ -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;
@ -903,6 +875,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;

View file

@ -15,6 +15,7 @@ function DraggableNumber(min, max, step) {
this.max = max;
this.step = step !== undefined ? step : 1;
this.startEvent = null;
this.inputChangeFunction = null;
this.initialize();
}
@ -41,7 +42,9 @@ DraggableNumber.prototype = {
newValue = this.max;
}
this.elInput.value = newValue;
this.inputChangeFunction();
if (this.inputChangeFunction) {
this.inputChangeFunction();
}
this.startEvent = event;
}
},
@ -53,6 +56,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);
},

View file

@ -254,7 +254,7 @@ const GROUPS = [
buttons: [ { id: "copy", label: "Copy from Skybox",
className: "black", onClick: copySkyboxURLToAmbientURL } ],
propertyID: "copyURLToAmbient",
showPropertyRule: { "skyboxMode": "enabled" },
showPropertyRule: { "ambientLightMode": "enabled" },
},
{
label: "Haze",
@ -1772,9 +1772,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);
@ -1839,7 +1844,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);
@ -1871,7 +1876,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);
@ -2055,6 +2060,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);
@ -2766,10 +2772,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 {