diff --git a/src/gui/options/options.js b/src/gui/options/options.js index ce2ac0d11c8185047def6ae2d36dd40bdac643e4..93bcd1aa0fb5fbe20d64ed1daebb90e03b7eae06 100644 --- a/src/gui/options/options.js +++ b/src/gui/options/options.js @@ -204,60 +204,86 @@ App.UI.OptionsGroup = (function() { const buttonGroup = document.createElement("div"); buttonGroup.classList.add("button-group"); - for (const value of option.valuePairs) { - if (value.mode === "plain") { - /* insert custom SC markup and go to next element */ - $(buttonGroup).wiki(value.value); - continue; - } - const button = document.createElement("button"); - button.append(value.name); - if (value.on) { - button.classList.add("on"); - } else if (value.off) { - button.classList.add("off"); - } else if (value.neutral) { - button.classList.add("neutral"); - } - if (value.mode === "custom") { - button.onclick = () => { - value.callback(); - if (value.value) { - Engine.play(value.value); - } else { - App.UI.reload(); - } - }; - } else { - if (value.mode === "=" && currentValue === value.value) { - button.classList.add("selected", "disabled"); - anySelected = true; - if (value.descAppend !== undefined) { - desc.append(" "); - $(desc).wiki(value.descAppend); - } - } else if (!anySelected && inRange(value.mode, value.compareValue, currentValue)) { - button.classList.add("selected"); - // disable the button if clicking it won't change the variable value - if (currentValue === value.value) { - button.classList.add("disabled"); - } - anySelected = true; - if (value.descAppend !== undefined) { - desc.append(" "); - $(desc).wiki(value.descAppend); - } + if (option.valuePairs.length < 6) { + for (const value of option.valuePairs) { + if (value.mode === "plain") { + /* insert custom SC markup and go to next element */ + $(buttonGroup).wiki(value.value); + continue; + } + const button = document.createElement("button"); + button.append(value.name); + if (value.on) { + button.classList.add("on"); + } else if (value.off) { + button.classList.add("off"); + } else if (value.neutral) { + button.classList.add("neutral"); } - button.onclick = () => { - option.object[option.property] = value.value; - if (value.callback) { + if (value.mode === "custom") { + button.onclick = () => { value.callback(); + if (value.value) { + Engine.play(value.value); + } else { + App.UI.reload(); + } + }; + } else { + if (value.mode === "=" && currentValue === value.value) { + button.classList.add("selected", "disabled"); + anySelected = true; + if (value.descAppend !== undefined) { + desc.append(" "); + $(desc).wiki(value.descAppend); + } + } else if (!anySelected && inRange(value.mode, value.compareValue, currentValue)) { + button.classList.add("selected"); + // disable the button if clicking it won't change the variable value + if (currentValue === value.value) { + button.classList.add("disabled"); + } + anySelected = true; + if (value.descAppend !== undefined) { + desc.append(" "); + $(desc).wiki(value.descAppend); + } } - App.UI.reload(); - }; + button.onclick = () => { + option.object[option.property] = value.value; + if (value.callback) { + value.callback(); + } + App.UI.reload(); + }; + } + buttonGroup.append(button); + } + } else { + let select = document.createElement("select"); + select.classList.add("rajs-list"); + + for (const value of option.valuePairs) { + let el = document.createElement("option"); + el.textContent = value.name; + el.value = value.value; + if (option.object[option.property] === value.value) { + el.selected = true; + } + select.appendChild(el); + console.log(option); } - buttonGroup.append(button); + select.onchange = () => { + const O = select.options[select.selectedIndex]; + if (Number(O.value)) { + option.object[option.property] = Number(O.value); + } else { + option.object[option.property] = O.value; + } + }; + buttonGroup.append(select); } + if (option.textbox) { const isNumber = typeof currentValue === "number"; const textbox = App.UI.DOM.makeTextBox(currentValue, input => {