Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-20 18:23:54 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

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

Browse source
This commit is contained in:
David Back 2018-11-12 12:20:05 -08:00
commit 0781171912
3 changed files with 52 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

58
scripts/system/html/css/edit-style.css
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;
@ -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;

12
scripts/system/html/js/draggableNumber.js
View file

@ -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);
},

24
scripts/system/html/js/entityProperties.js
View file

@ -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,
"g": elInputG.value,
"b": elInputB.value
"r": elNumberR.elInput.value,
"g": elNumberG.elInput.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 {