aboutsummaryrefslogtreecommitdiff
path: root/qc_app/templates/rqtl2
diff options
context:
space:
mode:
authorFrederick Muriuki Muriithi2024-06-27 16:40:52 -0500
committerFrederick Muriuki Muriithi2024-06-27 16:40:52 -0500
commit47c2ea64682064d7cb609e5459d7bd2e49efa17e (patch)
treeb067922e2609188cdc00319aa9883210e656891f /qc_app/templates/rqtl2
parent59b345294cda9cf25b20ae7bfd617f62655ad6da (diff)
downloadgn-uploader-47c2ea64682064d7cb609e5459d7bd2e49efa17e.tar.gz
Handle chunks on backend and update UI with progress
Handle the uploaded chunks, enabling resumption of the upload if incomplete. Update the UI with the progress of the upload.
Diffstat (limited to 'qc_app/templates/rqtl2')
-rw-r--r--qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html48
1 files changed, 39 insertions, 9 deletions
diff --git a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html
index b9320ea..c6c79e5 100644
--- a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html
+++ b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html
@@ -58,13 +58,13 @@
class="btn btn-danger"
style="display: none">cancel upload</button>
</div>
- <div class="progress" style="display: none">
+ <div id="resumable-progress-bar" class="progress" style="display: none">
<div class="progress-bar"
role="progress-bar"
aria-valuenow="60"
aria-valuemin="0"
aria-valuemax="100"
- style="width: 60%;">
+ style="width: 0%;">
Uploading: 60%
</div>
</div>
@@ -76,7 +76,10 @@
population_id=population.InbredSetId)}}"
method="POST"
enctype="multipart/form-data"
- data-resumable-action="/no/such/endpoint">
+ data-resumable-target="{{url_for(
+ 'upload.rqtl2.upload_rqtl2_bundle_chunked_post',
+ species_id=species.SpeciesId,
+ population_id=population.InbredSetId)}}">
<input type="hidden" name="species_id" value="{{species.SpeciesId}}" />
<input type="hidden" name="population_id"
value="{{population.InbredSetId}}" />
@@ -138,7 +141,7 @@
}
var r = Resumable({
- target: $("#frm-upload-rqtl2-bundle").attr("data-resumable-action"),
+ target: $("#frm-upload-rqtl2-bundle").attr("data-resumable-target"),
fileType: ["zip"],
maxFiles: 1,
forceChunkSize: true,
@@ -164,7 +167,8 @@
r.assignBrowse(document.getElementById("resumable-browse-button"));
// Event handlers
- r.on("filesAdded", function(files) {
+
+ function display_files(files) {
displayArea = $("#resumable-selected-files")
displayArea.empty();
files.forEach((file) => {
@@ -190,10 +194,14 @@
+ "</li>"));
displayElement.find(".panel-body").append(list);
displayElement.appendTo("#resumable-selected-files");
- $("#resumable-upload-button").css("display", "");
- $("#resumable-upload-button").on("click", (event) => {
- r.upload()
- });
+ });
+ }
+
+ r.on("filesAdded", function(files) {
+ display_files(files);
+ $("#resumable-upload-button").css("display", "");
+ $("#resumable-upload-button").on("click", (event) => {
+ r.upload();
});
});
@@ -207,9 +215,31 @@
}
});
$("#resumable-cancel-upload-button").css("display", "none");
+ $("#resumable-upload-button").on("click", (event) => {
+ r.files.forEach((file) => {file.retry();});
+ });
$("#resumable-upload-button").css("display", "");
});
});
+
+ r.on("progress", () => {
+ var progress = (r.progress() * 100).toFixed(2);
+ var pbar = $("#resumable-progress-bar > .progress-bar");
+ $("#resumable-progress-bar").css("display", "");
+ pbar.css("width", progress+"%");
+ pbar.attr("aria-valuenow", progress);
+ pbar.text("Uploading: " + progress + "%");
+ })
+
+ r.on("fileSuccess", (file, message) => {
+ if(message != "OK") {
+ var uri = (window.location.protocol
+ + "//"
+ + window.location.host
+ + message);
+ window.location.replace(uri);
+ }
+ });
} else {
setup_upload_handlers(
"frm-upload-rqtl2-bundle", make_data_uploader(