Mirrors/overte-lubosz
3
0
Fork 0
mirror of https://github.com/lubosz/overte.git synced 2025-08-08 03:08:00 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

restructure draggable numbers to be more like blender

Browse source
This commit is contained in:
David Back 2018-11-13 16:04:08 -08:00
parent 91db81cd94
commit 8db81d9ce6
3 changed files with 302 additions and 119 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
scripts/system/html/css/edit-style.css
View file

@ -880,30 +880,76 @@ div.refresh input[type="button"] {
.draggable-number { .draggable-number {
position: relative; position: relative;
right: 10px; }
.draggable-number div {
height: 28px;
width: 92px;
}
.draggable-number.text {
display: inline-block;
color: #afafaf;
background-color: #252525;
font-family: FiraSans-SemiBold;
font-size: 15px;
margin: 0;
padding: 0 16px;
height: 28px;
width: 100%;
line-height: 2;
}
.draggable-number.text:hover {
cursor: ew-resize;
} }
.draggable-number span { .draggable-number span {
position: relative; position: absolute;
top: -2px;
display: inline-block; display: inline-block;
font-family: hifi-glyphs; font-family: HiFi-Glyphs;
font-size: 20px; font-size: 20px;
z-index: 2; z-index: 2;
} }
.draggable-number span:hover {
cursor: default;
}
.draggable-number.left-arrow { .draggable-number.left-arrow {
left: 17px; top: -5px;
right: 106px;
transform: rotate(180deg); transform: rotate(180deg);
} }
.draggable-number.right-arrow { .draggable-number.right-arrow {
right: 17px; top: -5px;
left: 106px;
} }
.draggable-number.fstuple span { .draggable-number input[type=number] {
position: absolute;
right: 0;
width: 100%;
}
.draggable-number input[type=button] {
position: absolute;
top: 0; top: 0;
} }
.draggable-number input::-webkit-inner-spin-button { .draggable-number input::-webkit-inner-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
visibility: hidden; visibility: hidden;
} }
.draggable-number.fstuple {
height: 28px;
width: 124px;
left: 12px;
}
.draggable-number.fstuple + .draggable-number.fstuple {
padding-left: 28px;
}
.draggable-number.fstuple input {
right: -10px;
}
.draggable-number.fstuple .sublabel {
position: absolute;
top: 0;
left: -16px;
font-family: FiraSans-SemiBold;
font-size: 15px;
}
.row .property { .row .property {
width: auto; width: auto;
@ -921,10 +967,10 @@ div.refresh input[type="button"] {
.property.texture { .property.texture {
display: block; display: block;
} }
.property.texture input{ .property.texture input {
margin: 0.4rem 0; margin: 0.4rem 0;
} }
.texture-image img{ .texture-image img {
padding: 0; padding: 0;
margin: 0; margin: 0;
width: 100%; width: 100%;
@ -1466,12 +1512,12 @@ th#entity-hasScript {
} }
input#property-scale-button-rescale { input#property-scale-button-rescale {
margin-top: 6px;
min-width: 50px; min-width: 50px;
left: 152px;
} }
input#property-scale-button-reset { input#property-scale-button-reset {
margin-top: 6px;
margin-right: 0; margin-right: 0;
left: 250px;
} }
#property-userData-button-edit, #property-userData-button-edit,
@ -1661,6 +1707,10 @@ input.number-slider {
flex-flow: column; flex-flow: column;
} }
.flex-column + .flex-column {
padding-left: 50px;
}
.flex-center { .flex-center {
align-items: center; align-items: center;
} }

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

