mirror of
https://github.com/HifiExperiments/overte.git
synced 2025-08-07 01:42:34 +02:00
Add zone properties to entity property panel
This commit is contained in:
parent
3f0d9b7532
commit
4e2bcc0690
1 changed files with 124 additions and 0 deletions
|
@ -182,6 +182,23 @@
|
|||
var elTextBackgroundColorGreen = document.getElementById("property-text-background-color-green");
|
||||
var elTextBackgroundColorBlue = document.getElementById("property-text-background-color-blue");
|
||||
|
||||
var elZoneSections = document.querySelectorAll(".zone-section");
|
||||
var elZoneStageSunModelEnabled = document.getElementById("property-zone-stage-sun-model-enabled");
|
||||
var elZoneKeyLightColorRed = document.getElementById("property-zone-key-light-color-red");
|
||||
var elZoneKeyLightColorGreen = document.getElementById("property-zone-key-light-color-green");
|
||||
var elZoneKeyLightColorBlue = document.getElementById("property-zone-key-light-color-blue");
|
||||
var elZoneKeyLightIntensity = document.getElementById("property-zone-key-color-intensity");
|
||||
var elZoneKeyLightAmbientIntensity = document.getElementById("property-zone-key-color-ambient-intensity");
|
||||
var elZoneKeyLightDirectionX = document.getElementById("property-zone-key-light-direction-x");
|
||||
var elZoneKeyLightDirectionY = document.getElementById("property-zone-key-light-direction-y");
|
||||
var elZoneKeyLightDirectionZ = document.getElementById("property-zone-key-light-direction-z");
|
||||
|
||||
var elZoneStageLatitude = document.getElementById("property-zone-stage-latitude");
|
||||
var elZoneStageLongitude = document.getElementById("property-zone-stage-longitude");
|
||||
var elZoneStageAltitude = document.getElementById("property-zone-stage-altitude");
|
||||
var elZoneStageDay = document.getElementById("property-zone-stage-day");
|
||||
var elZoneStageHour = document.getElementById("property-zone-stage-hour");
|
||||
|
||||
if (window.EventBridge !== undefined) {
|
||||
EventBridge.scriptEventReceived.connect(function(data) {
|
||||
data = JSON.parse(data);
|
||||
|
@ -356,6 +373,32 @@
|
|||
elLightCutoff.value = properties.cutoff;
|
||||
}
|
||||
|
||||
if (properties.type != "Zone") {
|
||||
for (var i = 0; i < elZoneSections.length; i++) {
|
||||
elZoneSections[i].style.display = 'none';
|
||||
}
|
||||
} else {
|
||||
for (var i = 0; i < elZoneSections.length; i++) {
|
||||
elZoneSections[i].style.display = 'block';
|
||||
}
|
||||
|
||||
elZoneStageSunModelEnabled.checked = properties.stageSunModelEnabled;
|
||||
elZoneKeyLightColorRed.value = properties.keyLightColor.red;
|
||||
elZoneKeyLightColorGreen.value = properties.keyLightColor.green;
|
||||
elZoneKeyLightColorBlue.value = properties.keyLightColor.blue;
|
||||
elZoneKeyLightIntensity.value = properties.keyLightIntensity;
|
||||
elZoneKeyLightAmbientIntensity.value = properties.keyLightAmbientIntensity;
|
||||
elZoneKeyLightDirectionX.value = properties.keyLightDirection.x.toFixed(2);
|
||||
elZoneKeyLightDirectionY.value = properties.keyLightDirection.y.toFixed(2);
|
||||
elZoneKeyLightDirectionZ.value = properties.keyLightDirection.z.toFixed(2);
|
||||
|
||||
elZoneStageLatitude.value = properties.stageLatitude.toFixed(2);
|
||||
elZoneStageLongitude.value = properties.stageLongitude.toFixed(2);
|
||||
elZoneStageAltitude.value = properties.stageAltitude.toFixed(2);
|
||||
elZoneStageDay.value = properties.stageDay;
|
||||
elZoneStageHour.value = properties.stageHour;
|
||||
}
|
||||
|
||||
if (selected) {
|
||||
activeElement.focus();
|
||||
activeElement.select();
|
||||
|
@ -468,6 +511,26 @@
|
|||
elTextBackgroundColorGreen.addEventListener('change', textBackgroundColorChangeFunction);
|
||||
elTextBackgroundColorBlue.addEventListener('change', textBackgroundColorChangeFunction);
|
||||
|
||||
elZoneStageSunModelEnabled.addEventListener('change', createEmitCheckedPropertyUpdateFunction('stageSunModelEnabled'));
|
||||
var zoneKeyLightColorChangeFunction = createEmitColorPropertyUpdateFunction(
|
||||
'keyLightColor', elZoneKeyLightColorRed, elZoneKeyLightColorGreen, elZoneKeyLightColorBlue);
|
||||
elZoneKeyLightColorRed.addEventListener('change', zoneKeyLightColorChangeFunction);
|
||||
elZoneKeyLightColorGreen.addEventListener('change', zoneKeyLightColorChangeFunction);
|
||||
elZoneKeyLightColorBlue.addEventListener('change', zoneKeyLightColorChangeFunction);
|
||||
elZoneKeyLightIntensity.addEventListener('change', createEmitNumberPropertyUpdateFunction('keyLightIntensity'));
|
||||
elZoneKeyLightAmbientIntensity.addEventListener('change', createEmitNumberPropertyUpdateFunction('keyLightAmbientIntensity'));
|
||||
var zoneKeyLightDirectionChangeFunction = createEmitVec3PropertyUpdateFunction(
|
||||
'keyLightDirection', elZoneKeyLightDirectionX, elZoneKeyLightDirectionY, elZoneKeyLightDirectionZ);
|
||||
elZoneKeyLightDirectionX.addEventListener('change', zoneKeyLightDirectionChangeFunction);
|
||||
elZoneKeyLightDirectionY.addEventListener('change', zoneKeyLightDirectionChangeFunction);
|
||||
elZoneKeyLightDirectionZ.addEventListener('change', zoneKeyLightDirectionChangeFunction);
|
||||
|
||||
elZoneStageLatitude.addEventListener('change', createEmitNumberPropertyUpdateFunction('stageLatitude'));
|
||||
elZoneStageLongitude.addEventListener('change', createEmitNumberPropertyUpdateFunction('stageLongitude'));
|
||||
elZoneStageAltitude.addEventListener('change', createEmitNumberPropertyUpdateFunction('stageAltitude'));
|
||||
elZoneStageDay.addEventListener('change', createEmitNumberPropertyUpdateFunction('stageDay'));
|
||||
elZoneStageHour.addEventListener('change', createEmitNumberPropertyUpdateFunction('stageHour'));
|
||||
|
||||
elMoveSelectionToGrid.addEventListener("click", function() {
|
||||
EventBridge.emitWebEvent(JSON.stringify({
|
||||
type: "action",
|
||||
|
@ -833,6 +896,67 @@
|
|||
<input class="coord" type='number' id="property-light-cutoff"></input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="zone-section property">
|
||||
<span class="label">Stage Sun Model Enabled</span>
|
||||
<span class="value">
|
||||
<input type='checkbox' id="property-zone-stage-sun-model-enabled">
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="zone-section property">
|
||||
<div class="label">Key Color</div>
|
||||
<div class="value">
|
||||
<div class="input-area">R <input class="coord" type='number' id="property-zone-key-light-color-red"></input></div>
|
||||
<div class="input-area">G <input class="coord" type='number' id="property-zone-key-light-color-green"></input></div>
|
||||
<div class="input-area">B <input class="coord" type='number' id="property-zone-key-light-color-blue"></input></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Key Intensity</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-key-color-intensity"></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Key Direction</div>
|
||||
<div class="value">
|
||||
<div class="input-area">Pitch <input class="coord" type='number' id="property-zone-key-light-direction-x"></input></div>
|
||||
<div class="input-area">Yaw <input class="coord" type='number' id="property-zone-key-light-direction-y"></input></div>
|
||||
<div class="input-area">Roll <input class="coord" type='number' id="property-zone-key-light-direction-z"></input></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="zone-section property">
|
||||
<div class="label">Stage Latitude</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-stage-latitude"></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Stage Longitude</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-stage-longitude"></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Stage Altitude</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-stage-altitude"></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Stage Day</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-stage-day"></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="zone-section property">
|
||||
<div class="label">Stage Hour</div>
|
||||
<div class="value">
|
||||
<input class="coord" type='number' id="property-zone-stage-hour"></input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
|
Loading…
Reference in a new issue