mirror of
https://github.com/overte-org/overte.git
synced 2025-04-08 08:14:48 +02:00
Merge pull request #14279 from dback2/removeParticleExplorer
Remove particle explorer
This commit is contained in:
John Conklin II
GitHub
commit
7227547b6a
6 changed files with 0 additions and 1527 deletions
|
|
@ -1,709 +0,0 @@
|
|||
/* global window, document, print, alert, console,setTimeout, clearTimeout, _ $ */
|
||||
/* eslint no-console: 0 */
|
||||
|
||||
/**
|
||||
UI Builder V1.0
|
||||
|
||||
Created by Matti 'Menithal' Lahtinen
|
||||
24/5/2017
|
||||
Copyright 2017 High Fidelity, Inc.
|
||||
|
||||
This can eventually be expanded to all of Edit, for now, starting
|
||||
with Particles Only.
|
||||
|
||||
This is created for the sole purpose of streamliming the bridge, and to simplify
|
||||
the logic between an inputfield in WebView and Entities in High Fidelity.
|
||||
|
||||
We also do not need anything as heavy as jquery or any other platform,
|
||||
as we are mostly only building for QT (while, all the other JS frameworks usually do alot of polyfilling)
|
||||
|
||||
Available Types:
|
||||
|
||||
JSONInputField - Accepts JSON input, once one presses Save, it will be propegated.
|
||||
Button- A Button that listens for a custom event as defined by callback
|
||||
Boolean - Creates a checkbox that the user can either check or uncheck
|
||||
SliderFloat - Creates a slider (with input) that has Float values from min to max.
|
||||
Default is min 0, max 1
|
||||
SliderInteger - Creates a slider (with input) that has a Integer value from min to max.
|
||||
Default is min 1, max 10000
|
||||
SliderRadian - Creates a slider (with input) that has Float values in degrees,
|
||||
that are converted to radians. default is min 0, max Math.PI.
|
||||
Texture - Creates a Image with an url input field that points to texture.
|
||||
If image cannot form, show "cannot find image"
|
||||
VecQuaternion - Creates a 3D Vector field that converts to quaternions.
|
||||
Checkbox exists to show quaternions instead.
|
||||
Color - Create field color button, that when pressed, opens the color picker.
|
||||
Vector - Create a 3D Vector field that has one to one correspondence.
|
||||
|
||||
The script will use this structure to build a UI that is connected The
|
||||
id fields within High Fidelity
|
||||
|
||||
This should make editing, and everything related much more simpler to maintain,
|
||||
and If there is any changes to either the Entities or properties of
|
||||
|
||||
**/
|
||||
|
||||
var RADIANS_PER_DEGREE = Math.PI / 180;
|
||||
var DEBOUNCE_TIMEOUT = 125;
|
||||
|
||||
var roundFloat = function (input, round) {
|
||||
round = round ? round : 1000;
|
||||
var sanitizedInput;
|
||||
if (typeof input === "string") {
|
||||
sanitizedInput = parseFloat(input);
|
||||
} else {
|
||||
sanitizedInput = input;
|
||||
}
|
||||
return Math.round(sanitizedInput * round) / round;
|
||||
};
|
||||
|
||||
function HifiEntityUI(parent) {
|
||||
this.parent = parent;
|
||||
|
||||
var self = this;
|
||||
this.sendPackage = {};
|
||||
this.settingsUpdateLock = false;
|
||||
this.webBridgeSync = function(id, val) {
|
||||
if (!this.settingsUpdateLock) {
|
||||
this.sendPackage[id] = val;
|
||||
this.webBridgeSyncDebounce();
|
||||
}
|
||||
};
|
||||
this.webBridgeSyncDebounce = _.debounce(function () {
|
||||
if (self.EventBridge) {
|
||||
self.submitChanges(self.sendPackage);
|
||||
self.sendPackage = {};
|
||||
}
|
||||
}, DEBOUNCE_TIMEOUT);
|
||||
}
|
||||
|
||||
HifiEntityUI.prototype = {
|
||||
setOnSelect: function (callback) {
|
||||
this.onSelect = callback;
|
||||
},
|
||||
submitChanges: function (structure) {
|
||||
var message = {
|
||||
messageType: "settings_update",
|
||||
updatedSettings: structure
|
||||
};
|
||||
this.EventBridge.emitWebEvent(JSON.stringify(message));
|
||||
},
|
||||
setUI: function (structure) {
|
||||
this.structure = structure;
|
||||
},
|
||||
disableFields: function () {
|
||||
var fields = document.getElementsByTagName("input");
|
||||
for (var i = 0; i < fields.length; i++) {
|
||||
if (fields[i].getAttribute("type") !== "button") {
|
||||
fields[i].value = "";
|
||||
}
|
||||
|
||||
fields[i].setAttribute("disabled", true);
|
||||
}
|
||||
var textures = document.getElementsByTagName("img");
|
||||
for (i = 0; i < textures.length; i++) {
|
||||
textures[i].src = "";
|
||||
}
|
||||
|
||||
textures = document.getElementsByClassName("with-texture");
|
||||
for (i = 0; i < textures.length; i++) {
|
||||
textures[i].classList.remove("with-textures");
|
||||
textures[i].classList.add("no-texture");
|
||||
}
|
||||
|
||||
var textareas = document.getElementsByTagName("textarea");
|
||||
for (var x = 0; x < textareas.length; x++) {
|
||||
textareas[x].remove();
|
||||
}
|
||||
},
|
||||
getSettings: function () {
|
||||
var self = this;
|
||||
var json = {};
|
||||
var keys = Object.keys(self.builtRows);
|
||||
for (var i = 0; i < keys.length; i++) {
|
||||
var key = keys[i];
|
||||
var el = self.builtRows[key];
|
||||
if (el.className.indexOf("checkbox") !== -1) {
|
||||
json[key] = document.getElementById(key)
|
||||
.checked ? true : false;
|
||||
} else if (el.className.indexOf("vector-section") !== -1) {
|
||||
var vector = {};
|
||||
if (el.className.indexOf("rgb") !== -1) {
|
||||
var red = document.getElementById(key + "-red");
|
||||
var blue = document.getElementById(key + "-blue");
|
||||
var green = document.getElementById(key + "-green");
|
||||
vector.red = red.value;
|
||||
vector.blue = blue.value;
|
||||
vector.green = green.value;
|
||||
} else if (el.className.indexOf("pyr") !== -1) {
|
||||
var p = document.getElementById(key + "-Pitch");
|
||||
var y = document.getElementById(key + "-Yaw");
|
||||
var r = document.getElementById(key + "-Roll");
|
||||
vector.x = p.value;
|
||||
vector.y = y.value;
|
||||
vector.z = r.value;
|
||||
} else {
|
||||
var x = document.getElementById(key + "-x");
|
||||
var ey = document.getElementById(key + "-y");
|
||||
var z = document.getElementById(key + "-z");
|
||||
vector.x = x.value;
|
||||
vector.y = ey.value;
|
||||
vector.z = z.value;
|
||||
}
|
||||
json[key] = vector;
|
||||
} else if (el.className.indexOf("radian") !== -1) {
|
||||
json[key] = document.getElementById(key).value * RADIANS_PER_DEGREE;
|
||||
} else if (el.className.length > 0) {
|
||||
json[key] = document.getElementById(key).value;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
return json;
|
||||
},
|
||||
fillFields: function (currentProperties) {
|
||||
var self = this;
|
||||
var fields = document.getElementsByTagName("input");
|
||||
|
||||
if (!currentProperties.locked) {
|
||||
for (var i = 0; i < fields.length; i++) {
|
||||
fields[i].removeAttribute("disabled");
|
||||
if (fields[i].hasAttribute("data-max")) {
|
||||
// Reset Max to original max
|
||||
fields[i].setAttribute("max", fields[i].getAttribute("data-max"));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (self.onSelect) {
|
||||
self.onSelect();
|
||||
}
|
||||
var keys = Object.keys(currentProperties);
|
||||
|
||||
|
||||
for (var e in keys) {
|
||||
if (keys.hasOwnProperty(e)) {
|
||||
var value = keys[e];
|
||||
|
||||
var property = currentProperties[value];
|
||||
var field = self.builtRows[value];
|
||||
if (field) {
|
||||
var el = document.getElementById(value);
|
||||
|
||||
if (field.className.indexOf("radian") !== -1) {
|
||||
el.value = property / RADIANS_PER_DEGREE;
|
||||
el.onchange({
|
||||
target: el
|
||||
});
|
||||
} else if (field.className.indexOf("range") !== -1 || field.className.indexOf("texture") !== -1) {
|
||||
el.value = property;
|
||||
el.onchange({
|
||||
target: el
|
||||
});
|
||||
} else if (field.className.indexOf("checkbox") !== -1) {
|
||||
if (property) {
|
||||
el.setAttribute("checked", property);
|
||||
} else {
|
||||
el.removeAttribute("checked");
|
||||
}
|
||||
} else if (field.className.indexOf("vector-section") !== -1) {
|
||||
if (field.className.indexOf("rgb") !== -1) {
|
||||
var red = document.getElementById(value + "-red");
|
||||
var blue = document.getElementById(value + "-blue");
|
||||
var green = document.getElementById(value + "-green");
|
||||
red.value = parseInt(property.red);
|
||||
blue.value = parseInt(property.blue);
|
||||
green.value = parseInt(property.green);
|
||||
|
||||
red.oninput({
|
||||
target: red
|
||||
});
|
||||
} else if (field.className.indexOf("xyz") !== -1) {
|
||||
var x = document.getElementById(value + "-x");
|
||||
var y = document.getElementById(value + "-y");
|
||||
var z = document.getElementById(value + "-z");
|
||||
|
||||
x.value = roundFloat(property.x, 100);
|
||||
y.value = roundFloat(property.y, 100);
|
||||
z.value = roundFloat(property.z, 100);
|
||||
} else if (field.className.indexOf("pyr") !== -1) {
|
||||
var pitch = document.getElementById(value + "-Pitch");
|
||||
var yaw = document.getElementById(value + "-Yaw");
|
||||
var roll = document.getElementById(value + "-Roll");
|
||||
|
||||
pitch.value = roundFloat(property.x, 100);
|
||||
yaw.value = roundFloat(property.y, 100);
|
||||
roll.value = roundFloat(property.z, 100);
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
connect: function (EventBridge) {
|
||||
this.EventBridge = EventBridge;
|
||||
|
||||
var self = this;
|
||||
|
||||
EventBridge.emitWebEvent(JSON.stringify({
|
||||
messageType: 'page_loaded'
|
||||
}));
|
||||
|
||||
EventBridge.scriptEventReceived.connect(function (data) {
|
||||
data = JSON.parse(data);
|
||||
|
||||
if (data.messageType === 'particle_settings') {
|
||||
self.settingsUpdateLock = true;
|
||||
self.fillFields(data.currentProperties);
|
||||
self.settingsUpdateLock = false;
|
||||
// Do expected property match with structure;
|
||||
} else if (data.messageType === 'particle_close') {
|
||||
self.disableFields();
|
||||
}
|
||||
});
|
||||
},
|
||||
build: function () {
|
||||
var self = this;
|
||||
var sections = Object.keys(this.structure);
|
||||
this.builtRows = {};
|
||||
sections.forEach(function (section, index) {
|
||||
var properties = self.structure[section];
|
||||
self.addSection(self.parent, section, properties, index);
|
||||
});
|
||||
},
|
||||
addSection: function (parent, section, properties, index) {
|
||||
var self = this;
|
||||
|
||||
var sectionDivHeader = document.createElement("fieldset");
|
||||
var title = document.createElement("legend");
|
||||
var dropDown = document.createElement("span");
|
||||
|
||||
dropDown.className = "arrow";
|
||||
sectionDivHeader.className = "major";
|
||||
title.className = "section-header";
|
||||
title.id = section + "-section";
|
||||
title.innerHTML = section;
|
||||
title.appendChild(dropDown);
|
||||
sectionDivHeader.appendChild(title);
|
||||
|
||||
var collapsed = index !== 0;
|
||||
|
||||
dropDown.innerHTML = collapsed ? "L" : "M";
|
||||
sectionDivHeader.setAttribute("collapsed", collapsed);
|
||||
parent.appendChild(sectionDivHeader);
|
||||
|
||||
var sectionDivBody = document.createElement("div");
|
||||
sectionDivBody.className = "property-group";
|
||||
|
||||
var animationWrapper = document.createElement("div");
|
||||
animationWrapper.className = "section-wrap";
|
||||
|
||||
for (var property in properties) {
|
||||
if (properties.hasOwnProperty(property)) {
|
||||
var builtRow = self.addElement(animationWrapper, properties[property]);
|
||||
var id = properties[property].id;
|
||||
if (id) {
|
||||
self.builtRows[id] = builtRow;
|
||||
}
|
||||
}
|
||||
}
|
||||
sectionDivBody.appendChild(animationWrapper);
|
||||
sectionDivHeader.appendChild(sectionDivBody);
|
||||
_.defer(function () {
|
||||
var height = (animationWrapper.clientHeight) + "px";
|
||||
if (collapsed) {
|
||||
sectionDivBody.classList.remove("visible");
|
||||
sectionDivBody.style.maxHeight = "0px";
|
||||
} else {
|
||||
sectionDivBody.classList.add("visible");
|
||||
sectionDivBody.style.maxHeight = height;
|
||||
}
|
||||
|
||||
title.onclick = function () {
|
||||
collapsed = !collapsed;
|
||||
if (collapsed) {
|
||||
sectionDivBody.classList.remove("visible");
|
||||
sectionDivBody.style.maxHeight = "0px";
|
||||
} else {
|
||||
sectionDivBody.classList.add("visible");
|
||||
sectionDivBody.style.maxHeight = (animationWrapper.clientHeight) + "px";
|
||||
}
|
||||
// sectionDivBody.style.display = collapsed ? "none": "block";
|
||||
dropDown.innerHTML = collapsed ? "L" : "M";
|
||||
title.setAttribute("collapsed", collapsed);
|
||||
};
|
||||
});
|
||||
},
|
||||
addLabel: function (parent, group) {
|
||||
var label = document.createElement("label");
|
||||
label.innerHTML = group.name;
|
||||
parent.appendChild(label);
|
||||
if (group.unit) {
|
||||
var span = document.createElement("span");
|
||||
span.innerHTML = group.unit;
|
||||
span.className = "unit";
|
||||
label.appendChild(span);
|
||||
}
|
||||
return label;
|
||||
},
|
||||
addVector: function (parent, group, labels, domArray) {
|
||||
var self = this;
|
||||
var inputs = labels ? labels : ["x", "y", "z"];
|
||||
domArray = domArray ? domArray : [];
|
||||
parent.id = group.id;
|
||||
for (var index in inputs) {
|
||||
var element = document.createElement("input");
|
||||
|
||||
element.setAttribute("type", "number");
|
||||
element.className = inputs[index];
|
||||
element.id = group.id + "-" + inputs[index];
|
||||
|
||||
if (group.defaultRange) {
|
||||
if (group.defaultRange.min) {
|
||||
element.setAttribute("min", group.defaultRange.min);
|
||||
}
|
||||
if (group.defaultRange.max) {
|
||||
element.setAttribute("max", group.defaultRange.max);
|
||||
}
|
||||
if (group.defaultRange.step) {
|
||||
element.setAttribute("step", group.defaultRange.step);
|
||||
}
|
||||
}
|
||||
if (group.oninput) {
|
||||
element.oninput = group.oninput;
|
||||
} else {
|
||||
element.oninput = function (event) {
|
||||
self.webBridgeSync(group.id, {
|
||||
x: domArray[0].value,
|
||||
y: domArray[1].value,
|
||||
z: domArray[2].value
|
||||
});
|
||||
};
|
||||
}
|
||||
element.onchange = element.oninput;
|
||||
domArray.push(element);
|
||||
}
|
||||
|
||||
this.addLabel(parent, group);
|
||||
var className = "";
|
||||
for (var i = 0; i < inputs.length; i++) {
|
||||
className += inputs[i].charAt(0)
|
||||
.toLowerCase();
|
||||
}
|
||||
parent.className += " property vector-section " + className;
|
||||
|
||||
// Add Tuple and the rest
|
||||
var tupleContainer = document.createElement("div");
|
||||
tupleContainer.className = "tuple";
|
||||
for (var domIndex in domArray) {
|
||||
var container = domArray[domIndex];
|
||||
var div = document.createElement("div");
|
||||
var label = document.createElement("label");
|
||||
label.innerHTML = inputs[domIndex] + ":";
|
||||
label.setAttribute("for", container.id);
|
||||
div.appendChild(container);
|
||||
div.appendChild(label);
|
||||
tupleContainer.appendChild(div);
|
||||
}
|
||||
parent.appendChild(tupleContainer);
|
||||
},
|
||||
addVectorQuaternion: function (parent, group) {
|
||||
this.addVector(parent, group, ["Pitch", "Yaw", "Roll"]);
|
||||
},
|
||||
addColorPicker: function (parent, group) {
|
||||
var self = this;
|
||||
var $colPickContainer = $('<div>', {
|
||||
id: group.id,
|
||||
class: "color-picker"
|
||||
});
|
||||
var updateColors = function (red, green, blue) {
|
||||
$colPickContainer.css('background-color', "rgb(" +
|
||||
red + "," +
|
||||
green + "," +
|
||||
blue + ")");
|
||||
};
|
||||
|
||||
var inputs = ["red", "green", "blue"];
|
||||
var domArray = [];
|
||||
group.oninput = function (event) {
|
||||
$colPickContainer.colpickSetColor(
|
||||
{
|
||||
r: domArray[0].value,
|
||||
g: domArray[1].value,
|
||||
b: domArray[2].value
|
||||
},
|
||||
true);
|
||||
};
|
||||
group.defaultRange = {
|
||||
min: 0,
|
||||
max: 255,
|
||||
step: 1
|
||||
};
|
||||
|
||||
parent.appendChild($colPickContainer[0]);
|
||||
self.addVector(parent, group, inputs, domArray);
|
||||
|
||||
updateColors(domArray[0].value, domArray[1].value, domArray[2].value);
|
||||
|
||||
// Could probably write a custom one for this to completely write out jquery,
|
||||
// but for now, using the same as earlier.
|
||||
|
||||
/* Color Picker Logic Here */
|
||||
|
||||
|
||||
$colPickContainer.colpick({
|
||||
colorScheme: (group.layoutColorScheme === undefined ? 'dark' : group.layoutColorScheme),
|
||||
layout: (group.layoutType === undefined ? 'hex' : group.layoutType),
|
||||
submit: (group.useSubmitButton === undefined ? true : group.useSubmitButton),
|
||||
color: {
|
||||
r: domArray[0].value,
|
||||
g: domArray[1].value,
|
||||
b: domArray[2].value
|
||||
},
|
||||
onChange: function (hsb, hex, rgb, el) {
|
||||
updateColors(rgb.r, rgb.g, rgb.b);
|
||||
|
||||
domArray[0].value = rgb.r;
|
||||
domArray[1].value = rgb.g;
|
||||
domArray[2].value = rgb.b;
|
||||
self.webBridgeSync(group.id, {
|
||||
red: rgb.r,
|
||||
green: rgb.g,
|
||||
blue: rgb.b
|
||||
});
|
||||
},
|
||||
onSubmit: function (hsb, hex, rgb, el) {
|
||||
$(el)
|
||||
.css('background-color', '#' + hex);
|
||||
$(el)
|
||||
.colpickHide();
|
||||
domArray[0].value = rgb.r;
|
||||
domArray[1].value = rgb.g;
|
||||
domArray[2].value = rgb.b;
|
||||
self.webBridgeSync(group.id, {
|
||||
red: rgb.r,
|
||||
green: rgb.g,
|
||||
blue: rgb.b
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
addTextureField: function (parent, group) {
|
||||
var self = this;
|
||||
this.addLabel(parent, group);
|
||||
parent.className += " property texture";
|
||||
var textureImage = document.createElement("div");
|
||||
var textureUrl = document.createElement("input");
|
||||
textureUrl.setAttribute("type", "text");
|
||||
textureUrl.id = group.id;
|
||||
textureImage.className = "texture-image no-texture";
|
||||
var image = document.createElement("img");
|
||||
var imageLoad = _.debounce(function (url) {
|
||||
if (url.slice(0, 5).toLowerCase() === "atp:/") {
|
||||
image.src = "";
|
||||
image.style.display = "none";
|
||||
textureImage.classList.remove("with-texture");
|
||||
textureImage.classList.remove("no-texture");
|
||||
textureImage.classList.add("no-preview");
|
||||
} else if (url.length > 0) {
|
||||
textureImage.classList.remove("no-texture");
|
||||
textureImage.classList.remove("no-preview");
|
||||
textureImage.classList.add("with-texture");
|
||||
image.src = url;
|
||||
image.style.display = "block";
|
||||
} else {
|
||||
image.src = "";
|
||||
image.style.display = "none";
|
||||
textureImage.classList.remove("with-texture");
|
||||
textureImage.classList.remove("no-preview");
|
||||
textureImage.classList.add("no-texture");
|
||||
}
|
||||
}, DEBOUNCE_TIMEOUT * 2);
|
||||
|
||||
textureUrl.oninput = function (event) {
|
||||
// Add throttle
|
||||
var url = event.target.value;
|
||||
imageLoad(url);
|
||||
self.webBridgeSync(group.id, url);
|
||||
};
|
||||
textureUrl.onchange = textureUrl.oninput;
|
||||
textureImage.appendChild(image);
|
||||
parent.appendChild(textureImage);
|
||||
parent.appendChild(textureUrl);
|
||||
},
|
||||
addSlider: function (parent, group) {
|
||||
var self = this;
|
||||
this.addLabel(parent, group);
|
||||
parent.className += " property range";
|
||||
var container = document.createElement("div");
|
||||
container.className = "slider-wrapper";
|
||||
var slider = document.createElement("input");
|
||||
slider.setAttribute("type", "range");
|
||||
|
||||
var inputField = document.createElement("input");
|
||||
inputField.setAttribute("type", "number");
|
||||
|
||||
container.appendChild(slider);
|
||||
container.appendChild(inputField);
|
||||
parent.appendChild(container);
|
||||
|
||||
if (group.type === "SliderInteger") {
|
||||
inputField.setAttribute("min", group.min !== undefined ? group.min : 0);
|
||||
inputField.setAttribute("step", 1);
|
||||
|
||||
slider.setAttribute("min", group.min !== undefined ? group.min : 0);
|
||||
slider.setAttribute("max", group.max !== undefined ? group.max : 10000);
|
||||
slider.setAttribute("data-max", group.max !== undefined ? group.max : 10000);
|
||||
slider.setAttribute("step", 1);
|
||||
|
||||
inputField.oninput = function (event) {
|
||||
// TODO: Remove this functionality? Alan finds it confusing
|
||||
if (parseInt(event.target.value) > parseInt(slider.getAttribute("max")) && group.max !== 1) {
|
||||
slider.setAttribute("max", event.target.value);
|
||||
}
|
||||
slider.value = event.target.value;
|
||||
self.webBridgeSync(group.id, slider.value);
|
||||
};
|
||||
inputField.onchange = inputField.oninput;
|
||||
slider.oninput = function (event) {
|
||||
inputField.value = event.target.value;
|
||||
self.webBridgeSync(group.id, inputField.value);
|
||||
};
|
||||
|
||||
inputField.id = group.id;
|
||||
} else if (group.type === "SliderRadian") {
|
||||
slider.setAttribute("min", group.min !== undefined ? group.min : 0);
|
||||
slider.setAttribute("max", group.max !== undefined ? group.max : 180);
|
||||
slider.setAttribute("step", 1);
|
||||
parent.className += " radian";
|
||||
inputField.setAttribute("min", (group.min !== undefined ? group.min : 0));
|
||||
inputField.setAttribute("max", (group.max !== undefined ? group.max : 180));
|
||||
|
||||
inputField.oninput = function (event) {
|
||||
slider.value = event.target.value;
|
||||
self.webBridgeSync(group.id, slider.value * RADIANS_PER_DEGREE);
|
||||
};
|
||||
inputField.onchange = inputField.oninput;
|
||||
|
||||
inputField.id = group.id;
|
||||
slider.oninput = function (event) {
|
||||
if (event.target.value > 0) {
|
||||
inputField.value = Math.floor(event.target.value);
|
||||
} else {
|
||||
inputField.value = Math.ceil(event.target.value);
|
||||
}
|
||||
self.webBridgeSync(group.id, inputField.value * RADIANS_PER_DEGREE);
|
||||
};
|
||||
var degrees = document.createElement("label");
|
||||
degrees.innerHTML = "°";
|
||||
degrees.style.fontSize = "1.4rem";
|
||||
degrees.style.display = "inline";
|
||||
degrees.style.verticalAlign = "top";
|
||||
degrees.style.paddingLeft = "0.4rem";
|
||||
container.appendChild(degrees);
|
||||
|
||||
} else {
|
||||
// Must then be Float
|
||||
inputField.setAttribute("min", group.min !== undefined ? group.min : 0);
|
||||
slider.setAttribute("step", 0.01);
|
||||
|
||||
slider.setAttribute("min", group.min !== undefined ? group.min : 0);
|
||||
slider.setAttribute("max", group.max !== undefined ? group.max : 1);
|
||||
slider.setAttribute("data-max", group.max !== undefined ? group.max : 1);
|
||||
slider.setAttribute("step", 0.01);
|
||||
|
||||
inputField.oninput = function (event) {
|
||||
// TODO: Remove this functionality? Alan finds it confusing
|
||||
if (parseFloat(event.target.value) > parseFloat(slider.getAttribute("max")) && group.max !== 1) {
|
||||
slider.setAttribute("max", event.target.value);
|
||||
}
|
||||
|
||||
slider.value = event.target.value;
|
||||
self.webBridgeSync(group.id, slider.value);
|
||||
// bind web sock update here.
|
||||
};
|
||||
inputField.onchange = inputField.oninput;
|
||||
slider.oninput = function (event) {
|
||||
inputField.value = event.target.value;
|
||||
self.webBridgeSync(group.id, inputField.value);
|
||||
};
|
||||
|
||||
inputField.id = group.id;
|
||||
}
|
||||
|
||||
// UpdateBinding
|
||||
},
|
||||
addCheckBox: function (parent, group) {
|
||||
var checkBox = document.createElement("input");
|
||||
checkBox.setAttribute("type", "checkbox");
|
||||
var self = this;
|
||||
checkBox.onchange = function (event) {
|
||||
self.webBridgeSync(group.id, event.target.checked);
|
||||
};
|
||||
checkBox.id = group.id;
|
||||
parent.appendChild(checkBox);
|
||||
var label = this.addLabel(parent, group);
|
||||
label.setAttribute("for", checkBox.id);
|
||||
parent.className += " property checkbox";
|
||||
},
|
||||
addElement: function (parent, group) {
|
||||
var self = this;
|
||||
var property = document.createElement("div");
|
||||
property.id = group.id;
|
||||
|
||||
var row = document.createElement("div");
|
||||
switch (group.type) {
|
||||
case "Button":
|
||||
var button = document.createElement("input");
|
||||
button.setAttribute("type", "button");
|
||||
button.id = group.id;
|
||||
if (group.disabled) {
|
||||
button.disabled = group.disabled;
|
||||
}
|
||||
button.className = group.class;
|
||||
button.value = group.name;
|
||||
|
||||
button.onclick = group.callback;
|
||||
parent.appendChild(button);
|
||||
break;
|
||||
case "Row":
|
||||
var hr = document.createElement("hr");
|
||||
hr.className = "splitter";
|
||||
if (group.id) {
|
||||
hr.id = group.id;
|
||||
}
|
||||
parent.appendChild(hr);
|
||||
break;
|
||||
case "Boolean":
|
||||
self.addCheckBox(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
case "SliderFloat":
|
||||
case "SliderInteger":
|
||||
case "SliderRadian":
|
||||
self.addSlider(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
case "Texture":
|
||||
self.addTextureField(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
case "Color":
|
||||
self.addColorPicker(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
case "Vector":
|
||||
self.addVector(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
case "VectorQuaternion":
|
||||
self.addVectorQuaternion(row, group);
|
||||
parent.appendChild(row);
|
||||
break;
|
||||
default:
|
||||
console.log("not defined");
|
||||
}
|
||||
return row;
|
||||
}
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,43 +0,0 @@
|
|||
<!--
|
||||
// particleExplorer.hml
|
||||
//
|
||||
//
|
||||
// Created by James B. Pollack @imgntn on 9/26/2015
|
||||
// Copyright 2015 High Fidelity, Inc.
|
||||
//
|
||||
|
||||
// Reworked by Menithal on 20/5/2017
|
||||
// Using a custom built system for High Fidelity
|
||||
//
|
||||
// Distributed under the Apache License, Version 2.0.
|
||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
//
|
||||
-->
|
||||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" type="text/css" href="../html/css/colpick.css">
|
||||
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
|
||||
<script type="text/javascript" src="../html/js/eventBridgeLoader.js"></script>
|
||||
<!---->
|
||||
<script type="text/javascript" src="../html/js/jquery-2.1.4.min.js"></script>
|
||||
<script type="text/javascript" src="../html/js/colpick.js"></script>
|
||||
|
||||
<script type="text/javascript" src="underscore-min.js"></script>
|
||||
<script type="text/javascript" src="hifi-entity-ui.js?v1"></script>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="../html/css/hifi-style.css">
|
||||
<link rel="stylesheet" type="text/css" href="../html/css/edit-style.css">
|
||||
<link rel="stylesheet" type="text/css" href="../html/css/colpick.css">
|
||||
<link rel="stylesheet" type="text/css" href="particle-style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="properties-list">
|
||||
<div class="section-header" id="main-header">
|
||||
<label> Particle Explorer </label>
|
||||
</div>
|
||||
<!-- This will be filled by the script! -->
|
||||
</div>
|
||||
<div id="rem"></div>
|
||||
<script type="text/javascript" src="particleExplorer.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,485 +0,0 @@
|
|||
//
|
||||
// particleExplorer.js
|
||||
//
|
||||
// Created by James B. Pollack @imgntn on 9/26/2015
|
||||
// Copyright 2017 High Fidelity, Inc.
|
||||
//
|
||||
// Reworked by Menithal on 20/5/2017
|
||||
// Reworked by Daniela Fontes and Artur Gomes (Mimicry) on 12/18/2017
|
||||
//
|
||||
// Web app side of the App - contains GUI.
|
||||
// This is an example of a new, easy way to do two way bindings between dynamically created GUI and in-world entities.
|
||||
//
|
||||
// Distributed under the Apache License, Version 2.0.
|
||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
//
|
||||
/* global HifiEntityUI, openEventBridge, console, EventBridge, document, window */
|
||||
/* eslint no-console: 0, no-global-assign: 0 */
|
||||
|
||||
(function () {
|
||||
|
||||
var root = document.getElementById("properties-list");
|
||||
|
||||
window.onload = function () {
|
||||
var ui = new HifiEntityUI(root);
|
||||
var textarea = document.createElement("textarea");
|
||||
var properties = "";
|
||||
var menuStructure = {
|
||||
General: [
|
||||
{
|
||||
type: "Row",
|
||||
id: "export-import-field"
|
||||
},
|
||||
{
|
||||
id: "show-properties-button",
|
||||
name: "Show Properties",
|
||||
type: "Button",
|
||||
class: "blue",
|
||||
disabled: true,
|
||||
callback: function (event) {
|
||||
var insertZone = document.getElementById("export-import-field");
|
||||
var json = ui.getSettings();
|
||||
properties = JSON.stringify(json);
|
||||
textarea.value = properties;
|
||||
if (!insertZone.contains(textarea)) {
|
||||
insertZone.appendChild(textarea);
|
||||
insertZone.parentNode.parentNode.style.maxHeight =
|
||||
insertZone.parentNode.clientHeight + "px";
|
||||
document.getElementById("export-properties-button").removeAttribute("disabled");
|
||||
textarea.onchange = function (e) {
|
||||
if (e.target.value !== properties) {
|
||||
document.getElementById("import-properties-button").removeAttribute("disabled");
|
||||
}
|
||||
};
|
||||
textarea.oninput = textarea.onchange;
|
||||
document.getElementById("show-properties-button").value = "Hide Properties";
|
||||
} else {
|
||||
textarea.onchange = function () {};
|
||||
textarea.oninput = textarea.onchange;
|
||||
textarea.value = "";
|
||||
textarea.remove();
|
||||
insertZone.parentNode.parentNode.style.maxHeight =
|
||||
insertZone.parentNode.clientHeight + "px";
|
||||
document.getElementById("export-properties-button").setAttribute("disabled", true);
|
||||
document.getElementById("import-properties-button").setAttribute("disabled", true);
|
||||
document.getElementById("show-properties-button").value = "Show Properties";
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "import-properties-button",
|
||||
name: "Import",
|
||||
type: "Button",
|
||||
class: "blue",
|
||||
disabled: true,
|
||||
callback: function (event) {
|
||||
ui.fillFields(JSON.parse(textarea.value));
|
||||
ui.submitChanges(JSON.parse(textarea.value));
|
||||
}
|
||||
},
|
||||
{
|
||||
id: "export-properties-button",
|
||||
name: "Export",
|
||||
type: "Button",
|
||||
class: "red",
|
||||
disabled: true,
|
||||
callback: function (event) {
|
||||
textarea.select();
|
||||
try {
|
||||
var success = document.execCommand('copy');
|
||||
if (!success) {
|
||||
throw "Not success :(";
|
||||
}
|
||||
} catch (e) {
|
||||
print("couldnt copy field");
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "isEmitting",
|
||||
name: "Is Emitting",
|
||||
type: "Boolean"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "lifespan",
|
||||
name: "Lifespan",
|
||||
type: "SliderFloat",
|
||||
min: 0.01,
|
||||
max: 10
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "maxParticles",
|
||||
name: "Max Particles",
|
||||
type: "SliderInteger",
|
||||
min: 1,
|
||||
max: 10000
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "textures",
|
||||
name: "Textures",
|
||||
type: "Texture"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Emit: [
|
||||
{
|
||||
id: "emitRate",
|
||||
name: "Emit Rate",
|
||||
type: "SliderInteger",
|
||||
max: 1000,
|
||||
min: 1
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "emitSpeed",
|
||||
name: "Emit Speed",
|
||||
type: "SliderFloat",
|
||||
max: 5
|
||||
},
|
||||
{
|
||||
id: "speedSpread",
|
||||
name: "Speed Spread",
|
||||
type: "SliderFloat",
|
||||
max: 5
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "emitDimensions",
|
||||
name: "Emit Dimension",
|
||||
type: "Vector",
|
||||
defaultRange: {
|
||||
min: 0,
|
||||
step: 0.01
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "emitOrientation",
|
||||
unit: "deg",
|
||||
name: "Emit Orientation",
|
||||
type: "VectorQuaternion",
|
||||
defaultRange: {
|
||||
min: 0,
|
||||
step: 0.01
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "emitterShouldTrail",
|
||||
name: "Emitter Should Trail",
|
||||
type: "Boolean"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Radius: [
|
||||
{
|
||||
id: "particleRadius",
|
||||
name: "Particle Radius",
|
||||
type: "SliderFloat",
|
||||
max: 4.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "radiusSpread",
|
||||
name: "Radius Spread",
|
||||
type: "SliderFloat",
|
||||
max: 4.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "radiusStart",
|
||||
name: "Radius Start",
|
||||
type: "SliderFloat",
|
||||
max: 4.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "radiusFinish",
|
||||
name: "Radius Finish",
|
||||
type: "SliderFloat",
|
||||
max: 4.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Color: [
|
||||
{
|
||||
id: "color",
|
||||
name: "Color",
|
||||
type: "Color",
|
||||
defaultColor: {
|
||||
red: 255,
|
||||
green: 255,
|
||||
blue: 255
|
||||
},
|
||||
layoutType: "hex",
|
||||
layoutColorScheme: "dark",
|
||||
useSubmitButton: false
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "colorSpread",
|
||||
name: "Color Spread",
|
||||
type: "Color",
|
||||
defaultColor: {
|
||||
red: 0,
|
||||
green: 0,
|
||||
blue: 0
|
||||
},
|
||||
layoutType: "hex",
|
||||
layoutColorScheme: "dark",
|
||||
useSubmitButton: false
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "colorStart",
|
||||
name: "Color Start",
|
||||
type: "Color",
|
||||
defaultColor: {
|
||||
red: 255,
|
||||
green: 255,
|
||||
blue: 255
|
||||
},
|
||||
layoutType: "hex",
|
||||
layoutColorScheme: "dark",
|
||||
useSubmitButton: false
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "colorFinish",
|
||||
name: "Color Finish",
|
||||
type: "Color",
|
||||
defaultColor: {
|
||||
red: 255,
|
||||
green: 255,
|
||||
blue: 255
|
||||
},
|
||||
layoutType: "hex",
|
||||
layoutColorScheme: "dark",
|
||||
useSubmitButton: false
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Acceleration: [
|
||||
{
|
||||
id: "emitAcceleration",
|
||||
name: "Emit Acceleration",
|
||||
type: "Vector",
|
||||
defaultRange: {
|
||||
step: 0.01
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "accelerationSpread",
|
||||
name: "Acceleration Spread",
|
||||
type: "Vector",
|
||||
defaultRange: {
|
||||
step: 0.01
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Alpha: [
|
||||
{
|
||||
id: "alpha",
|
||||
name: "Alpha",
|
||||
type: "SliderFloat",
|
||||
max: 1.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "alphaSpread",
|
||||
name: "Alpha Spread",
|
||||
type: "SliderFloat",
|
||||
max: 1.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "alphaStart",
|
||||
name: "Alpha Start",
|
||||
type: "SliderFloat",
|
||||
max: 1.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "alphaFinish",
|
||||
name: "Alpha Finish",
|
||||
type: "SliderFloat",
|
||||
max: 1.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Spin: [
|
||||
{
|
||||
id: "particleSpin",
|
||||
name: "Particle Spin",
|
||||
type: "SliderRadian",
|
||||
min: -360.0,
|
||||
max: 360.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "spinSpread",
|
||||
name: "Spin Spread",
|
||||
type: "SliderRadian",
|
||||
max: 360.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "spinStart",
|
||||
name: "Spin Start",
|
||||
type: "SliderRadian",
|
||||
min: -360.0,
|
||||
max: 360.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "spinFinish",
|
||||
name: "Spin Finish",
|
||||
type: "SliderRadian",
|
||||
min: -360.0,
|
||||
max: 360.0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "rotateWithEntity",
|
||||
name: "Rotate with Entity",
|
||||
type: "Boolean"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Polar: [
|
||||
{
|
||||
id: "polarStart",
|
||||
name: "Polar Start",
|
||||
unit: "deg",
|
||||
type: "SliderRadian"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "polarFinish",
|
||||
name: "Polar Finish",
|
||||
unit: "deg",
|
||||
type: "SliderRadian"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
],
|
||||
Azimuth: [
|
||||
{
|
||||
id: "azimuthStart",
|
||||
name: "Azimuth Start",
|
||||
unit: "deg",
|
||||
type: "SliderRadian",
|
||||
min: -180,
|
||||
max: 0
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
},
|
||||
{
|
||||
id: "azimuthFinish",
|
||||
name: "Azimuth Finish",
|
||||
unit: "deg",
|
||||
type: "SliderRadian"
|
||||
},
|
||||
{
|
||||
type: "Row"
|
||||
}
|
||||
]
|
||||
};
|
||||
ui.setUI(menuStructure);
|
||||
ui.setOnSelect(function () {
|
||||
document.getElementById("show-properties-button").removeAttribute("disabled");
|
||||
document.getElementById("export-properties-button").setAttribute("disabled", true);
|
||||
document.getElementById("import-properties-button").setAttribute("disabled", true);
|
||||
});
|
||||
ui.build();
|
||||
var overrideLoad = false;
|
||||
if (openEventBridge === undefined) {
|
||||
overrideLoad = true,
|
||||
openEventBridge = function (callback) {
|
||||
callback({
|
||||
emitWebEvent: function () {},
|
||||
submitChanges: function () {},
|
||||
scriptEventReceived: {
|
||||
connect: function () {
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
openEventBridge(function (EventBridge) {
|
||||
ui.connect(EventBridge);
|
||||
});
|
||||
if (overrideLoad) {
|
||||
openEventBridge();
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
|
@ -1,144 +0,0 @@
|
|||
//
|
||||
// particleExplorerTool.js
|
||||
//
|
||||
// Created by Eric Levin on 2/15/16
|
||||
// Copyright 2016 High Fidelity, Inc.
|
||||
// Adds particleExplorer tool to the edit panel when a user selects a particle entity from the edit tool window
|
||||
// This is an example of a new, easy way to do two way bindings between dynamically created GUI and in-world entities.
|
||||
//
|
||||
// Distributed under the Apache License, Version 2.0.
|
||||
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
|
||||
//
|
||||
/* global ParticleExplorerTool */
|
||||
|
||||
|
||||
var PARTICLE_EXPLORER_HTML_URL = Script.resolvePath('particleExplorer.html');
|
||||
|
||||
ParticleExplorerTool = function(createToolsWindow) {
|
||||
var that = {};
|
||||
that.activeParticleEntity = 0;
|
||||
that.updatedActiveParticleProperties = {};
|
||||
|
||||
that.createWebView = function() {
|
||||
that.webView = Tablet.getTablet("com.highfidelity.interface.tablet.system");
|
||||
that.webView.setVisible = function(value) {};
|
||||
that.webView.webEventReceived.connect(that.webEventReceived);
|
||||
createToolsWindow.webEventReceived.addListener(this, that.webEventReceived);
|
||||
};
|
||||
|
||||
function emitScriptEvent(data) {
|
||||
var messageData = JSON.stringify(data);
|
||||
that.webView.emitScriptEvent(messageData);
|
||||
createToolsWindow.emitScriptEvent(messageData);
|
||||
}
|
||||
|
||||
that.destroyWebView = function() {
|
||||
if (!that.webView) {
|
||||
return;
|
||||
}
|
||||
that.activeParticleEntity = 0;
|
||||
that.updatedActiveParticleProperties = {};
|
||||
|
||||
emitScriptEvent({
|
||||
messageType: "particle_close"
|
||||
});
|
||||
};
|
||||
|
||||
function sendParticleProperties(properties) {
|
||||
emitScriptEvent({
|
||||
messageType: "particle_settings",
|
||||
currentProperties: properties
|
||||
});
|
||||
}
|
||||
|
||||
function sendActiveParticleProperties() {
|
||||
var properties = Entities.getEntityProperties(that.activeParticleEntity);
|
||||
if (properties.emitOrientation) {
|
||||
properties.emitOrientation = Quat.safeEulerAngles(properties.emitOrientation);
|
||||
}
|
||||
// Update uninitialized variables
|
||||
if (isNaN(properties.alphaStart)) {
|
||||
properties.alphaStart = properties.alpha;
|
||||
}
|
||||
if (isNaN(properties.alphaFinish)) {
|
||||
properties.alphaFinish = properties.alpha;
|
||||
}
|
||||
if (isNaN(properties.radiusStart)) {
|
||||
properties.radiusStart = properties.particleRadius;
|
||||
}
|
||||
if (isNaN(properties.radiusFinish)) {
|
||||
properties.radiusFinish = properties.particleRadius;
|
||||
}
|
||||
if (isNaN(properties.colorStart.red)) {
|
||||
properties.colorStart = properties.color;
|
||||
}
|
||||
if (isNaN(properties.colorFinish.red)) {
|
||||
properties.colorFinish = properties.color;
|
||||
}
|
||||
if (isNaN(properties.spinStart)) {
|
||||
properties.spinStart = properties.particleSpin;
|
||||
}
|
||||
if (isNaN(properties.spinFinish)) {
|
||||
properties.spinFinish = properties.particleSpin;
|
||||
}
|
||||
sendParticleProperties(properties);
|
||||
}
|
||||
|
||||
function sendUpdatedActiveParticleProperties() {
|
||||
sendParticleProperties(that.updatedActiveParticleProperties);
|
||||
that.updatedActiveParticleProperties = {};
|
||||
}
|
||||
|
||||
that.webEventReceived = function(message) {
|
||||
var data = JSON.parse(message);
|
||||
if (data.messageType === "settings_update") {
|
||||
var updatedSettings = data.updatedSettings;
|
||||
|
||||
var optionalProps = ["alphaStart", "alphaFinish", "radiusStart", "radiusFinish", "colorStart", "colorFinish", "spinStart", "spinFinish"];
|
||||
var fallbackProps = ["alpha", "particleRadius", "color", "particleSpin"];
|
||||
for (var i = 0; i < optionalProps.length; i++) {
|
||||
var fallbackProp = fallbackProps[Math.floor(i / 2)];
|
||||
var optionalValue = updatedSettings[optionalProps[i]];
|
||||
var fallbackValue = updatedSettings[fallbackProp];
|
||||
if (optionalValue && fallbackValue) {
|
||||
delete updatedSettings[optionalProps[i]];
|
||||
}
|
||||
}
|
||||
|
||||
if (updatedSettings.emitOrientation) {
|
||||
updatedSettings.emitOrientation = Quat.fromVec3Degrees(updatedSettings.emitOrientation);
|
||||
}
|
||||
|
||||
Entities.editEntity(that.activeParticleEntity, updatedSettings);
|
||||
|
||||
var entityProps = Entities.getEntityProperties(that.activeParticleEntity, optionalProps);
|
||||
|
||||
var needsUpdate = false;
|
||||
for (var i = 0; i < optionalProps.length; i++) {
|
||||
var fallbackProp = fallbackProps[Math.floor(i / 2)];
|
||||
var fallbackValue = updatedSettings[fallbackProp];
|
||||
if (fallbackValue) {
|
||||
var optionalProp = optionalProps[i];
|
||||
if ((fallbackProp !== "color" && isNaN(entityProps[optionalProp])) || (fallbackProp === "color" && isNaN(entityProps[optionalProp].red))) {
|
||||
that.updatedActiveParticleProperties[optionalProp] = fallbackValue;
|
||||
needsUpdate = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (needsUpdate) {
|
||||
sendUpdatedActiveParticleProperties();
|
||||
}
|
||||
|
||||
} else if (data.messageType === "page_loaded") {
|
||||
sendActiveParticleProperties();
|
||||
}
|
||||
};
|
||||
|
||||
that.setActiveParticleEntity = function(id) {
|
||||
that.activeParticleEntity = id;
|
||||
sendActiveParticleProperties();
|
||||
};
|
||||
|
||||
return that;
|
||||
};
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue