diff --git a/html/app.js b/html/app.js index eb05b23..e8671bb 100644 --- a/html/app.js +++ b/html/app.js @@ -858,6 +858,11 @@ export class SingerClient extends EventTarget { }); } + updateUserName(newUserName) { + this.username = newUserName; + this.connection.updateUserName(newUserName); + } + get speakerMuted() { return this.speakerMuted_; } @@ -1188,6 +1193,10 @@ export class SingerClientConnection { this.running = true; } + updateUserName(newUserName) { + this.username = newUserName; + } + async start_singing() { return this.server_connection.start(); } diff --git a/html/demo.js b/html/demo.js index 4232f32..66044e5 100644 --- a/html/demo.js +++ b/html/demo.js @@ -1759,6 +1759,18 @@ window.headerExpandCollapse.addEventListener("click", () => { window.headerExpandCollapse.innerHTML = headerCollapsed ? "↓" : "↑"; }); +window.changeNameButton.addEventListener("click", () => { + window.userName.value = window.changeName.value; + localStorage.setItem("userName", window.userName.value); + if (singer_client) { + singer_client.updateUserName(window.userName.value); + } +}); +window.userName.addEventListener("change", () => { + window.changeName.value = window.userName.value; +}); +window.changeName.value = window.userName.value; + document.querySelectorAll("#tutorial_questions button").forEach( (button) => button.addEventListener("click", () => tutorial_answer(button))); diff --git a/html/index.html b/html/index.html index ca3ce7a..862da6e 100644 --- a/html/index.html +++ b/html/index.html @@ -931,6 +931,11 @@