rkgk/static/welcome.js

43 lines
1.5 KiB
JavaScript
Raw Normal View History

2024-08-10 23:13:20 +02:00
export class Welcome extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.welcomeDialog = this.querySelector("dialog[name='welcome-dialog']");
this.welcomeForm = this.welcomeDialog.querySelector("form");
2024-08-10 23:13:20 +02:00
this.nicknameField = this.querySelector("input[name='nickname']");
this.registerButton = this.querySelector("button[name='register']");
this.registerProgress = this.querySelector("rkgk-throbber[name='register-progress']");
// Once the dialog is open, you need an account to use the website.
this.welcomeDialog.addEventListener("cancel", (event) => event.preventDefault());
}
show({ onRegister }) {
let resolvePromise;
let promise = new Promise((resolve) => (resolvePromise = resolve));
2024-08-10 23:13:20 +02:00
this.welcomeDialog.showModal();
2024-08-10 23:13:20 +02:00
let submitListener = async (event) => {
event.preventDefault();
2024-08-10 23:13:20 +02:00
this.registerProgress.beginLoading();
let response = await onRegister(this.nicknameField.value);
if (response.status == "ok") {
this.welcomeDialog.close();
resolvePromise();
} else {
this.registerProgress.showError(response.message);
}
this.welcomeForm.removeEventListener("submit", submitListener);
};
this.welcomeForm.addEventListener("submit", submitListener);
2024-08-10 23:13:20 +02:00
return promise;
2024-08-10 23:13:20 +02:00
}
}
customElements.define("rkgk-welcome", Welcome);