jevsnes.git / third-party / rust / jgenesis / frontend / jgenesis-web / js / ui.js
ui.jsannotatedui.jssource187 lines · 4.9 KB · raw
1export function showUi() {
2    document.getElementById("loading-text").remove();
3    document.getElementById("header-text").classList.remove("hidden");
4    document.getElementById("jgenesis").classList.remove("hidden");
5    document.getElementById("footer").hidden = false;
6}

@param fullscreen {boolean}

11export function setFullscreen(fullscreen) {
12    document.querySelectorAll(".hide-fullscreen").forEach((element) => {
13        element.hidden = fullscreen;
14    });
15}

17export function focusCanvas() {
18    document.querySelector("canvas").focus();
19}
20
21const configIds = ["smsgg-config", "genesis-config", "snes-config", "gba-config"];

@param id {string}

26function hideAllConfigsExcept(id) {
27    for (const configId of configIds) {
28        document.getElementById(configId).hidden = configId !== id;
29    }
30
31    document.getElementById("supported-files-info").hidden = true;
32    document.getElementById("input-config").hidden = false;
33}

@param inputNames {string[]} @param inputKeys {string[]}

39function renderInputs(inputNames, inputKeys) {
40    const listNode = document.createElement("ul");
41
42    for (const [i, name] of inputNames.entries()) {
43        const key = inputKeys[i];
44
45        const span = document.createElement("span");
46        span.innerText = `${name}: `;
47
48        const button = document.createElement("input");
49        button.classList.add("input-configure");
50        button.setAttribute("name", "input-configure");
51        button.setAttribute("type", "button");
52        button.setAttribute("value", key);
53        button.setAttribute("data-name", name);
54
55        if (window.inputClickListener) {
56            button.addEventListener("click", window.inputClickListener);
57        }
58
59        const listItem = document.createElement("li");
60        listItem.appendChild(span);
61        listItem.appendChild(button);
62        listNode.appendChild(listItem);
63    }
64
65    const controls = document.getElementById("controls");
66    controls.innerHTML = "";
67    controls.appendChild(listNode);
68}

@param inputNames {string[]} @param inputKeys {string[]}

74export function showSmsGgConfig(inputNames, inputKeys) {
75    hideAllConfigsExcept("smsgg-config");
76    renderInputs(inputNames, inputKeys);
77}

@param inputNames {string[]} @param inputKeys {string[]}

83export function showGenesisConfig(inputNames, inputKeys) {
84    hideAllConfigsExcept("genesis-config");
85    renderInputs(inputNames, inputKeys);
86}

@param inputNames {string[]} @param inputKeys {string[]}

92export function showSnesConfig(inputNames, inputKeys) {
93    hideAllConfigsExcept("snes-config");
94    renderInputs(inputNames, inputKeys);
95}

@param inputNames {string[]} @param inputKeys {string[]}

101export function showGbaConfig(inputNames, inputKeys) {
102    hideAllConfigsExcept("gba-config");
103    renderInputs(inputNames, inputKeys);
104}

@param visible {boolean}

109export function setCursorVisible(visible) {
110    let canvas = document.querySelector("canvas");
111    if (visible) {
112        canvas.classList.remove("cursor-hidden");
113    } else {
114        canvas.classList.add("cursor-hidden");
115    }
116}

@param romTitle {string}

121export function setRomTitle(romTitle) {
122    document.getElementById("jgenesis-rom-title").innerText = romTitle;
123}

@param saveUiEnabled {boolean}

128export function setSaveUiEnabled(saveUiEnabled) {
129    let saveButtons = document.getElementsByClassName("save-button");
130    if (saveUiEnabled) {
131        for (let i = 0; i < saveButtons.length; i++) {
132            saveButtons[i].removeAttribute("disabled");
133        }
134    } else {
135        for (let i = 0; i < saveButtons.length; i++) {
136            saveButtons[i].setAttribute("disabled", "");
137        }
138    }
139}

141export function beforeInputConfigure() {
142    for (const element of document.getElementsByClassName("input-configure")) {
143        element.disabled = true;
144    }
145
146    document.getElementById("jgenesis-wasm").classList.add("darken");
147}

@param name {string} @param key {string}

153export function afterInputConfigure(name, key) {
154    for (const element of document.getElementsByClassName("input-configure")) {
155        element.disabled = false;
156
157        if (element.getAttribute("data-name") === name) {
158            element.setAttribute("value", key);
159        }
160    }
161
162    document.getElementById("jgenesis-wasm").classList.remove("darken");
163}

165export function showWebGpuUnsupportedMessage() {
166    document.getElementById("loading-text").innerHTML = (
167        '<p><a href="https://webgpu.org/">WebGPU</a> browser support is required</p>' +
168        '<p>An older version that uses WebGL is available <a href="https://jsgroth.dev/jgenesis-webgl/">here</a></p>'
169    );
170}

@param key {string} @return {string | null}

176export function localStorageGet(key) {
177    return localStorage.getItem(key);
178}

@param key {string} @param value {string}

184export function localStorageSet(key, value) {
185    localStorage.setItem(key, value);
186}