diff --git a/the_works/static/js/fileinput.js b/the_works/static/js/fileinput.js index d43b592..ada49a5 100644 --- a/the_works/static/js/fileinput.js +++ b/the_works/static/js/fileinput.js @@ -2,28 +2,28 @@ * FILE INPUT FUNCTIONS */ function initFileinput(id_stub, current_stub, modal_id) { - // add input element event handler + // add "change" event listener to file input element document.getElementById(id_stub + "-upload").addEventListener("change", handleFileinputChange); - // add event handler to modal that shows the current image if the modal was raised by an update action, and hides it otherwise + // add "toggle" event listener to modal that shows the current image if the modal was raised by an update action, and hides it otherwise document.getElementById(modal_id).addEventListener("toggle", handleModalToggle); } function handleFileinputChange(event) { - let id_stub = event.target.id.split("-")[0]; + let fi = event.target + let id_stub = fi.id.split("-")[0]; // mark change document.getElementById(id_stub + "-haschanged").value += "+"; -console.dir(event); // no file chosen -> show placeholder - if ( ! event.target.files.length ) { + if ( ! fi.files.length ) { showOrHideThumbnail(id_stub, "hide"); return true; } // set img src to the uploaded file - let f = event.target.files[0]; + let f = fi.files[0]; let tn = document.getElementById(id_stub + "-thumbnail"); tn.src = URL.createObjectURL(f); @@ -39,7 +39,7 @@ console.dir(event); document.getElementById(id_stub + "-hoehe").innerText = tn.naturalHeight; // remove image object from memory URL.revokeObjectURL(tn.src); - }; + } } @@ -90,3 +90,16 @@ function showOrHideThumbnail(id_stub, mode) { } } + +function validate_filesize(input_id="titelbild-upload") { + let fi = document.getElementById(input_id); +console.dir(fi); + fi.setCustomValidity(""); + fi.setAttribute("aria-invalid", "false"); + + if ( fi.files[0].size > fi.dataset.maxfilesize ) { + fi.setCustomValidity("Datei ist zu groß, bitte kleinere auswählen."); + fi.setAttribute("aria-invalid", "true"); + fi.reportValidity(); + } +} \ No newline at end of file diff --git a/the_works/templates/views/titelbild.html b/the_works/templates/views/titelbild.html index a80b083..94d7543 100644 --- a/the_works/templates/views/titelbild.html +++ b/the_works/templates/views/titelbild.html @@ -58,9 +58,9 @@