fix an issue where you couldnt resubmit images after an error happened

This commit is contained in:
csd4ni3l
2025-08-08 18:46:35 +02:00
parent a8d47b35e0
commit a4fe1e9230

View File

@@ -30,60 +30,65 @@
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
file_input = document.getElementById("file_input"); function upload_success(image_url) {
file_input.addEventListener("change", function () { document.getElementById("submit").disabled = false;
document.getElementById("submit").innerHTML = "Submit"
var filereader = new FileReader(); document.getElementById("grass-touching-form").innerHTML += `<img class="preview-img" src="${image_url}"></img>`;
}
function upload_success(image_url) { function upload_error(error_message) {
document.getElementById("submit").disabled = false; console.error(error_message)
document.getElementById("submit").innerHTML = "Submit"
document.getElementById("grass-touching-form").innerHTML += `<img class="preview-img" src="${image_url}"></img>`; file_input.value = ''
}
function upload_error(error_message) { document.getElementById("submit").innerHTML = "Submit"
console.error(error_message) document.getElementById("grass-touching-form").innerHTML += `<div class="text-danger">${error_message}</div>`;
file_input.value = ''
document.getElementById("submit").innerHTML = "Submit"
document.getElementById("grass-touching-form").innerHTML += `<div class="text-danger">${error_message}</div>`;
}
function upload_file(file_type, file_content) { file_input = document.getElementById("file_input");
fetch('{{ url_for("upload") }}', { file_input.removeEventListener("change", read_file);
method: "POST", file_input.addEventListener("change", read_file);
body: JSON.stringify({image_data: file_content, image_type: file_type}), }
headers: {
"Content-type": "application/json" function upload_file(file_type, file_content) {
} fetch('{{ url_for("upload") }}', {
method: "POST",
body: JSON.stringify({image_data: file_content, image_type: file_type}),
headers: {
"Content-type": "application/json"
} }
).then(response => { }
if (response.status == 401) { ).then(response => {
response.text().then(text => { if (response.status == 401) {
if (text) { response.text().then(text => {
upload_error(text); if (text) {
upload_error(text);
}
} }
) }
return; )
} return;
else if (response.status == 400) { }
upload_error("Unknown error"); else if (response.status == 400) {
return; upload_error("Unknown error");
} return;
}
return response.text(); return response.text();
}) })
.then(image_url => { .then(image_url => {
if (image_url) { if (image_url) {
upload_success(image_url); upload_success(image_url);
} }
}) })
.catch((error) => { .catch((error) => {
console.error("Error:", error); console.error("Error:", error);
}); });
} }
function read_file () {
file_input = document.getElementById("file_input");
var filereader = new FileReader();
filereader.onload = function () { filereader.onload = function () {
document.getElementById("submit").innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden">Loading...</span>'; document.getElementById("submit").innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span><span class="visually-hidden">Loading...</span>';
@@ -102,7 +107,11 @@ file_input.addEventListener("change", function () {
}; };
filereader.readAsDataURL(file_input.files[0]); filereader.readAsDataURL(file_input.files[0]);
}); }
file_input = document.getElementById("file_input");
file_input.addEventListener("change", read_file);
</script> </script>
{% endblock %} {% endblock %}