1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
8. 8
9. 9
10. 10
11. 11
12. 12
13. 13
14. 14
15. 15
16. 16
17. 17
18. 18
19. 19
20. 20
21. 21
22. 22
23. 23
24. 24
25. 25
26. 26
27. 27
28. 28
29. 29
30. 30
31. 31
32. 32
33. 33
34. 34
35. 35
36. 36
37. 37
38. 38
39. 39
40. 40
41. 41
42. 42
43. 43
44. 44
45. 45
46. 46
47. 47
48. 48
49. 49
50. 50
51. 51
52. 52
53. 53
54. 54
55. 55
56. 56
57. 57
58. 58
59. 59
60. 60
61. 61
62. 62
63. 63
64. 64
65. 65
66. 66
67. 67
68. 68
69. 69
70. 70
71. 71
72. 72

let fallbackFunc = ()=>console.log("Hello, World!");
let settings = {
    fallbackButtonName: "Hello, World!",
    fallbackWidth: 512,
    fallbackHeight: 512,
    settingsMenuExitButtonHeight: 32,
    settingsMenuExitButtonName: "X",
    settingElementHeight: 32,
    settingsMenuExitButtonAtBeginning: true,
    settingElementTrueName: "ON",
    settingElementFalseName: "OFF",
    settingsMenuBooleanSeperatorName: "- $",
    hideExtraButtonsToolbar: true,
    updateToolbar: updateToolbar,
    updateSettingsMenu: updateSettingsMenu,
    activateFallbackFunc: fallbackFunc
};

let settingsMenu = document.getElementById("settings");
let settingsElement = document.querySelector(".setting-element#hide");

// -------------------------------------------------------------------

function updateSettingsMenu() {
    settingsMenu.innerHTML = "";
    let exitButton = document.createElement("button");
    exitButton.style.height = settings.settingsMenuExitButtonHeight+"px";
    exitButton.innerText = settings.settingsMenuExitButtonName;
    exitButton.onclick = function() {
        settingsMenu.style.display = "none";
    }

    if (settings.settingsMenuExitButtonAtBeginning) settingsMenu.appendChild(exitButton);
    for (let k in settings) {
        let v = settings[k];

        let setting = settingsElement.cloneNode(true);
        setting.id = "";
        console.log(setting)
        setting.style.height = settings.settingElementHeight+"px";
        let [name,value] = setting.children;
        if (typeof v !== "function") {
            name.innerText = k;
            function booleanToString(bool) {
                return (bool?settings.settingsMenuBooleanSeperatorName.replaceAll("$",settings.settingElementTrueName):settings.settingsMenuBooleanSeperatorName.replaceAll("$",settings.settingElementFalseName))
            }
            value.innerText = (typeof v === "boolean")?booleanToString(v):v;
            value.onclick = function() {
                if (typeof v === "boolean") {
                    settings[k] = !settings[k];
                    value.innerText = booleanToString(settings[k]);
                } else {
                    let input = prompt(`New value for ${k}:`);
                    let newValue = isNaN(input)?input:Number(input);
                    value.innerText = newValue;
                    settings[k] = newValue
                }
            }
        } else {
            name.remove()
            value.innerText = k;
            value.onclick = v;
        }

        settingsMenu.appendChild(setting);
    }
    if (!settings.settingsMenuExitButtonAtBeginning) settingsMenu.appendChild(exitButton);
}
function showSettings() {
    settingsMenu.style.display = "flex";
    updateSettingsMenu();
}