114 lines
3.8 KiB
JavaScript
114 lines
3.8 KiB
JavaScript
|
|
saveFormToCookieEvent = (() => {
|
|
|
|
function setCookie(name, value, days) {
|
|
let expires = "";
|
|
if (days) {
|
|
const date = new Date();
|
|
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
|
expires = "; expires=" + date.toUTCString();
|
|
}
|
|
document.cookie = name + "=" + encodeURIComponent(value) + expires + "; path=/";
|
|
}
|
|
|
|
function getCookie(name) {
|
|
const nameEQ = name + "=";
|
|
const ca = document.cookie.split(';');
|
|
for (let i = 0; i < ca.length; i++) {
|
|
let c = ca[i];
|
|
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
|
|
if (c.indexOf(nameEQ) == 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
|
|
}
|
|
return null;
|
|
}
|
|
|
|
function saveFormToCookie(form) {
|
|
const formData = new FormData(form);
|
|
for (let element of form.elements) {
|
|
if (element.id) {
|
|
//console.log("Saving " + element.id)
|
|
if (element.type === 'checkbox') {
|
|
//console.log("Checkbox " + element.checked)
|
|
setCookie(element.id, element.checked ? 'true' : 'false', 7);
|
|
} else if (element.type === 'radio') {
|
|
if (element.checked) {
|
|
//console.log("Set cookie " + element.id + " " + element.value)
|
|
setCookie(element.id, element.value, 7);
|
|
} else {
|
|
//console.log("Set cookie " + element.id + " EMPTY")
|
|
setCookie(element.id, "", 7)
|
|
}
|
|
} else {
|
|
setCookie(element.id, element.value, 7);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
let saveFormToCookieEvent = function(evt) {
|
|
//console.log("save form to cookie: " + evt.target)
|
|
form = evt.target
|
|
saveFormToCookie(form)
|
|
}
|
|
|
|
function loadFormFromCookie(form) {
|
|
//console.log("Load form from cookie")
|
|
if (!form) {
|
|
return
|
|
}
|
|
let updated = false
|
|
for (let element of form.elements) {
|
|
if (element.id) {
|
|
const value = getCookie(element.id);
|
|
//console.log("Loading " + element.id + " value: " + value)
|
|
if (value !== null) {
|
|
if (element.type === 'checkbox') {
|
|
let newvalue = value === "true"
|
|
if (element.checked != newvalue) {
|
|
element.checked = newvalue
|
|
updated = true
|
|
}
|
|
} else if (element.type === 'radio') {
|
|
let newvalue = element.value === value
|
|
if (element.checked != newvalue) {
|
|
element.checked = newvalue;
|
|
updated = true
|
|
}
|
|
} else {
|
|
if (element.value != value) {
|
|
element.value = value;
|
|
updated = true
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
if (updated) {
|
|
htmx.trigger(form, 'formdataloaded')
|
|
}
|
|
}
|
|
|
|
function getPersistentForms() {
|
|
return document.getElementsByClassName("persistent-form");
|
|
}
|
|
|
|
function loadFormsFromCookie() {
|
|
let forms = getPersistentForms();
|
|
for (let i = 0; i < forms.length; i++) {
|
|
loadFormFromCookie(forms[i])
|
|
}
|
|
}
|
|
|
|
htmx.on('htmx:load', function (event) {
|
|
//console.log("htmx:load")
|
|
loadFormsFromCookie();
|
|
});
|
|
|
|
htmx.on('htmx:afterSettle', function (event) {
|
|
//console.log("htmx:afterSettle")
|
|
loadFormsFromCookie();
|
|
});
|
|
|
|
return saveFormToCookieEvent
|
|
})()
|