Merge pull request #14441 from loma-one/loma-one-patch-5

Saving the post content using localstorage
This commit is contained in:
Michael Vogel 2024-09-19 07:34:35 +02:00 committed by GitHub
commit c30b901110
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -130,30 +130,92 @@
}); });
}); });
function togglePermissions() { function togglePermissions() {
var permissionsSection = document.getElementById('permissions-section'); var permissionsSection = document.getElementById('permissions-section');
if (permissionsSection.style.display === 'none' || permissionsSection.style.display === '') { if (permissionsSection.style.display === 'none' || permissionsSection.style.display === '') {
permissionsSection.style.display = 'block'; permissionsSection.style.display = 'block';
} else { } else {
permissionsSection.style.display = 'none'; permissionsSection.style.display = 'none';
} }
} }
// Warn the user before leaving the page // Warn the user before leaving the page
var formSubmitting = false; var formSubmitting = false;
function setFormSubmitting() { function setFormSubmitting() {
formSubmitting = true; formSubmitting = true;
} }
window.addEventListener("beforeunload", function (event) { document.addEventListener("DOMContentLoaded", function() {
if (!formSubmitting) { var textareas = document.querySelectorAll(".expandable-textarea");
var confirmationMessage = 'Are you sure you want to reload the page? All unsaved changes will be lost.';
event.returnValue = confirmationMessage;
return confirmationMessage;
}
});
// Set the formSubmitting flag when the form is submitted textareas.forEach(function(textarea) {
document.getElementById('comment-edit-form-{{$id}}').addEventListener('submit', setFormSubmitting); // Set initial height and restore saved content
textarea.style.height = "auto";
textarea.style.height = (textarea.scrollHeight) + "px";
const savedContent = localStorage.getItem(`comment-edit-text-${textarea.id}`);
const lastSaved = localStorage.getItem(`last-saved-${textarea.id}`);
if (savedContent && lastSaved) {
// Check whether 10 minutes have elapsed since the last save
const currentTime = new Date().getTime();
const timeElapsed = currentTime - parseInt(lastSaved, 10);
if (timeElapsed <= 600000) { // 600000 ms = 10 Minuten
textarea.value = savedContent;
textarea.style.height = "auto";
textarea.style.height = (textarea.scrollHeight) + "px";
} else {
// Content is older than 10 minutes, therefore delete
localStorage.removeItem(`comment-edit-text-${textarea.id}`);
localStorage.removeItem(`last-saved-${textarea.id}`);
}
}
});
});
// Auto-save content to localStorage every 5 seconds
setInterval(() => {
var textareas = document.querySelectorAll(".expandable-textarea");
textareas.forEach(function(textarea) {
if (textarea.value.trim() !== "") {
// Saving the content
localStorage.setItem(`comment-edit-text-${textarea.id}`, textarea.value);
// Saving the timestamp of the last save
const currentTime = new Date().getTime();
localStorage.setItem(`last-saved-${textarea.id}`, currentTime.toString());
}
});
}, 5000);
// Remove content saved when submitting the form
function setFormSubmitting() {
formSubmitting = true;
// Removing the content from localStorage
var textareas = document.querySelectorAll(".expandable-textarea");
textareas.forEach(function(textarea) {
localStorage.removeItem(`comment-edit-text-${textarea.id}`);
localStorage.removeItem(`last-saved-${textarea.id}`);
});
}
window.addEventListener("beforeunload", function (event) {
if (!formSubmitting) {
// Get the value of the text field
var textField = document.getElementById('comment-edit-text-{{$id}}').value.trim();
// Check whether the text field contains at least one character
if (textField.length > 0) {
var confirmationMessage = 'Are you sure you want to reload the page? All unsaved changes will be lost.';
event.returnValue = confirmationMessage;
return confirmationMessage;
}
}
});
// Set the formSubmitting flag when the form is submitted
document.getElementById('comment-edit-form-{{$id}}').addEventListener('submit', setFormSubmitting);
</script> </script>