Tweaks for login/registration and base + image roundness #25

Merged
retoor merged 9 commits from BordedDev/snek:main into main 2025-03-08 18:53:03 +00:00
Conversation 0 Commits 9 Files Changed 6 +24 -6
1 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 804556b74d - Show all commits

30
src/snek/static/generic-form.js
View File

@ -62,7 +62,7 @@ class GenericField extends HTMLElement {
constructor() { constructor() {
super(); super();
this.attachShadow({ mode: 'open' }); this.attachShadow({mode: 'open'});
this.container = document.createElement('div'); this.container = document.createElement('div');
this.styleElement = document.createElement('style'); this.styleElement = document.createElement('style');
this.styleElement.innerHTML = ` this.styleElement.innerHTML = `
@ -165,18 +165,26 @@ class GenericField extends HTMLElement {
const me = this; const me = this;
this.inputElement.addEventListener("keyup", (e) => { this.inputElement.addEventListener("keyup", (e) => {
if (e.key === 'Enter') { if (e.key === 'Enter') {
const event = new CustomEvent("change", {detail: me, bubbles: true});
me.dispatchEvent(event);
me.dispatchEvent(new Event("submit")); me.dispatchEvent(new Event("submit"));
} else if (me.field.value !== e.target.value) { } else if (me.field.value !== e.target.value) {
const event = new CustomEvent("change", { detail: me, bubbles: true }); const event = new CustomEvent("change", {detail: me, bubbles: true});
me.dispatchEvent(event); me.dispatchEvent(event);
} }
}); });
this.inputElement.addEventListener("click", (e) => { this.inputElement.addEventListener("click", (e) => {
const event = new CustomEvent("click", { detail: me, bubbles: true }); const event = new CustomEvent("click", {detail: me, bubbles: true});
me.dispatchEvent(event); me.dispatchEvent(event);
}); });
this.inputElement.addEventListener("blur", (e) => {
const event = new CustomEvent("change", {detail: me, bubbles: true});
me.dispatchEvent(event);
}, true);
this.container.appendChild(this.inputElement); this.container.appendChild(this.inputElement);
} }
@ -226,7 +234,7 @@ class GenericForm extends HTMLElement {
constructor() { constructor() {
super(); super();
this.attachShadow({ mode: 'open' }); this.attachShadow({mode: 'open'});
this.styleElement = document.createElement("style"); this.styleElement = document.createElement("style");
this.styleElement.innerHTML = ` this.styleElement.innerHTML = `
@ -307,6 +315,16 @@ class GenericForm extends HTMLElement {
} }
} }
}); });
fieldElement.addEventListener("submit", async (e) => {
const isValid = await this.validate();
if (isValid) {
const saveResult = await this.submit();
if (saveResult.redirect_url) {
window.location.pathname = saveResult.redirect_url;
}
}
})
}); });
} catch (error) { } catch (error) {
@ -322,7 +340,7 @@ class GenericForm extends HTMLElement {
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
}, },
body: JSON.stringify({ "action": "validate", "form": this.form }) body: JSON.stringify({"action": "validate", "form": this.form})
}); });
const form = await response.json(); const form = await response.json();
@ -353,7 +371,7 @@ class GenericForm extends HTMLElement {
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
}, },
body: JSON.stringify({ "action": "submit", "form": this.form }) body: JSON.stringify({"action": "submit", "form": this.form})
}); });
return await response.json(); return await response.json();
} }