aboutsummaryrefslogtreecommitdiff
path: root/qc_app
diff options
context:
space:
mode:
Diffstat (limited to 'qc_app')
-rw-r--r--qc_app/entry.py4
-rw-r--r--qc_app/static/js/upload_progress.js63
-rw-r--r--qc_app/templates/index.html50
-rw-r--r--qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html28
-rw-r--r--qc_app/templates/upload_progress_indicator.html16
5 files changed, 94 insertions, 67 deletions
diff --git a/qc_app/entry.py b/qc_app/entry.py
index 987fdcd..f166d4c 100644
--- a/qc_app/entry.py
+++ b/qc_app/entry.py
@@ -86,7 +86,7 @@ def upload_file():
request_errors = errors(request)
if request_errors:
for error in request_errors:
- flash(error, "alert-error")
+ flash(error, "alert-error error-expr-data")
return render_template(
"index.html", species=with_db_connection(species)), 400
@@ -100,7 +100,7 @@ def upload_file():
zip_errors = zip_file_errors(filepath, upload_dir)
if zip_errors:
for error in zip_errors:
- flash(error, "alert-error")
+ flash(error, "alert-error error-expr-data")
return render_template(
"index.html", species=with_db_connection(species)), 400
diff --git a/qc_app/static/js/upload_progress.js b/qc_app/static/js/upload_progress.js
index c98c33c..22dbda8 100644
--- a/qc_app/static/js/upload_progress.js
+++ b/qc_app/static/js/upload_progress.js
@@ -1,7 +1,7 @@
function make_processing_indicator(elt) {
var count = 0;
return function() {
- var message = "Checking for errors: "
+ var message = "Finalising upload and saving file: "
if(count > 5) {
count = 1;
}
@@ -63,49 +63,38 @@ function selected_filetype(radios) {
}
}
-function setup_formdata(form) {
- var formdata = new FormData();
- formdata.append(
- "speciesid",
- form.querySelector("#select_species01").value)
- formdata.append(
- "qc_text_file",
- form.querySelector("input[type='file']").files[0]);
- formdata.append(
- "filetype",
- selected_filetype(
- Array.from(form.querySelectorAll("input[type='radio']"))));
- return formdata;
-}
+function make_data_uploader(setup_formdata) {
+ return function(event) {
+ event.preventDefault();
-function upload_data(event) {
- event.preventDefault();
+ var pindicator = document.getElementById("upload-progress-indicator");
- var pindicator = document.getElementById("progress-indicator");
+ var form = event.target;
+ var the_file = form.querySelector("input[type='file']").files[0];
+ if(the_file === undefined) {
+ form.querySelector("input[type='file']").parentElement.setAttribute(
+ "class", "invalid-input");
+ error_elt = form.querySelector("#no-file-error");
+ if(error_elt !== undefined) {
+ error_elt.setAttribute("style", "display: block;");
+ }
+ return false;
+ }
+ pindicator.setAttribute("class", "modal");
+ var formdata = setup_formdata(form);
- var form = document.getElementsByTagName("form")[0];
- var the_file = form.querySelector("input[type='file']").files[0];
- if(the_file === undefined) {
- form.querySelector("#file_upload").parentElement.setAttribute(
- "class", "invalid-input");
- form.querySelector("#no-file-error").setAttribute(
- "style", "display: block;");
+ document.getElementById("progress-filename").innerHTML = the_file.name;
+ var request = setup_request(
+ the_file, document.getElementById("upload-progress-indicator"));
+ request.open(form.getAttribute("method"), form.getAttribute("action"));
+ request.send(formdata);
return false;
}
- pindicator.setAttribute("class", "modal");
- var formdata = setup_formdata(form);
-
- document.getElementById("progress-filename").innerHTML = the_file.name;
- var request = setup_request(
- the_file, document.getElementById("progress-indicator"));
- request.open(form.getAttribute("method"), form.getAttribute("action"));
- request.send(formdata);
- return false;
}
-function setup_upload_handlers() {
+function setup_upload_handlers(formid, datauploader) {
console.info("Setting up the upload handlers.")
- upload_form = document.getElementsByTagName("form")[0];
- upload_form.addEventListener("submit", upload_data);
+ upload_form = document.getElementById(formid);
+ upload_form.addEventListener("submit", datauploader);
}
diff --git a/qc_app/templates/index.html b/qc_app/templates/index.html
index b9638d2..588133a 100644
--- a/qc_app/templates/index.html
+++ b/qc_app/templates/index.html
@@ -1,5 +1,6 @@
{%extends "base.html"%}
-{%from "flash_messages.html" import flash_all_messages%}
+{%from "flash_messages.html" import flash_messages%}
+{%from "upload_progress_indicator.html" import upload_progress_indicator%}
{%block title%}Data Upload{%endblock%}
@@ -54,17 +55,11 @@
</div>
<form action="{{url_for('entry.upload_file')}}"
- method="POST" enctype="multipart/form-data">
+ method="POST"
+ enctype="multipart/form-data"
+ id="frm-upload-expression-data">
<legend class="heading">upload expression data</legend>
- {%with messages = get_flashed_messages(with_categories=True) %}
- {%if messages %}
- <div class="alerts">
- {%for category, message in messages %}
- <span class="alert {{category}}">{{message}}</span>
- {%endfor%}
- </div>
- {%endif%}
- {%endwith%}
+ {{flash_messages("error-expr-data")}}
<fieldset>
<label for="select_species01">Species</label>
@@ -108,20 +103,7 @@
</fieldset>
</form>
-<div id="progress-indicator" class="hidden">
- <h3>Uploading file</h3>
- <p id="progress-filename">the-file</p>
- <progress id="progress-bar" value="0" max="100">
- 0
- </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>
+{{upload_progress_indicator()}}
<h2 class="heading">samples/cases</h2>
@@ -155,6 +137,22 @@
{%block javascript%}
<script type="text/javascript" src="static/js/upload_progress.js"></script>
<script type="text/javascript">
- setup_upload_handlers();
+ function setup_formdata(form) {
+ var formdata = new FormData();
+ formdata.append(
+ "speciesid",
+ form.querySelector("#select_species01").value)
+ formdata.append(
+ "qc_text_file",
+ form.querySelector("input[type='file']").files[0]);
+ formdata.append(
+ "filetype",
+ selected_filetype(
+ Array.from(form.querySelectorAll("input[type='radio']"))));
+ return formdata;
+ }
+
+ setup_upload_handlers(
+ "frm-upload-expression-data", make_data_uploader(setup_formdata));
</script>
{%endblock%}
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 64fcdcd..eaa68a9 100644
--- a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html
+++ b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html
@@ -1,11 +1,14 @@
{%extends "base.html"%}
{%from "flash_messages.html" import flash_all_messages%}
+{%from "upload_progress_indicator.html" import upload_progress_indicator%}
{%block title%}Upload R/qtl2 Bundle{%endblock%}
{%block contents%}
<h2 class="heading">Upload R/qtl2 Bundle</h2>
+{{upload_progress_indicator()}}
+
<form id="frm-upload-rqtl2-bundle"
action="{{url_for('upload.rqtl2.upload_rqtl2_bundle',
species_id=species.SpeciesId,
@@ -20,8 +23,8 @@
<fieldset>
<legend>file upload</legend>
- <label for="file:rqtl2-bundle">R/qtl2 bundle</label>
- <input type="file" id="file:rqtl2-bundle" name="rqtl2_bundle_file"
+ <label for="file-rqtl2-bundle">R/qtl2 bundle</label>
+ <input type="file" id="file-rqtl2-bundle" name="rqtl2_bundle_file"
accept="application/zip, .zip"
required="required" />
<span class="form-input-help"><p>Provide a valid R/qtl2 zip file here. In
@@ -42,3 +45,24 @@
</form>
{%endblock%}
+
+{%block javascript%}
+<script type="text/javascript" src="/static/js/upload_progress.js"></script>
+<script type="text/javascript">
+ setup_upload_handlers(
+ "frm-upload-rqtl2-bundle", make_data_uploader(
+ function (form) {
+ var formdata = new FormData();
+ formdata.append(
+ "species_id",
+ form.querySelector('input[name="species_id"]').value);
+ formdata.append(
+ "population_id",
+ form.querySelector('input[name="population_id"]').value);
+ formdata.append(
+ "rqtl2_bundle_file",
+ form.querySelector("#file-rqtl2-bundle").files[0]);
+ return formdata;
+ }));
+</script>
+{%endblock%}
diff --git a/qc_app/templates/upload_progress_indicator.html b/qc_app/templates/upload_progress_indicator.html
new file mode 100644
index 0000000..9855c2d
--- /dev/null
+++ b/qc_app/templates/upload_progress_indicator.html
@@ -0,0 +1,16 @@
+{%macro upload_progress_indicator()%}
+<div id="upload-progress-indicator" class="hidden">
+ <h3>Uploading file</h3>
+ <p id="progress-filename">the-file</p>
+ <progress id="progress-bar" value="0" max="100">
+ 0
+ </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>
+{%endmacro%}
generated by cgit v1.2.3 (git 2.44.0) at 2024-11-25 13:57:28 +0000