diff options
| -rw-r--r-- | qc_app/static/js/upload_progress.js | 10 | ||||
| -rw-r--r-- | qc_app/templates/index.html | 5 |
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%} |