@ -6,67 +6,125 @@
// Distributed under the Apache License, Version 2.0. // Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html // See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
const DELTA_X_FOCUS_THRESHOLD = 2;
function DraggableNumber(min, max, step) { function DraggableNumber(min, max, step) {
this.min = min; this.min = min;
this.max = max; this.max = max;
this.step = step !== undefined ? step : 1; this.step = step !== undefined ? step : 1;
this.startEvent = null; this.initialMouseEvent = null;
this.inputChangeFunction = null; this.lastMouseEvent = null;
this.valueChangeFunction = null;
this.initialize(); this.initialize();
} }
DraggableNumber.prototype = { DraggableNumber.prototype = {
onMouseDown: function(event) {
let that = this.draggableNumber;
that.mouseDown(event);
},
mouseDown: function(event) { mouseDown: function(event) {
this.startEvent = event; if (event.target === this.elText) {
document.addEventListener("mousemove", this.onMouseMove); this.initialMouseEvent = event;
document.addEventListener("mouseup", this.onMouseUp); this.lastMouseEvent = event;
document.addEventListener("mousemove", this.onMouseMove);
document.addEventListener("mouseup", this.onMouseUp);
}
}, },
mouseMove: function(event, that) { mouseMove: function(event) {
if (this.startEvent) { if (this.lastMouseEvent) {
let dx = event.clientX - this.startEvent.clientX; let dx = event.clientX - this.lastMouseEvent.clientX;
let valueChange = dx * this.step; let inputChanged = dx !== 0;
let newValue = parseFloat(this.elInput.value) + valueChange; if (inputChanged) {
if (this.min !== undefined && newValue < this.min) { while (dx !== 0) {
newValue = this.min; if (dx > 0) {
} else if (this.max !== undefined && newValue > this.max) { this.stepUp();
newValue = this.max; --dx;
} } else {
this.elInput.value = newValue; this.stepDown();
if (this.inputChangeFunction) { ++dx;
this.inputChangeFunction(); }
} }
this.startEvent = event; if (this.valueChangeFunction) {
this.valueChangeFunction();
}
}
this.lastMouseEvent = event;
} }
}, },
mouseUp: function(event) { mouseUp: function(event) {
this.startEvent = null; if (this.initialMouseEvent) {
document.removeEventListener("mousemove", this.onMouseMove); let dx = event.clientX - this.initialMouseEvent.clientX;
document.removeEventListener("mouseup", this.onMouseUp); if (dx <= DELTA_X_FOCUS_THRESHOLD) {
this.elInput.style.visibility = "visible";
this.elText.style.visibility = "hidden";
}
this.initialMouseEvent = null;
this.lastMouseEvent = null;
document.removeEventListener("mousemove", this.onMouseMove);
document.removeEventListener("mouseup", this.onMouseUp);
}
}, },
setInputChangeFunction: function(inputChangeFunction) { stepUp: function() {
if (this.inputChangeFunction) { this.elInput.stepUp();
this.elInput.removeEventListener('change', this.inputChangeFunction); this.inputChange();
},
stepDown: function() {
this.elInput.stepDown();
this.inputChange();
},
setValue: function(newValue) {
this.elInput.value = newValue;
this.elText.firstChild.data = newValue;
},
setValueChangeFunction: function(valueChangeFunction) {
if (this.valueChangeFunction) {
this.elInput.removeEventListener("change", this.valueChangeFunction);
} }
this.inputChangeFunction = inputChangeFunction.bind(this.elInput); this.valueChangeFunction = valueChangeFunction.bind(this.elInput);
this.elInput.addEventListener('change', this.inputChangeFunction); this.elInput.addEventListener("change", this.valueChangeFunction);
}, },
inputChange: function() {
this.setValue(this.elInput.value);
},
inputBlur: function() {
this.elInput.style.visibility = "hidden";
this.elText.style.visibility = "visible";
},
initialize: function() { initialize: function() {
this.onMouseDown = this.mouseDown.bind(this);
this.onMouseMove = this.mouseMove.bind(this); this.onMouseMove = this.mouseMove.bind(this);
this.onMouseUp = this.mouseUp.bind(this); this.onMouseUp = this.mouseUp.bind(this);
this.onStepUp = this.stepUp.bind(this);
this.onStepDown = this.stepDown.bind(this);
this.onInputChange = this.inputChange.bind(this);
this.onInputBlur = this.inputBlur.bind(this);
this.elDiv = document.createElement('div'); this.elDiv = document.createElement('div');
this.elDiv.className = "draggable-number"; this.elDiv.className = "draggable-number";
this.elText = document.createElement('label');
this.elText.className = "draggable-number text";
this.elText.innerText = " ";
this.elText.style.visibility = "visible";
this.elText.addEventListener("mousedown", this.onMouseDown);
this.elLeftArrow = document.createElement('span');
this.elRightArrow = document.createElement('span');
this.elLeftArrow.className = 'draggable-number left-arrow';
this.elLeftArrow.innerHTML = 'D';
this.elLeftArrow.addEventListener("click", this.onStepDown);
this.elRightArrow.className = 'draggable-number right-arrow';
this.elRightArrow.innerHTML = 'D';
this.elRightArrow.addEventListener("click", this.onStepUp);
this.elInput = document.createElement('input'); this.elInput = document.createElement('input');
this.elInput.className = "draggable-number input";
this.elInput.setAttribute("type", "number"); this.elInput.setAttribute("type", "number");
if (this.min !== undefined) { if (this.min !== undefined) {
this.elInput.setAttribute("min", this.min); this.elInput.setAttribute("min", this.min);
@ -77,18 +135,13 @@ DraggableNumber.prototype = {
if (this.step !== undefined) { if (this.step !== undefined) {
this.elInput.setAttribute("step", this.step); this.elInput.setAttribute("step", this.step);
} }
this.elInput.draggableNumber = this; this.elInput.style.visibility = "hidden";
this.elInput.addEventListener("mousedown", this.onMouseDown); this.elInput.addEventListener("change", this.onInputChange);
this.elInput.addEventListener("blur", this.onInputBlur);
this.elLeftArrow = document.createElement('span');
this.elRightArrow = document.createElement('span');
this.elLeftArrow.className = 'draggable-number left-arrow';
this.elLeftArrow.innerHTML = 'D';
this.elRightArrow.className = 'draggable-number right-arrow';
this.elRightArrow.innerHTML = 'D';
this.elDiv.appendChild(this.elLeftArrow); this.elText.appendChild(this.elLeftArrow);
this.elDiv.appendChild(this.elInput); this.elText.appendChild(this.elInput);
this.elDiv.appendChild(this.elRightArrow); this.elText.appendChild(this.elRightArrow);
this.elDiv.appendChild(this.elText);
} }
}; };

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

@ -1374,16 +1374,16 @@ const PROPERTY_NAME_DIVISION = {
}; };
const VECTOR_ELEMENTS = { const VECTOR_ELEMENTS = {
X_INPUT: 0, X_NUMBER: 0,
Y_INPUT: 1, Y_NUMBER: 1,
Z_INPUT: 2, Z_NUMBER: 2,
}; };
const COLOR_ELEMENTS = { const COLOR_ELEMENTS = {
COLOR_PICKER: 0, COLOR_PICKER: 0,
RED_INPUT: 1, RED_NUMBER: 1,
GREEN_INPUT: 2, GREEN_NUMBER: 2,
BLUE_INPUT: 3, BLUE_NUMBER: 3,
}; };
const TEXTURE_ELEMENTS = { const TEXTURE_ELEMENTS = {
@ -1417,16 +1417,17 @@ function getPropertyInputElement(propertyID) {
switch (property.data.type) { switch (property.data.type) {
case 'string': case 'string':
case 'bool': case 'bool':
case 'number':
case 'dropdown': case 'dropdown':
case 'textarea': case 'textarea':
case 'texture': case 'texture':
return property.elInput; return property.elInput;
case 'number':
return property.elNumber.elInput;
case 'vec3': case 'vec3':
case 'vec2': case 'vec2':
return { x: property.elInputX, y: property.elInputY, z: property.elInputZ }; return { x: property.elNumberX.elInput, y: property.elNumberY.elInput, z: property.elNumberZ.elInput };
case 'color': case 'color':
return { red: property.elInputR, green: property.elInputG, blue: property.elInputB }; return { red: property.elNumberR.elInput, green: property.elNumberG.elInput, blue: property.elNumberB.elInput };
case 'icon': case 'icon':
return property.elLabel; return property.elLabel;
default: default:
@ -1498,26 +1499,26 @@ function resetProperties() {
} }
case 'number': { case 'number': {
if (propertyData.defaultValue !== undefined) { if (propertyData.defaultValue !== undefined) {
property.elInput.value = propertyData.defaultValue; property.elNumber.setValue(propertyData.defaultValue);
} else { } else {
property.elInput.value = ""; property.elNumber.setValue("");
} }
break; break;
} }
case 'vec3': case 'vec3':
case 'vec2': { case 'vec2': {
property.elInputX.value = ""; property.elNumberX.setValue("");
property.elInputY.value = ""; property.elNumberY.setValue("");
if (property.elInputZ !== undefined) { if (property.elNumberZ !== undefined) {
property.elInputZ.value = ""; property.elNumberZ.setValue("");
} }
break; break;
} }
case 'color': { case 'color': {
property.elColorPicker.style.backgroundColor = "rgb(" + 0 + "," + 0 + "," + 0 + ")"; property.elColorPicker.style.backgroundColor = "rgb(" + 0 + "," + 0 + "," + 0 + ")";
property.elInputR.value = ""; property.elNumberR.setValue("");
property.elInputG.value = ""; property.elNumberG.setValue("");
property.elInputB.value = ""; property.elNumberB.setValue("");
break; break;
} }
case 'dropdown': { case 'dropdown': {
@ -1819,17 +1820,17 @@ function createNumberProperty(property, elProperty) {
elDraggableNumber.elInput.value = defaultValue; elDraggableNumber.elInput.value = defaultValue;
} }
let inputChangeFunction = createEmitNumberPropertyUpdateFunction(propertyName, propertyData.multiplier, propertyData.decimals, property.isParticleProperty); let valueChangeFunction = createEmitNumberPropertyUpdateFunction(propertyName, propertyData.multiplier, property.isParticleProperty);
elDraggableNumber.setInputChangeFunction(inputChangeFunction); elDraggableNumber.setValueChangeFunction(valueChangeFunction);
elDraggableNumber.elInput.setAttribute("id", elementID); elDraggableNumber.elInput.setAttribute("id", elementID);
elProperty.appendChild(elDraggableNumber.elDiv); elProperty.appendChild(elDraggableNumber.elDiv);
if (propertyData.buttons !== undefined) { if (propertyData.buttons !== undefined) {
addButtons(elDraggableNumber.elDiv, elementID, propertyData.buttons, false); addButtons(elDraggableNumber.elText, elementID, propertyData.buttons, false);
} }
return elDraggableNumber.elInput; return elDraggableNumber;
} }
function createVec3Property(property, elProperty) { function createVec3Property(property, elProperty) {
@ -1839,24 +1840,24 @@ function createVec3Property(property, elProperty) {
elProperty.className = propertyData.vec3Type + " fstuple"; elProperty.className = propertyData.vec3Type + " fstuple";
let elNumberX = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.X_INPUT], let elNumberX = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.X_NUMBER],
propertyData.min, propertyData.max, propertyData.step); propertyData.min, propertyData.max, propertyData.step);
let elNumberY = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Y_INPUT], let elNumberY = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Y_NUMBER],
propertyData.min, propertyData.max, propertyData.step); propertyData.min, propertyData.max, propertyData.step);
let elNumberZ = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Z_INPUT], let elNumberZ = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Z_NUMBER],
propertyData.min, propertyData.max, propertyData.step); propertyData.min, propertyData.max, propertyData.step);
let inputChangeFunction = createEmitVec3PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput, let valueChangeFunction = createEmitVec3PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput,
elNumberZ.elInput, propertyData.multiplier, elNumberZ.elInput, propertyData.multiplier,
property.isParticleProperty); property.isParticleProperty);
elNumberX.setInputChangeFunction(inputChangeFunction); elNumberX.setValueChangeFunction(valueChangeFunction);
elNumberY.setInputChangeFunction(inputChangeFunction); elNumberY.setValueChangeFunction(valueChangeFunction);
elNumberZ.setInputChangeFunction(inputChangeFunction); elNumberZ.setValueChangeFunction(valueChangeFunction);
let elResult = []; let elResult = [];
elResult[VECTOR_ELEMENTS.X_INPUT] = elNumberX.elInput; elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX;
elResult[VECTOR_ELEMENTS.Y_INPUT] = elNumberY.elInput; elResult[VECTOR_ELEMENTS.Y_NUMBER] = elNumberY;
elResult[VECTOR_ELEMENTS.Z_INPUT] = elNumberZ.elInput; elResult[VECTOR_ELEMENTS.Z_NUMBER] = elNumberZ;
return elResult; return elResult;
} }
@ -1872,19 +1873,19 @@ function createVec2Property(property, elProperty) {
elProperty.appendChild(elTuple); elProperty.appendChild(elTuple);
let elNumberX = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.X_INPUT], let elNumberX = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.X_NUMBER],
propertyData.min, propertyData.max, propertyData.step); propertyData.min, propertyData.max, propertyData.step);
let elNumberY = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Y_INPUT], let elNumberY = createTupleNumberInput(elProperty, elementID, propertyData.subLabels[VECTOR_ELEMENTS.Y_NUMBER],
propertyData.min, propertyData.max, propertyData.step); propertyData.min, propertyData.max, propertyData.step);
let inputChangeFunction = createEmitVec2PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput, let valueChangeFunction = createEmitVec2PropertyUpdateFunction(propertyName, elNumberX.elInput, elNumberY.elInput,
propertyData.multiplier, property.isParticleProperty); propertyData.multiplier, property.isParticleProperty);
elNumberX.setInputChangeFunction(inputChangeFunction); elNumberX.setValueChangeFunction(valueChangeFunction);
elNumberY.setInputChangeFunction(inputChangeFunction); elNumberY.setValueChangeFunction(valueChangeFunction);
let elResult = []; let elResult = [];
elResult[VECTOR_ELEMENTS.X_INPUT] = elNumberX.elInput; elResult[VECTOR_ELEMENTS.X_NUMBER] = elNumberX;
elResult[VECTOR_ELEMENTS.Y_INPUT] = elNumberY.elInput; elResult[VECTOR_ELEMENTS.Y_NUMBER] = elNumberY;
return elResult; return elResult;
} }
@ -1908,11 +1909,11 @@ function createColorProperty(property, elProperty) {
let elNumberG = createTupleNumberInput(elTuple, elementID, "green", COLOR_MIN, COLOR_MAX, COLOR_STEP); let elNumberG = createTupleNumberInput(elTuple, elementID, "green", COLOR_MIN, COLOR_MAX, COLOR_STEP);
let elNumberB = createTupleNumberInput(elTuple, elementID, "blue", COLOR_MIN, COLOR_MAX, COLOR_STEP); let elNumberB = createTupleNumberInput(elTuple, elementID, "blue", COLOR_MIN, COLOR_MAX, COLOR_STEP);
let inputChangeFunction = createEmitColorPropertyUpdateFunction(propertyName, elNumberR.elInput, elNumberG.elInput, let valueChangeFunction = createEmitColorPropertyUpdateFunction(propertyName, elNumberR.elInput, elNumberG.elInput,
elNumberB.elInput, property.isParticleProperty); elNumberB.elInput, property.isParticleProperty);
elNumberR.setInputChangeFunction(inputChangeFunction); elNumberR.setValueChangeFunction(valueChangeFunction);
elNumberG.setInputChangeFunction(inputChangeFunction); elNumberG.setValueChangeFunction(valueChangeFunction);
elNumberB.setInputChangeFunction(inputChangeFunction); elNumberB.setValueChangeFunction(valueChangeFunction);
let colorPickerID = "#" + elementID; let colorPickerID = "#" + elementID;
colorPickers[colorPickerID] = $(colorPickerID).colpick({ colorPickers[colorPickerID] = $(colorPickerID).colpick({
@ -1941,9 +1942,9 @@ function createColorProperty(property, elProperty) {
let elResult = []; let elResult = [];
elResult[COLOR_ELEMENTS.COLOR_PICKER] = elColorPicker; elResult[COLOR_ELEMENTS.COLOR_PICKER] = elColorPicker;
elResult[COLOR_ELEMENTS.RED_INPUT] = elNumberR.elInput; elResult[COLOR_ELEMENTS.RED_NUMBER] = elNumberR;
elResult[COLOR_ELEMENTS.GREEN_INPUT] = elNumberG.elInput; elResult[COLOR_ELEMENTS.GREEN_NUMBER] = elNumberG;
elResult[COLOR_ELEMENTS.BLUE_INPUT] = elNumberB.elInput; elResult[COLOR_ELEMENTS.BLUE_NUMBER] = elNumberB;
return elResult; return elResult;
} }
@ -2081,14 +2082,14 @@ function createTupleNumberInput(elTuple, propertyElementID, subLabel, min, max,
let elementID = propertyElementID + "-" + subLabel.toLowerCase(); let elementID = propertyElementID + "-" + subLabel.toLowerCase();
let elLabel = document.createElement('label'); let elLabel = document.createElement('label');
elLabel.className = subLabel; elLabel.className = "sublabel " + subLabel;
elLabel.innerText = subLabel[0].toUpperCase() + subLabel.slice(1); elLabel.innerText = subLabel[0].toUpperCase() + subLabel.slice(1);
elLabel.setAttribute("for", elementID); elLabel.setAttribute("for", elementID);
let elDraggableNumber = new DraggableNumber(min, max, step); let elDraggableNumber = new DraggableNumber(min, max, step);
elDraggableNumber.elInput.setAttribute("id", elementID); elDraggableNumber.elInput.setAttribute("id", elementID);
elDraggableNumber.elDiv.className += " fstuple"; elDraggableNumber.elDiv.className += " fstuple";
elDraggableNumber.elDiv.insertBefore(elLabel, elDraggableNumber.elLeftArrow); elDraggableNumber.elText.insertBefore(elLabel, elDraggableNumber.elLeftArrow);
elTuple.appendChild(elDraggableNumber.elDiv); elTuple.appendChild(elDraggableNumber.elDiv);
return elDraggableNumber; return elDraggableNumber;
@ -2189,7 +2190,7 @@ function createProperty(propertyData, propertyElementID, propertyName, propertyI
} }
default: { default: {
console.log("EntityProperties - Unknown property type " + console.log("EntityProperties - Unknown property type " +
propertyType + " set to property " + propertyID); propertyType + " set to property " + propertyID);
break; break;
} }
} }
@ -2716,6 +2717,85 @@ function showParentMaterialNameBox(number, elNumber, elString) {
} }
} }
function createProperty(propertyData, propertyElementID, propertyName, propertyID, elProperty) {
let property = {
data: propertyData,
elementID: propertyElementID,
name: propertyName,
elProperty: elProperty,
};
let propertyType = propertyData.type;
switch (propertyType) {
case 'string': {
property.elInput = createStringProperty(property, elProperty);
break;
}
case 'bool': {
property.elInput = createBoolProperty(property, elProperty);
break;
}
case 'number': {
property.elNumber = createNumberProperty(property, elProperty);
break;
}
case 'vec3': {
let elVec3 = createVec3Property(property, elProperty);
property.elNumberX = elVec3[VECTOR_ELEMENTS.X_NUMBER];
property.elNumberY = elVec3[VECTOR_ELEMENTS.Y_NUMBER];
property.elNumberZ = elVec3[VECTOR_ELEMENTS.Z_NUMBER];
break;
}
case 'vec2': {
let elVec2 = createVec2Property(property, elProperty);
property.elNumberX = elVec2[VECTOR_ELEMENTS.X_NUMBER];
property.elNumberY = elVec2[VECTOR_ELEMENTS.Y_NUMBER];
break;
}
case 'color': {
let elColor = createColorProperty(property, elProperty);
property.elColorPicker = elColor[COLOR_ELEMENTS.COLOR_PICKER];
property.elNumberR = elColor[COLOR_ELEMENTS.RED_NUMBER];
property.elNumberG = elColor[COLOR_ELEMENTS.GREEN_NUMBER];
property.elNumberB = elColor[COLOR_ELEMENTS.BLUE_NUMBER];
break;
}
case 'dropdown': {
property.elInput = createDropdownProperty(property, propertyID, elProperty);
break;
}
case 'textarea': {
property.elInput = createTextareaProperty(property, elProperty);
break;
}
case 'icon': {
property.elSpan = createIconProperty(property, elProperty);
break;
}
case 'texture': {
let elTexture = createTextureProperty(property, elProperty);
property.elImage = elTexture[TEXTURE_ELEMENTS.IMAGE];
property.elInput = elTexture[TEXTURE_ELEMENTS.TEXT_INPUT];
break;
}
case 'buttons': {
property.elProperty = createButtonsProperty(property, elProperty);
break;
}
case 'placeholder':
case 'sub-header': {
break;
}
default: {
console.log("EntityProperties - Unknown property type " +
propertyType + " set to property " + propertyID);
break;
}
}
return property;
}
function loaded() { function loaded() {
openEventBridge(function() { openEventBridge(function() {
@ -3040,9 +3120,9 @@ function loaded() {
value = Math.round(value.round) / propertyData.round; value = Math.round(value.round) / propertyData.round;
} }
if (propertyData.decimals !== undefined) { if (propertyData.decimals !== undefined) {
property.elInput.value = value.toFixed(propertyData.decimals); property.elNumber.setValue(value.toFixed(propertyData.decimals));
} else { } else {
property.elInput.value = value; property.elNumber.setValue(value);
} }
break; break;
} }
@ -3058,16 +3138,16 @@ function loaded() {
valueZ = Math.round(valueZ * propertyData.round) / propertyData.round; valueZ = Math.round(valueZ * propertyData.round) / propertyData.round;
} }
if (propertyData.decimals !== undefined) { if (propertyData.decimals !== undefined) {
property.elInputX.value = valueX.toFixed(propertyData.decimals); property.elNumberX.setValue(valueX.toFixed(propertyData.decimals));
property.elInputY.value = valueY.toFixed(propertyData.decimals); property.elNumberY.setValue(valueY.toFixed(propertyData.decimals));
if (property.elInputZ !== undefined) { if (property.elNumberZ !== undefined) {
property.elInputZ.value = valueZ.toFixed(propertyData.decimals); property.elNumberZ.setValue(valueZ.toFixed(propertyData.decimals));
} }
} else { } else {
property.elInputX.value = valueX; property.elNumberX.setValue(valueX);
property.elInputY.value = valueY; property.elNumberY.setValue(valueY);
if (property.elInputZ !== undefined) { if (property.elNumberZ !== undefined) {
property.elInputZ.value = valueZ; property.elNumberZ.setValue(valueZ);
} }
} }
break; break;
@ -3076,9 +3156,9 @@ function loaded() {
property.elColorPicker.style.backgroundColor = "rgb(" + propertyValue.red + "," + property.elColorPicker.style.backgroundColor = "rgb(" + propertyValue.red + "," +
propertyValue.green + "," + propertyValue.green + "," +
propertyValue.blue + ")"; propertyValue.blue + ")";
property.elInputR.value = propertyValue.red; property.elNumberR.setValue(propertyValue.red);
property.elInputG.value = propertyValue.green; property.elNumberG.setValue(propertyValue.green);
property.elInputB.value = propertyValue.blue; property.elNumberB.setValue(propertyValue.blue);
break; break;
} }
case 'dropdown': { case 'dropdown': {