mirror of
https://github.com/overte-org/overte.git
synced 2025-04-08 08:14:48 +02:00
Add a new Zone Selector HDM compliant
Add a new Zone Selector HDM compliant for renderWithZones. The previous selector wasn't usable in HMD and it was pratically the last component that forced us to remove our headset to complete the task.
This commit is contained in:
parent
1c2ea1571c
commit
77d9160077
1 changed files with 23 additions and 12 deletions
|
@ -3695,20 +3695,20 @@ function requestZoneList() {
|
|||
}));
|
||||
}
|
||||
|
||||
function addZoneToZonesSelection(propertyId) {
|
||||
function addZoneToZonesSelection(propertyId, id) {
|
||||
let hiddenField = document.getElementById(propertyId);
|
||||
if (JSON.stringify(hiddenField.value) === '"undefined"') {
|
||||
hiddenField.value = "[]";
|
||||
}
|
||||
let selectedZones = JSON.parse(hiddenField.value);
|
||||
let zoneToAdd = document.getElementById("zones-select-" + propertyId).value;
|
||||
if (!selectedZones.includes(zoneToAdd)) {
|
||||
selectedZones.push(zoneToAdd);
|
||||
if (!selectedZones.includes(id)) {
|
||||
selectedZones.push(id);
|
||||
}
|
||||
hiddenField.value = JSON.stringify(selectedZones);
|
||||
displaySelectedZones(propertyId, true);
|
||||
let propertyName = propertyId.replace("property-", "");
|
||||
updateProperty(propertyName, selectedZones, false);
|
||||
document.getElementById("zones-select-selector-list-panel-" + propertyId).style.display = "none";
|
||||
}
|
||||
|
||||
function removeZoneFromZonesSelection(propertyId, zoneId) {
|
||||
|
@ -3798,7 +3798,12 @@ function createZonesSelection(property, elProperty) {
|
|||
|
||||
function setZonesSelectionData(element, isEditable) {
|
||||
let zoneSelectorContainer = document.getElementById("zones-selector-" + element.id);
|
||||
let zoneSelector = "<div class='multiZoneSelToolbar' id='multiZoneSelTools-" + element.id + "'><select class = 'zoneSelect' id='zones-select-" + element.id + "' >";
|
||||
let zoneSelector = "<div class='multiZoneSelToolbar' id='multiZoneSelTools-" + element.id + "'>";
|
||||
zoneSelector += "<input type='button' value = 'Add a zone' class='secondary' id='zones-select-add-" + element.id + "' onClick='document.getElementById(";
|
||||
zoneSelector += '"' + "zones-select-selector-list-panel-" + element.id + '"' + ").style.display = " + '"' + "block" + '"' + ";'>";
|
||||
zoneSelector += "<div class = 'zoneSelectorListPanel' id='zones-select-selector-list-panel-" + element.id + "'>";
|
||||
zoneSelector += "<div class='zoneSelectListHeader'>Select the Zone to add: </div>";
|
||||
zoneSelector += "<div class='zoneSelectList' id = 'zones-select-selector-list-" + element.id + "'>";
|
||||
let i, name;
|
||||
for (i = 0; i < zonesList.length; i++) {
|
||||
if (zonesList[i].name === "") {
|
||||
|
@ -3806,28 +3811,34 @@ function setZonesSelectionData(element, isEditable) {
|
|||
} else {
|
||||
name = zonesList[i].name;
|
||||
}
|
||||
zoneSelector += "<option value='" + zonesList[i].id + "'>" + name + "</option>";
|
||||
zoneSelector += "<button class='menu-button' onClick='addZoneToZonesSelection(";
|
||||
zoneSelector += '"' + element.id + '"' + ", " + '"' + zonesList[i].id + '"' + ");'>" + name + "</button><br>";
|
||||
}
|
||||
zoneSelector += "</select> <a href='#' id='zones-select-add-" + element.id + "' onClick='addZoneToZonesSelection(" + '"' + element.id + '"' + ");' >";
|
||||
zoneSelector += "<img style='vertical-align:top' src='../../../html/css/img/add_icon.png'></a></div>";
|
||||
zoneSelector += "</div>";
|
||||
zoneSelector += "<div class='zoneSelectListFooter'>";
|
||||
zoneSelector += "<input type='button' value = 'Cancel' class='normal' id='zones-select-cancel-" + element.id + "' onClick='document.getElementById(";
|
||||
zoneSelector += '"' + "zones-select-selector-list-panel-" + element.id + '"' + ").style.display = " + '"' + "none" + '"' + ";'>";
|
||||
zoneSelector += "</div></div></div>";
|
||||
zoneSelector += "<div class='selected-zone-container' id='selected-zones-" + element.id + "'></div>";
|
||||
zoneSelectorContainer.innerHTML = zoneSelector;
|
||||
displaySelectedZones(element.id, isEditable);
|
||||
}
|
||||
|
||||
function updateAllZoneSelect() {
|
||||
let allZoneSelects = document.querySelectorAll(".zoneSelect");
|
||||
let i, j, name, propId;
|
||||
let allZoneSelects = document.querySelectorAll(".zoneSelectList");
|
||||
let i, j, name, propId, btnList;
|
||||
for (i = 0; i < allZoneSelects.length; i++) {
|
||||
allZoneSelects[i].options.length = 0;
|
||||
btnList = "";
|
||||
for (j = 0; j < zonesList.length; j++) {
|
||||
if (zonesList[j].name === "") {
|
||||
name = zonesList[j].id;
|
||||
} else {
|
||||
name = zonesList[j].name;
|
||||
}
|
||||
allZoneSelects[i].options[j] = new Option(name, zonesList[j].id, false , false);
|
||||
btnList += "<button class='menu-button' onClick='addZoneToZonesSelection(";
|
||||
btnList += '"' + element.id + '"' + ", " + '"' + zonesList[j].id + '"' + ");'>" + name + "</button><br>";
|
||||
}
|
||||
allZoneSelects[i].innerHTML = btnList;
|
||||
propId = allZoneSelects[i].id.replace("zones-select-", "");
|
||||
if (document.getElementById("multiZoneSelTools-" + propId).style.display === "block") {
|
||||
displaySelectedZones(propId, true);
|
||||
|
|
Loading…
Reference in a new issue