aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorFrederick Muriuki Muriithi2023-01-17 11:15:36 +0300
committerFrederick Muriuki Muriithi2023-01-17 11:15:36 +0300
commit9daa00bc10f8199145cf5952382512f4db95aa4a (patch)
tree7e495457bb9bee3febbebfbbe761fa88bb73e0f2
parent3fb8a4de897eabd3e85520358619af7abcbd7664 (diff)
downloadgn-uploader-9daa00bc10f8199145cf5952382512f4db95aa4a.tar.gz
upload: Enable cancelling an upload.
-rw-r--r--qc_app/static/js/upload_progress.js10
-rw-r--r--qc_app/templates/index.html5
2 files changed, 15 insertions, 0 deletions
diff --git a/qc_app/static/js/upload_progress.js b/qc_app/static/js/upload_progress.js
index 049dbfe..98a503a 100644
--- a/qc_app/static/js/upload_progress.js
+++ b/qc_app/static/js/upload_progress.js
@@ -35,6 +35,15 @@ function make_progress_updater(file, indicator_elt) {
};
}
+function setup_cancel_upload(request, indicator_elt) {
+ document.getElementById("btn-cancel-upload").addEventListener(
+ "click", function(event) {
+ event.preventDefault();
+ request.abort();
+ indicator_elt.setAttribute("class", "hidden");
+ });
+}
+
function setup_request(file, progress_indicator_elt) {
var request = new XMLHttpRequest();
var updater = make_progress_updater(file, progress_indicator_elt);
@@ -42,6 +51,7 @@ function setup_request(file, progress_indicator_elt) {
request.onload = function(event) {
document.location.assign(request.responseURL);
};
+ setup_cancel_upload(request, progress_indicator_elt)
return request;
}
diff --git a/qc_app/templates/index.html b/qc_app/templates/index.html
index 9ee3af6..2db6048 100644
--- a/qc_app/templates/index.html
+++ b/qc_app/templates/index.html
@@ -75,6 +75,11 @@
</progress>
<p id="progress-text">Uploading 0%</p>
<p id="progress-extra-text">Processing</p>
+ <form id="frm-cancel-upload" style="border-style: none;">
+ <button id="btn-cancel-upload" type="submit" class="btn btn-danger">
+ Cancel
+ </button>
+ </form>
</div>
{%endblock%}