diff options
33 files changed, 1268 insertions, 1210 deletions
diff --git a/qc_app/static/css/custom-bootstrap.css b/qc_app/static/css/custom-bootstrap.css new file mode 100644 index 0000000..e5f6594 --- /dev/null +++ b/qc_app/static/css/custom-bootstrap.css @@ -0,0 +1,4 @@ +/** Customize some bootstrap selectors **/ +.btn { + text-transform: capitalize; +} diff --git a/qc_app/static/css/styles.css b/qc_app/static/css/styles.css new file mode 100644 index 0000000..a88c229 --- /dev/null +++ b/qc_app/static/css/styles.css @@ -0,0 +1,7 @@ +.heading { + text-transform: capitalize; +} + +label { + text-transform: capitalize; +} diff --git a/qc_app/templates/base.html b/qc_app/templates/base.html index 00ff2d7..91faee8 100644 --- a/qc_app/templates/base.html +++ b/qc_app/templates/base.html @@ -14,6 +14,9 @@ <link rel="shortcut icon" type="image/png" sizes="64x64" href="{{url_for('static', filename='images/CITGLogo.png')}}" /> + <link rel="stylesheet" type="text/css" href="/static/css/custom-bootstrap.css" /> + <link rel="stylesheet" type="text/css" href="/static/css/styles.css" /> + {%block css%}{%endblock%} </head> diff --git a/qc_app/templates/continue_from_create_dataset.html b/qc_app/templates/continue_from_create_dataset.html index f95f96f..03bb49c 100644 --- a/qc_app/templates/continue_from_create_dataset.html +++ b/qc_app/templates/continue_from_create_dataset.html @@ -20,7 +20,7 @@ {%endif%} {%endwith%} -<div class="two-column-with-separator"> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.final_confirmation')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col1"> @@ -29,15 +29,15 @@ filename, filetype, species=species, genechipid=genechipid, studyid=studyid, datasetid=datasetid, totallines=totallines)}} - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">continue</button> </form> +</div> +<div class="row"> <p class="two-col-sep-separator">OR</p> +</div> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.select_dataset')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col2"> @@ -46,11 +46,7 @@ filename, filetype, species=species, genechipid=genechipid, studyid=studyid, datasetid=datasetid, totallines=totallines)}} - <fieldset> - <input type="submit" - value="go back" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">go back</button> </form> </div> {%endblock%} diff --git a/qc_app/templates/continue_from_create_study.html b/qc_app/templates/continue_from_create_study.html index 7455fbc..34e6e5e 100644 --- a/qc_app/templates/continue_from_create_study.html +++ b/qc_app/templates/continue_from_create_study.html @@ -20,7 +20,7 @@ {%endif%} {%endwith%} -<div class="two-column-with-separator"> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.select_dataset')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col1"> @@ -29,15 +29,15 @@ filename, filetype, species=species, genechipid=genechipid, studyid=studyid, totallines=totallines)}} - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">continue</button> </form> +</div> +<div class="row"> <p class="two-col-sep-separator">OR</p> +</div> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.select_study')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col2"> @@ -46,11 +46,7 @@ filename, filetype, species=species, genechipid=genechipid, studyid=studyid, totallines=totallines)}} - <fieldset> - <input type="submit" - value="go back" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">go back</button> </form> </div> {%endblock%} diff --git a/qc_app/templates/errors_display.html b/qc_app/templates/errors_display.html index 0ee5e85..715cfcf 100644 --- a/qc_app/templates/errors_display.html +++ b/qc_app/templates/errors_display.html @@ -5,7 +5,7 @@ {%else %} <p class="alert-danger">{{error_message}}</p> -<table class="reports-table"> +<table class="table reports-table"> <thead> <tr> <th>line number</th> diff --git a/qc_app/templates/index.html b/qc_app/templates/index.html index 06d1e87..0d301f5 100644 --- a/qc_app/templates/index.html +++ b/qc_app/templates/index.html @@ -5,118 +5,130 @@ {%block title%}Data Upload{%endblock%} {%block contents%} -<h1 class="heading">data upload</h1> - -<div class="explainer"> - <p>Each of the sections below gives you a different option for data upload. - Please read the documentation for each section carefully to understand what - each section is about.</p> +<div class="row"> + <h1 class="heading">data upload</h1> + + <div class="explainer"> + <p>Each of the sections below gives you a different option for data upload. + Please read the documentation for each section carefully to understand what + each section is about.</p> + </div> </div> -<h2 class="heading">R/qtl2 Bundles</h2> - -<div class="explainer"> - <p>This feature combines and extends the two upload methods below. Instead of - uploading one item at a time, the R/qtl2 bundle you upload can contain both - the genotypes data (samples/individuals/cases and their data) and the - expression data.</p> - <p>The R/qtl2 bundle, additionally, can contain extra metadata, that neither - of the methods below can handle.</p> - - <a href={{url_for("upload.rqtl2.select_species")}} - title="Upload a zip bundle of R/qtl2 files"> - <button class="btn btn-primary">upload R/qtl2 bundle</button></a> +<div class="row"> + <h2 class="heading">R/qtl2 Bundles</h2> + + <div class="explainer"> + <p>This feature combines and extends the two upload methods below. Instead of + uploading one item at a time, the R/qtl2 bundle you upload can contain both + the genotypes data (samples/individuals/cases and their data) and the + expression data.</p> + <p>The R/qtl2 bundle, additionally, can contain extra metadata, that neither + of the methods below can handle.</p> + + <a href={{url_for("upload.rqtl2.select_species")}} + title="Upload a zip bundle of R/qtl2 files"> + <button class="btn btn-primary">upload R/qtl2 bundle</button></a> + </div> </div> -<h2 class="heading">Expression Data</h2> - -<div class="explainer"> - <p>This feature enables you to upload expression data. It expects the data to - be in <strong>tab-separated values (TSV)</strong> files. The data should be - a simple matrix of <em>phenotype × sample</em>, i.e. The first column is a - list of the <em>phenotypes</em> and the first row is a list of - <em>samples/cases</em>.</p> - - <p>If you haven't done so please go to this page to learn the requirements for - file formats and helpful suggestions to enter your data in a fast and easy - way.</p> - - <ol> - <li><strong>PLEASE REVIEW YOUR DATA.</strong>Make sure your data complies - with our system requirements. ( - <a href="{{url_for('entry.data_review')}}#data-concerns" - title="Details for the data expectations.">Help</a> - )</li> - <li><strong>UPLOAD YOUR DATA FOR DATA VERIFICATION.</strong> We accept - <strong>.csv</strong>, <strong>.txt</strong> and <strong>.zip</strong> - files (<a href="{{url_for('entry.data_review')}}#file-types" - title="Details for the data expectations.">Help</a>)</li> - </ol> -</div> -<form action="{{url_for('entry.upload_file')}}" - method="POST" - enctype="multipart/form-data" - id="frm-upload-expression-data"> - <legend class="heading">upload expression data</legend> - {{flash_messages("error-expr-data")}} - - <fieldset> - <label for="select_species01">Species</label> - <select id="select_species01" - name="speciesid" - required="required"> - <option value="">Select species</option> - {%for aspecies in species%} - <option value="{{aspecies.SpeciesId}}">{{aspecies.MenuName}}</option> - {%endfor%} - </select> - </fieldset> - - <fieldset> - <legend>file type</legend> - - <input type="radio" name="filetype" value="average" id="filetype_average" - required="required" class="form-col-1" /> - <label for="filetype_average" class="form-col-2">average</label> - - <input type="radio" name="filetype" value="standard-error" - id="filetype_standard_error" required="required" - class="form-col-1" /> - <label for="filetype_standard_error" class="form-col-2"> - standard error - </label> - </fieldset> - - <fieldset> - <span id="no-file-error" class="alert-danger" style="display: none;"> - No file selected - </span> - <label for="file_upload" class="form-col-1">select file</label> - <input type="file" name="qc_text_file" id="file_upload" - accept="text/plain, text/tab-separated-values, application/zip" - class="form-col-2"/> - </fieldset> - - <fieldset> - <input type="submit" value="upload file" class="btn btn-primary form-col-2" /> - </fieldset> +<div class="row"> + <h2 class="heading">Expression Data</h2> + + <div class="explainer"> + <p>This feature enables you to upload expression data. It expects the data to + be in <strong>tab-separated values (TSV)</strong> files. The data should be + a simple matrix of <em>phenotype × sample</em>, i.e. The first column is a + list of the <em>phenotypes</em> and the first row is a list of + <em>samples/cases</em>.</p> + + <p>If you haven't done so please go to this page to learn the requirements for + file formats and helpful suggestions to enter your data in a fast and easy + way.</p> + + <ol> + <li><strong>PLEASE REVIEW YOUR DATA.</strong>Make sure your data complies + with our system requirements. ( + <a href="{{url_for('entry.data_review')}}#data-concerns" + title="Details for the data expectations.">Help</a> + )</li> + <li><strong>UPLOAD YOUR DATA FOR DATA VERIFICATION.</strong> We accept + <strong>.csv</strong>, <strong>.txt</strong> and <strong>.zip</strong> + files (<a href="{{url_for('entry.data_review')}}#file-types" + title="Details for the data expectations.">Help</a>)</li> + </ol> + </div> + + <form action="{{url_for('entry.upload_file')}}" + method="POST" + enctype="multipart/form-data" + id="frm-upload-expression-data"> + <legend class="heading">upload expression data</legend> + {{flash_messages("error-expr-data")}} + + <div class="form-group"> + <label for="select_species01" class="form-label">Species</label> + <select id="select_species01" + name="speciesid" + required="required" + class="form-control"> + <option value="">Select species</option> + {%for aspecies in species%} + <option value="{{aspecies.SpeciesId}}">{{aspecies.MenuName}}</option> + {%endfor%} + </select> + </div> + + <div class="form-group"> + <legend class="heading">file type</legend> + + <div class="form-check"> + <input type="radio" name="filetype" value="average" id="filetype_average" + required="required" class="form-check-input" /> + <label for="filetype_average" class="form-check-label">average</label> + </div> + + <div class="form-check"> + <input type="radio" name="filetype" value="standard-error" + id="filetype_standard_error" required="required" + class="form-check-input" /> + <label for="filetype_standard_error" class="form-check-label"> + standard error + </label> + </div> + </div> + + <div class="form-group"> + <span id="no-file-error" class="alert-danger" style="display: none;"> + No file selected + </span> + <label for="file_upload" class="form-label">select file</label> + <input type="file" name="qc_text_file" id="file_upload" + accept="text/plain, text/tab-separated-values, application/zip" + class="form-control"/> + </div> + + <button type="submit" class="btn btn-primary" />upload file</button> </form> {{upload_progress_indicator()}} +</div> -<h2 class="heading">samples/cases</h2> +<div class="row"> + <h2 class="heading">samples/cases</h2> -<div class="explainer"> - <p>For the expression data above, you need the samples/cases in your file to - already exist in the GeneNetwork database. If there are any samples that do - not already exist the upload of the expression data will fail.</p> - <p>This section gives you the opportunity to upload any missing samples</p> -</div> + <div class="explainer"> + <p>For the expression data above, you need the samples/cases in your file to + already exist in the GeneNetwork database. If there are any samples that do + not already exist the upload of the expression data will fail.</p> + <p>This section gives you the opportunity to upload any missing samples</p> + </div> -<a href={{url_for("samples.select_species")}} - title="Upload samples/cases/individuals for your data"> - upload Samples/Cases</a> + <a href={{url_for("samples.select_species")}} + title="Upload samples/cases/individuals for your data" + class="btn btn-primary">upload Samples/Cases</a> +</div> {%endblock%} diff --git a/qc_app/templates/insert_error.html b/qc_app/templates/insert_error.html index 56dd195..5301288 100644 --- a/qc_app/templates/insert_error.html +++ b/qc_app/templates/insert_error.html @@ -5,24 +5,28 @@ {%block contents%} <h1 class="heading">Insertion Failure</h1> -<p> - There was an error inserting data into the database -</p> +<div class="row"> + <p> + There was an error inserting data into the database + </p> -<p> - Please notify the developers of this issue when you encounter it, - providing the information below. -</p> + <p> + Please notify the developers of this issue when you encounter it, + providing the information below. + </p> -<h4>Debugging Information</h4> + <h4>Debugging Information</h4> -<ul> - <li><strong>job id</strong>: {{job["job_id"]}}</li> -</ul> + <ul> + <li><strong>job id</strong>: {{job["jobid"]}}</li> + </ul> +</div> -<h4>STDERR Output</h4> -<div class="cli-output"> - {{job["stderr"]}} +<div class="row"> + <h4>STDERR Output</h4> + <pre class="cli-output"> + {{job["stderr"]}} + </pre> </div> {%endblock%} diff --git a/qc_app/templates/insert_progress.html b/qc_app/templates/insert_progress.html index 0e1a9e0..52177d6 100644 --- a/qc_app/templates/insert_progress.html +++ b/qc_app/templates/insert_progress.html @@ -10,8 +10,12 @@ {%block contents%} <h1 class="heading">{{job_name}}</h1> -<label for="job_status">status:</label> -<span>{{job_status}}: {{message}}</span><br /> +<div class="row"> + <form> + <div class="form-group"> + <label for="job_status" class="form-label">status:</label> + <span class="form-text">{{job_status}}: {{message}}</span> + </div> {%if job.get("stdout", "").split("\n\n") | length < 3 %} {%set lines = 0%} @@ -25,9 +29,16 @@ {%set fraction = (lines/totallines)%} {%endif%} -<label for="job_{{job_id}}">inserting: </label> -<progress id="jobs_{{job_id}}" value="{{(fraction)}}">{{fraction*100}}</progress> -<span>{{"%.2f" | format(fraction * 100 | float)}}%</span><br /> + <div class="form-group"> + <label for="job_{{job_id}}" class="form-label">inserting: </label> + <progress id="jobs_{{job_id}}" + value="{{(fraction)}}" + class="form-control">{{fraction*100}}</progress> + <span class="form-text text-muted"> + {{"%.2f" | format(fraction * 100 | float)}}%</span> + </div> + </form> +</div> {{stdout_output(job)}} diff --git a/qc_app/templates/insert_success.html b/qc_app/templates/insert_success.html index 4406c66..7e1fa8d 100644 --- a/qc_app/templates/insert_success.html +++ b/qc_app/templates/insert_success.html @@ -6,10 +6,14 @@ {%block contents%} <h1 class="heading">Insertion Success</h1> +<div class="row"> <p>Data inserted successfully!</p> <p>The following queries were run:</p> +</div> -{{stdout_output(job)}} +<div class="row"> + {{stdout_output(job)}} +</div> {%endblock%} diff --git a/qc_app/templates/job_progress.html b/qc_app/templates/job_progress.html index 1b08814..1af0763 100644 --- a/qc_app/templates/job_progress.html +++ b/qc_app/templates/job_progress.html @@ -10,21 +10,30 @@ {%block contents%} <h1 class="heading">{{job_name}}</h2> -<label for="job_status">status:</label> -<span>{{job_status}}: {{message}}</span><br /> - -<label for="job_{{job_id}}">parsing: </label> -<progress id="job_{{job_id}}" value="{{progress/100}}">{{progress}}</progress> -<span>{{"%.2f" | format(progress)}}%</span> - -<div> +<div class="row"> <form action="{{url_for('parse.abort')}}" method="POST"> + <legend class="heading">Status</legend> + <div class="form-group"> + <label for="job_status" class="form-label">status:</label> + <span class="form-text">{{job_status}}: {{message}}</span><br /> + </div> + + <div class="form-group"> + <label for="job_{{job_id}}" class="form-label">parsing: </label> + <progress id="job_{{job_id}}" + value="{{progress/100}}" + class="form-control"> + {{progress}}</progress> + <span class="form-text text-muted">{{"%.2f" | format(progress)}}%</span> + </div> + <input type="hidden" name="job_id" value="{{job_id}}" /> - <input type="submit" value="Abort" class="btn btn-danger" /> + + <button type="submit" class="btn btn-danger">Abort</button> </form> </div> -<div> +<div class="row"> {{errors_display(errors, "No errors found so far", "We have found the following errors so far", False)}} </div> diff --git a/qc_app/templates/rqtl2/create-geno-dataset-success.html b/qc_app/templates/rqtl2/create-geno-dataset-success.html index 4333612..1b50221 100644 --- a/qc_app/templates/rqtl2/create-geno-dataset-success.html +++ b/qc_app/templates/rqtl2/create-geno-dataset-success.html @@ -31,27 +31,25 @@ </p> </div> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">select from existing genotype datasets</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" - value="{{geno_dataset.id}}" /> - - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">select from existing genotype datasets</legend> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" + value="{{geno_dataset.id}}" /> + + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/create-probe-dataset-success.html b/qc_app/templates/rqtl2/create-probe-dataset-success.html index 57df449..790d174 100644 --- a/qc_app/templates/rqtl2/create-probe-dataset-success.html +++ b/qc_app/templates/rqtl2/create-probe-dataset-success.html @@ -6,7 +6,7 @@ {%block contents%} <h2 class="heading">Create ProbeSet Dataset</h2> -<div class="explainer"> +<div class="row"> <p>You successfully created the ProbeSet dataset with the following information. <dl> @@ -34,28 +34,26 @@ </p> </div> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">Create ProbeSet dataset</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - <input type="hidden" name="probe-study-id" value="{{study.Id}}" /> - <input type="hidden" name="probe-dataset-id" value="{{dataset.datasetid}}" /> - - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">Create ProbeSet dataset</legend> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + <input type="hidden" name="probe-study-id" value="{{study.Id}}" /> + <input type="hidden" name="probe-dataset-id" value="{{dataset.datasetid}}" /> + + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/create-probe-study-success.html b/qc_app/templates/rqtl2/create-probe-study-success.html index 5d3d123..d0ee508 100644 --- a/qc_app/templates/rqtl2/create-probe-study-success.html +++ b/qc_app/templates/rqtl2/create-probe-study-success.html @@ -6,7 +6,7 @@ {%block contents%} <h2 class="heading">Create ProbeSet Study</h2> -<div class="explainer"> +<div class="row"> <p>You successfully created the ProbeSet study with the following information. <dl> @@ -26,28 +26,24 @@ <dd>{{study.today}}</dd> </dl> </p> -</div> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">Create ProbeSet study</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="probe-study-id" value="{{study.studyid}}" /> - - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">Create ProbeSet study</legend> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="probe-study-id" value="{{study.studyid}}" /> + + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/create-tissue-success.html b/qc_app/templates/rqtl2/create-tissue-success.html index 7ea0c65..5f2c5a0 100644 --- a/qc_app/templates/rqtl2/create-tissue-success.html +++ b/qc_app/templates/rqtl2/create-tissue-success.html @@ -6,61 +6,18 @@ {%block contents%} <h2 class="heading">Select Tissue</h2> -<div class="explainer"> +<div class="row"> <p>You have successfully added a new tissue, organ or biological material with the following details:</p> </div> -{{flash_all_messages()}} - -<form id="frm-create-tissue-display" - method="POST" - action="#"> - <legend class="heading">Create Tissue</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - - <fieldset> - <label>Name</label> - <label>{{tissue.TissueName}}</label> - </fieldset> - - <fieldset> - <label>Short Name</label> - <label>{{tissue.Short_Name}}</label> - </fieldset> - - {%if tissue.BIRN_lex_ID%} - <fieldset> - <label>BIRN Lex ID</label> - <label>{{tissue.BIRN_lex_ID}}</label> - </fieldset> - {%endif%} - - {%if tissue.BIRN_lex_Name%} - <fieldset> - <label>BIRN Lex Name</label> - <label>{{tissue.BIRN_lex_Name}}</label> - </fieldset> - {%endif%} -</form> - -<div id="action-buttons" - style="width:65ch;display:inline-grid;column-gap:5px;"> - - <form id="frm-create-tissue-success-continue" +<div class="row"> + {{flash_all_messages()}} + + <form id="frm-create-tissue-display" method="POST" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - style="display: inline; width: 100%; grid-column: 1 / 2; - padding-top: 0.5em; text-align: center; border: none; - background-color: inherit;"> + action="#"> + <legend class="heading">Create Tissue</legend> <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> <input type="hidden" name="population_id" @@ -69,16 +26,63 @@ <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> + <div class="form-group"> + <label>Name</label> + <label>{{tissue.TissueName}}</label> + </div> + + <div class="form-group"> + <label>Short Name</label> + <label>{{tissue.Short_Name}}</label> + </div> + + {%if tissue.BIRN_lex_ID%} + <div class="form-group"> + <label>BIRN Lex ID</label> + <label>{{tissue.BIRN_lex_ID}}</label> + </div> + {%endif%} + + {%if tissue.BIRN_lex_Name%} + <div class="form-group"> + <label>BIRN Lex Name</label> + <label>{{tissue.BIRN_lex_Name}}</label> + </div> + {%endif%} </form> + <div id="action-buttons" + style="width:65ch;display:inline-grid;column-gap:5px;"> + + <form id="frm-create-tissue-success-continue" + method="POST" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + style="display: inline; width: 100%; grid-column: 1 / 2; + padding-top: 0.5em; text-align: center; border: none; + background-color: inherit;"> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + + <button type="submit" class="btn btn-primary">continue</button> + </form> + </div> +</div> + +<div class="row"> <p style="display:inline;width:100%;grid-column:2/3;text-align:center; color:#336699;font-weight:bold;"> OR </p> +</div> +<div class="row"> <form id="frm-create-tissue-success-select-existing" method="POST" action="{{url_for('upload.rqtl2.select_tissue', @@ -94,11 +98,9 @@ <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="submit" - value="select from existing tissues" - class="btn btn-primary form-col-2" /> + <button type="submit" class="btn btn-primary"> + select from existing tissues</button> </form> - </div> {%endblock%} diff --git a/qc_app/templates/rqtl2/index.html b/qc_app/templates/rqtl2/index.html index 45018e7..f3329c2 100644 --- a/qc_app/templates/rqtl2/index.html +++ b/qc_app/templates/rqtl2/index.html @@ -12,23 +12,25 @@ id="frm-rqtl2-upload"> <legend class="heading">upload R/qtl2 bundle</legend> {{flash_messages("error-rqtl2")}} - <fieldset> - <label for="select:species">Species</label> - <select id="select:species" name="species_id" required="required"> + + <div class="form-group"> + <label for="select:species" class="form-label">Species</label> + <select id="select:species" + name="species_id" + required="required" + class="form-control"> <option value="">Select species</option> {%for spec in species%} <option value="{{spec.SpeciesId}}">{{spec.MenuName}}</option> {%endfor%} </select> - <span class="form-input-help"> + <small class="form-text text-muted"> Data that you upload to the system should belong to a know species. Here you can select the species that you wish to upload data for. - </span> - </fieldset> + </small> + </div> - <fieldset> - <input type="submit" value="submit" class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary" />submit</button> </form> {%endblock%} diff --git a/qc_app/templates/rqtl2/rqtl2-qc-job-results.html b/qc_app/templates/rqtl2/rqtl2-qc-job-results.html index 35dc95a..59bc8cd 100644 --- a/qc_app/templates/rqtl2/rqtl2-qc-job-results.html +++ b/qc_app/templates/rqtl2/rqtl2-qc-job-results.html @@ -6,61 +6,61 @@ {%block contents%} <h1 class="heading">R/qtl2 bundle: QC job results</h1> -<div class="explainer"> +<div class="row"> <p>The R/qtl2 bundle you uploaded has passed all automated quality-control checks successfully.</p> <p>You may now continue to load the data into GeneNetwork for the bundle, with the following details:</p> </div> -<form id="form-qc-job-results" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.Id)}}" - method="POST"> - <fieldset> - <legend>Species</legend> - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> +<div class="row"> + <form id="form-qc-job-results" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.Id)}}" + method="POST"> + <div class="form-group"> + <legend>Species</legend> + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <span class="form-col-1">Name</span> - <span class="form-col-2">{{species.Name | capitalize}}</span> + <span class="form-label">Name</span> + <span class="form-text">{{species.Name | capitalize}}</span> - <span class="form-col-1">Scientific</span> - <span class="form-col-2">{{species.FullName | capitalize}}</span> - </fieldset> + <span class="form-label">Scientific</span> + <span class="form-text">{{species.FullName | capitalize}}</span> + </div> - <fieldset> - <legend>population</legend> - <input type="hidden" name="population_id" value="{{population.Id}}" /> + <div class="form-group"> + <legend>population</legend> + <input type="hidden" name="population_id" value="{{population.Id}}" /> - <span class="form-col-1">Name</span> - <span class="form-col-2">{{population.InbredSetName}}</span> + <span class="form-label">Name</span> + <span class="form-text">{{population.InbredSetName}}</span> - <span class="form-col-1">Full Name</span> - <span class="form-col-2">{{population.FullName}}</span> + <span class="form-label">Full Name</span> + <span class="form-text">{{population.FullName}}</span> - <span class="form-col-1">Genetic Type</span> - <span class="form-col-2">{{population.GeneticType}}</span> + <span class="form-label">Genetic Type</span> + <span class="form-text">{{population.GeneticType}}</span> - <span class="form-col-1">Description</span> - <span class="form-col-2">{{population.Description or "-"}}</span> - </fieldset> + <span class="form-label">Description</span> + <span class="form-text">{{population.Description or "-"}}</span> + </div> - <fieldset> - <legend>R/qtl2 Bundle File</legend> - <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2bundle}}" /> - <input type="hidden" name="original-filename" value="{{rqtl2bundleorig}}" /> + <div class="form-group"> + <legend>R/qtl2 Bundle File</legend> + <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2bundle}}" /> + <input type="hidden" name="original-filename" value="{{rqtl2bundleorig}}" /> - <span class="form-col-1">Original Name</span> - <span class="form-col-2">{{rqtl2bundleorig}}</span> + <span class="form-label">Original Name</span> + <span class="form-text">{{rqtl2bundleorig}}</span> - <span class="form-col-1">Internal Name</span> - <span class="form-col-2">{{rqtl2bundle[0:25]}}…</span> - </fieldset> + <span class="form-label">Internal Name</span> + <span class="form-text">{{rqtl2bundle[0:25]}}…</span> + </div> - <fieldset> - <input type="submit" value="continue" class="btn btn-primary form-col-2" /> - </fieldset> -</form> + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/rqtl2-qc-job-success.html b/qc_app/templates/rqtl2/rqtl2-qc-job-success.html index d492898..2861a04 100644 --- a/qc_app/templates/rqtl2/rqtl2-qc-job-success.html +++ b/qc_app/templates/rqtl2/rqtl2-qc-job-success.html @@ -6,7 +6,7 @@ {%block contents%} <h2 class="heading">R/qtl2 Bundle: Quality Control Successful</h2> -<div class="explainer"> +<div class="row"> <p>The R/qtl2 bundle you uploaded has passed <emph>all</emph> quality control checks successfully, and is now ready for uploading into the database.</p> <p>Click "Continue" below to proceed.</p> @@ -16,22 +16,22 @@ The "action" on this form takes us to the next step, where we can select all the other data necessary to enter the data into the database. --> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - {{flash_all_messages()}} - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> +<div class="row"> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + {{flash_all_messages()}} + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> - <fieldset> - <input type="submit" value="continue" class="btn btn-primary form-col-2" /> - </fieldset> -</form> + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/select-geno-dataset.html b/qc_app/templates/rqtl2/select-geno-dataset.html index f092dbc..873f9c3 100644 --- a/qc_app/templates/rqtl2/select-geno-dataset.html +++ b/qc_app/templates/rqtl2/select-geno-dataset.html @@ -6,131 +6,139 @@ {%block contents%} <h2 class="heading">Select Genotypes Dataset</h2> -<div class="explainer"> +<div class="row"> <p>Your R/qtl2 files bundle contains a "geno" specification. You will therefore need to select from one of the existing Genotype datasets or create a new one.</p> <p>This is the dataset where your data will be organised under.</p> </div> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_geno_dataset', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">select from existing genotype datasets</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - - {{flash_messages("error-rqtl2-select-geno-dataset")}} - - <fieldset> - <legend>Datasets</legend> - <label for="select:geno-datasets">Dataset</label> - <select id="select:geno-datasets" - name="geno-dataset-id" - required="required" - {%if datasets | length == 0%} - disabled="disabled" - {%endif%}> - <option value="">Select dataset</option> - {%for dset in datasets%} - <option value="{{dset['Id']}}">{{dset["Name"]}} ({{dset["FullName"]}})</option> - {%endfor%} - </select> - <span class="form-col-2"> - Select from the existing genotype datasets for species - {{species.SpeciesName}} ({{species.FullName}}). - </span> - </fieldset> - - <fieldset> - <input type="submit" - value="select dataset" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> - -<p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> - -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.create_geno_dataset', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">create a new genotype dataset</legend> - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - - {{flash_messages("error-rqtl2-create-geno-dataset")}} - - <fieldset> - <label for="txt:dataset-name">Name</label> - <input type="text" - id="txt:dataset-name" - name="dataset-name" - maxlength="100" - required="required" /> - <span class="form-col-2"> - Provide the new name for the genotype dataset, e.g. "BXDGeno" - </span> - </fieldset> - - <fieldset> - <label for="txt:dataset-fullname">Full Name</label> - <input type="text" - id="txt:dataset-fullname" - name="dataset-fullname" - required="required" - maxlength="100" /> - - <span class="form-col-2"> - Provide a longer name that better describes the genotype dataset, e.g. - "BXD Genotypes" - </span> - </fieldset> - - <fieldset> - <label for="txt:dataset-shortname">Short Name</label> - <input type="text" - id="txt:dataset-shortname" - name="dataset-shortname" - maxlength="100" /> - - <span class="form-col-2"> - Provide a short name for the genotype dataset. This is optional. If not - provided, we'll default to the same value as the "Name" above. - </span> - </fieldset> - - <fieldset> - <input type="checkbox" - id="chk:dataset-public" - name="dataset-public" - checked="checked" /> - <label for="chk:dataset-public">Public?</label> - - <span class="form-col-2"> - Specify whether the dataset will be available publicly. Check to make the - dataset publicly available and uncheck to limit who can access the dataset. - </span> - </fieldset> - - <fieldset> - <input type="submit" - value="create new dataset" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_geno_dataset', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">select from existing genotype datasets</legend> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + + {{flash_messages("error-rqtl2-select-geno-dataset")}} + + <div class="form-group"> + <legend>Datasets</legend> + <label for="select:geno-datasets" class="form-label">Dataset</label> + <select id="select:geno-datasets" + name="geno-dataset-id" + required="required" + {%if datasets | length == 0%} + disabled="disabled" + {%endif%} + class="form-control" + aria-describedby="help-geno-dataset-select-dataset"> + <option value="">Select dataset</option> + {%for dset in datasets%} + <option value="{{dset['Id']}}">{{dset["Name"]}} ({{dset["FullName"]}})</option> + {%endfor%} + </select> + <span id="help-geno-dataset-select-dataset" class="form-text text-muted"> + Select from the existing genotype datasets for species + {{species.SpeciesName}} ({{species.FullName}}). + </span> + </div> + + <button type="submit" class="btn btn-primary">select dataset</button> + </form> +</div> + +<div class="row"> + <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> +</div> + +<div class="row"> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.create_geno_dataset', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">create a new genotype dataset</legend> + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + + {{flash_messages("error-rqtl2-create-geno-dataset")}} + + <div class="form-group"> + <label for="txt:dataset-name" class="form-label">Name</label> + <input type="text" + id="txt:dataset-name" + name="dataset-name" + maxlength="100" + required="required" + class="form-control" + aria-describedby="help-geno-dataset-name" /> + <span id="help-geno-dataset-name" class="form-text text-muted"> + Provide the new name for the genotype dataset, e.g. "BXDGeno" + </span> + </div> + + <div class="form-group"> + <label for="txt:dataset-fullname" class="form-label">Full Name</label> + <input type="text" + id="txt:dataset-fullname" + name="dataset-fullname" + required="required" + maxlength="100" + class="form-control" + aria-describedby="help-geno-dataset-fullname" /> + + <span id="help-geno-dataset-fullname" class="form-text text-muted"> + Provide a longer name that better describes the genotype dataset, e.g. + "BXD Genotypes" + </span> + </div> + + <div class="form-group"> + <label for="txt:dataset-shortname" class="form-label">Short Name</label> + <input type="text" + id="txt:dataset-shortname" + name="dataset-shortname" + maxlength="100" + class="form-control" + aria-describedby="help-geno-dataset-shortname" /> + + <span id="help-geno-dataset-shortname" class="form-text text-muted"> + Provide a short name for the genotype dataset. This is optional. If not + provided, we'll default to the same value as the "Name" above. + </span> + </div> + + <div class="form-group"> + <input type="checkbox" + id="chk:dataset-public" + name="dataset-public" + checked="checked" + class="form-check" + aria-describedby="help-geno-datasent-public" /> + <label for="chk:dataset-public" class="form-check-label">Public?</label> + + <span id="help-geno-dataset-public" class="form-text text-muted"> + Specify whether the dataset will be available publicly. Check to make the + dataset publicly available and uncheck to limit who can access the dataset. + </span> + </div> + + <button type="submit" class="btn btn-primary">create new dataset</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/select-population.html b/qc_app/templates/rqtl2/select-population.html index 1102805..37731f0 100644 --- a/qc_app/templates/rqtl2/select-population.html +++ b/qc_app/templates/rqtl2/select-population.html @@ -22,29 +22,26 @@ {{flash_messages("error-select-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> - <label for="select:inbredset" class="form-col-1">population</label> + + <div class="form-group"> + <label for="select:inbredset" class="form-label">population</label> <select id="select:inbredset" name="inbredset_id" required="required" - class="form-col-2"> + class="form-control"> <option value="">Select a grouping/population</option> {%for pop in populations%} <option value="{{pop.InbredSetId}}"> {{pop.InbredSetName}} ({{pop.FullName}})</option> {%endfor%} </select> - <span class="form-input-help">If you are adding data to an already existing + <span class="form-text text-muted">If you are adding data to an already existing population, simply pick the population from this drop-down selector. If you cannot find your population from this list, try the form below to create a new one..</span> - </fieldset> + </div> - <fieldset> - <input type="submit" - value="select population" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary" />select population</button> </form> <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> @@ -55,70 +52,81 @@ {{flash_messages("error-create-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> - <legend>mandatory</legend> - <label for="txt:inbredset-name" class="form-col-1">name</label> - <input id="txt:inbredset-name" - name="inbredset_name" - type="text" - required="required" - maxlength="30" - placeholder="Enter grouping/population name" - class="form-col-2" /> - <span class="form-input-help">This is a short name that identifies the - population. Useful for menus, and quick scanning.</span> - - <label for="txt:" class="form-col-1">full name</label> - <input id="txt:inbredset-fullname" - name="inbredset_fullname" - type="text" - required="required" - maxlength="100" - placeholder="Enter the grouping/population's full name" - class="form-col-2" /> - <span class="form-input-help">This can be the same as the name above, or can - be longer. Useful for documentation, and human communication.</span> - </fieldset> - <fieldset> - <legend>Optional</legend> - - <label for="num:public" class="form-col-1">public?</label> - <select id="num:public" - name="public" - class="form-col-2"> - <option value="0">0 - Only accessible to authorised users</option> - <option value="1">1 - Publicly accessible to all users</option> - <option value="2" selected> - 2 - Publicly accessible to all users</option> - </select> - <span class="form-input-help">This determines whether the - population/grouping will appear on the menus for users.</span> - - <label for="txt:inbredset-family" class="form-col-1">family</label> - <input id="txt:inbredset-family" - name="inbredset_family" - type="text" - placeholder="I am not sure what this is about." - class="form-col-2" /> - <span class="form-input-help">I do not currently know what this is about. - This is a failure on my part to figure out what this is and provide a - useful description. Please feel free to remind me.</span> - - <label for="txtarea:" class="form-col-1">Description</label> + + <div class="form-group"> + <legend class="heading">mandatory</legend> + + <div class="form-group"> + <label for="txt:inbredset-name" class="form-label">name</label> + <input id="txt:inbredset-name" + name="inbredset_name" + type="text" + required="required" + maxlength="30" + placeholder="Enter grouping/population name" + class="form-control" /> + <span class="form-text text-muted">This is a short name that identifies the + population. Useful for menus, and quick scanning.</span> + </div> + + <div class="form-group"> + <label for="txt:" class="form-label">full name</label> + <input id="txt:inbredset-fullname" + name="inbredset_fullname" + type="text" + required="required" + maxlength="100" + placeholder="Enter the grouping/population's full name" + class="form-control" /> + <span class="form-text text-muted">This can be the same as the name above, or can + be longer. Useful for documentation, and human communication.</span> + </div> + </div> + + <div class="form-group"> + <legend class="heading">optional</legend> + + <div class="form-group"> + <label for="num:public" class="form-label">public?</label> + <select id="num:public" + name="public" + class="form-control"> + <option value="0">0 - Only accessible to authorised users</option> + <option value="1">1 - Publicly accessible to all users</option> + <option value="2" selected> + 2 - Publicly accessible to all users</option> + </select> + <span class="form-text text-muted">This determines whether the + population/grouping will appear on the menus for users.</span> + </div> + + <div class="form-group"> + <label for="txt:inbredset-family" class="form-label">family</label> + <input id="txt:inbredset-family" + name="inbredset_family" + type="text" + placeholder="I am not sure what this is about." + class="form-control" /> + <span class="form-text text-muted">I do not currently know what this is about. + This is a failure on my part to figure out what this is and provide a + useful description. Please feel free to remind me.</span> + </div> + + <div class="form-group"> + <label for="txtarea:" class="form-label">Description</label> <textarea id="txtarea:description" name="description" rows="5" placeholder="Enter a description of this grouping/population" - class="form-col-2"></textarea> - <span class="form-input-help">A long-form description of what the population - consists of. Useful for humans.</span> - </fieldset> - - <fieldset> - <input type="submit" - value="create grouping/population" - class="btn btn-primary form-col-2" /> - </fieldset> + class="form-control"></textarea> + <span class="form-text text-muted"> + A long-form description of what the population consists of. Useful for + humans.</span> + </div> + </div> + + <button type="submit" class="btn btn-primary" /> + create grouping/population</button> </form> {%endblock%} diff --git a/qc_app/templates/rqtl2/select-probeset-dataset.html b/qc_app/templates/rqtl2/select-probeset-dataset.html index c5acb72..26f52ed 100644 --- a/qc_app/templates/rqtl2/select-probeset-dataset.html +++ b/qc_app/templates/rqtl2/select-probeset-dataset.html @@ -6,173 +6,186 @@ {%block contents%} <h2 class="heading">Phenotype(ProbeSet) Dataset</h2> -<div class="explainer"> +<div class="row"> <p>The R/qtl2 bundle you uploaded contains (a) "<strong>pheno</strong>" file(s). This data needs to be organised under a dataset.</p> <p>This page gives you the ability to do that.</p> </div> {%if datasets | length > 0%} -<form method="POST" - action="{{url_for('upload.rqtl2.select_probeset_dataset', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:select-probeset-dataset"> - <legend class="heading">Select from existing ProbeSet datasets</legend> - {{flash_messages("error-rqtl2")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> - - <fieldset> - <label for="select:probe-dataset">Dataset</label> - <select id="select:probe-dataset" - name="probe-dataset-id" - required="required" - {%if datasets | length == 0%}disabled="disabled"{%endif%}> - <option value="">Select a dataset</option> - {%for dataset in datasets%} - <option value={{dataset.Id}}> - {{dataset.Name}} - {%if dataset.FullName%} - -- ({{dataset.FullName}}) - {%endif%} - </option> - {%endfor%} - </select> - - <span class="form-col-2">Select from existing ProbeSet datasets.</span> - </fieldset> - - <fieldset> - <input type="submit" - value="select dataset" - class="btn btn-primary form-col-2" /> - </fieldset> +<div class="row"> + <form method="POST" + action="{{url_for('upload.rqtl2.select_probeset_dataset', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:select-probeset-dataset"> + <legend class="heading">Select from existing ProbeSet datasets</legend> + {{flash_messages("error-rqtl2")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> + + <div class="form-group"> + <label class="form-label" for="select:probe-dataset">Dataset</label> + <select id="select:probe-dataset" + name="probe-dataset-id" + required="required" + {%if datasets | length == 0%}disabled="disabled"{%endif%} + class="form-control" + aria-describedby="help-probe-dataset"> + <option value="">Select a dataset</option> + {%for dataset in datasets%} + <option value={{dataset.Id}}> + {{dataset.Name}} + {%if dataset.FullName%} + -- ({{dataset.FullName}}) + {%endif%} + </option> + {%endfor%} + </select> + + <span id="help-probe-dataset" class="form-text text-muted"> + Select from existing ProbeSet datasets.</span> + </div> + + <button type="submit" class="btn btn-primary" />select dataset</button> </form> +</div> -<p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> +<div class="row"> + <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> +</div> {%endif%} -<div class="explainer"> +<div class="row"> <p>Create an entirely new ProbeSet dataset for your data.</p> </div> -<form method="POST" - action="{{url_for('upload.rqtl2.create_probeset_dataset', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:create-probeset-dataset"> - <legend class="heading">Create a new ProbeSet dataset</legend> - {{flash_messages("error-rqtl2-create-probeset-dataset")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> - - <fieldset> - <label for="select:average">averaging method</label> - <select id="select:average" - name="averageid" - required="required"> - <option value="">Select averaging method</option> - {%for avgmethod in avgmethods%} - <option value="{{avgmethod.Id}}"> - {{avgmethod.Name}} - {%if avgmethod.Normalization%} - ({{avgmethod.Normalization}}) - {%endif%} - </option> - {%endfor%} - </select> - - <span class="form-col-2"> - Select the averaging method used for your data. - </span> - </fieldset> - - <fieldset> - <label for="txt:datasetname">Name</label> - <input type="text" id="txt:datasetname" name="datasetname" - required="required" - maxlength="40" - title="Name of the dataset, e.g 'BXDMicroArray_ProbeSet_June03'. (Required)" /> - - <span class="form-col-2"> - Provide a name for the dataset e.g. "BXDMicroArray_ProbeSet_June03". This - is mandatory <strong>MUST</strong> be provided. - </span> - </fieldset> - - <fieldset> - <label for="txt:datasetfullname">Full Name</label> - <input type="text" id="txt:datasetfullname" name="datasetfullname" - required="required" - maxlength="100" - title="A longer name for the dataset, e.g. 'UTHSC Brain mRNA U74Av2 (Jun03) MAS5'. (Required)" /> - - <span class="form-col-2"> - Provide a longer, more descriptive name for the dataset e.g. - "UTHSC Brain mRNA U74Av2 (Jun03) MAS5". This is mandatory and - <strong>MUST</strong> be provided. - </span> - </fieldset> - - <fieldset> - <label for="txt:datasetshortname">Short Name</label> - <input type="text" id="txt:datasetshortname" name="datasetshortname" - maxlength="100" - title="An abbreviated name for the dataset, e.g 'Br_U_0603_M'. (Optional)" /> - - <span class="form-col-2"> - Provide a longer, more descriptive name for the dataset e.g. "Br_U_0603_M". - This is optional. - </span> - </fieldset> - - <fieldset> - <input type="checkbox" id="chk:public" name="datasetpublic" - checked="checked" - title="Whether or not the dataset is accessible by the general public." /> - <label for="chk:datasetpublic">Public?</label> - - <span class="form-col-2"> - Check to specify that the dataset will be publicly available. Uncheck to - limit access to the dataset. - </span> - </fieldset> - - <fieldset> - <label for="select:datasetdatascale">Data Scale</label> - <select id="select:datasetdatascale" - name="datasetdatascale" - required="required"> - <option value="log2" selected="selected">log2</option> - <option value="z_score">z_score</option> - <option value="log2_ratio">log2_ratio</option> - <option value="linear">linear</option> - <option value="linear_positive">linear_positive</option> - </select> - - <span class="form-col-2"> - Select from a list of scaling methods. - </span> - </fieldset> - - <fieldset> - <input type="submit" - value="create dataset" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + <form method="POST" + action="{{url_for('upload.rqtl2.create_probeset_dataset', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:create-probeset-dataset"> + <legend class="heading">Create a new ProbeSet dataset</legend> + {{flash_messages("error-rqtl2-create-probeset-dataset")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> + + <div class="form-group"> + <label class="form-label" for="select:average">averaging method</label> + <select id="select:average" + name="averageid" + required="required" + class="form-control" + aria-describedby="help-average"> + <option value="">Select averaging method</option> + {%for avgmethod in avgmethods%} + <option value="{{avgmethod.Id}}"> + {{avgmethod.Name}} + {%if avgmethod.Normalization%} + ({{avgmethod.Normalization}}) + {%endif%} + </option> + {%endfor%} + </select> + + <span id="help-average" class="form-text text-muted"> + Select the averaging method used for your data. + </span> + </div> + + <div class="form-group"> + <label class="form-label" for="txt:datasetname">Name</label> + <input type="text" id="txt:datasetname" name="datasetname" + required="required" + maxlength="40" + title="Name of the dataset, e.g 'BXDMicroArray_ProbeSet_June03'. (Required)" + class="form-control" + aria-describedby="help-dataset-name" /> + + <span id="help-dataset-name" class="form-text text-muted"> + Provide a name for the dataset e.g. "BXDMicroArray_ProbeSet_June03". This + is mandatory <strong>MUST</strong> be provided. + </span> + </div> + + <div class="form-group"> + <label class="form-label" for="txt:datasetfullname">Full Name</label> + <input type="text" id="txt:datasetfullname" name="datasetfullname" + required="required" + maxlength="100" + title="A longer name for the dataset, e.g. 'UTHSC Brain mRNA U74Av2 (Jun03) MAS5'. (Required)" + class="form-control" + aria-describedby="help-dataset-fullname" /> + + <span id="help-dataset-fullname" class="form-text text-muted"> + Provide a longer, more descriptive name for the dataset e.g. + "UTHSC Brain mRNA U74Av2 (Jun03) MAS5". This is mandatory and + <strong>MUST</strong> be provided. + </span> + </div> + + <div class="form-group"> + <label class="form-label" for="txt:datasetshortname">Short Name</label> + <input type="text" id="txt:datasetshortname" name="datasetshortname" + maxlength="100" + title="An abbreviated name for the dataset, e.g 'Br_U_0603_M'. (Optional)" + class="form-control" + aria-describedby="help-dataset-shortname" /> + + <span id="help-dataset-shortname" class="form-text text-muted"> + Provide a longer, more descriptive name for the dataset e.g. "Br_U_0603_M". + This is optional. + </span> + </div> + + <div class="form-check"> + <input type="checkbox" id="chk:public" name="datasetpublic" + checked="checked" + title="Whether or not the dataset is accessible by the general public." + class="form-check-input" + aria-describedby="help-public" /> + <label class="form-check-label" for="chk:datasetpublic">Public?</label> + + <span id="help-public" class="form-text text-muted"> + Check to specify that the dataset will be publicly available. Uncheck to + limit access to the dataset. + </span> + </div> + + <div class="form-group"> + <label class="form-label" for="select:datasetdatascale">Data Scale</label> + <select id="select:datasetdatascale" + name="datasetdatascale" + required="required" + class="form-control" + aria-describedby="help-dataset-datascale"> + <option value="log2" selected="selected">log2</option> + <option value="z_score">z_score</option> + <option value="log2_ratio">log2_ratio</option> + <option value="linear">linear</option> + <option value="linear_positive">linear_positive</option> + </select> + + <span id="help-dataset-datascale" class="form-text text-muted"> + Select from a list of scaling methods. + </span> + </div> + + <button type="submit" class="btn btn-primary">create dataset</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/select-probeset-study-id.html b/qc_app/templates/rqtl2/select-probeset-study-id.html index c387514..b9bf52e 100644 --- a/qc_app/templates/rqtl2/select-probeset-study-id.html +++ b/qc_app/templates/rqtl2/select-probeset-study-id.html @@ -6,128 +6,138 @@ {%block contents%} <h2 class="heading">Phenotype(ProbeSet) Study</h2> -<div class="explainer"> +<div class="row"> <p>The R/qtl2 bundle you uploaded contains (a) "<strong>pheno</strong>" file(s). This data needs to be organised under a study.</p> <p>In this page, you can either select from a existing dataset:</p> + + <form method="POST" + action="{{url_for('upload.rqtl2.select_probeset_study', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:select-probeset-study"> + <legend class="heading">Select from existing ProbeSet studies</legend> + {{flash_messages("error-rqtl2-select-probeset-study")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + + <div> + <label for="select:probe-study" class="form-label">Study</label> + <select id="select:probe-study" + name="probe-study-id" + required="required" + aria-describedby="help-select-probeset-study" + {%if studies | length == 0%}disabled="disabled"{%endif%} + class="form-control"> + <option value="">Select a study</option> + {%for study in studies%} + <option value={{study.Id}}> + {{study.Name}} + {%if study.FullName%} + -- ({{study.FullName}}) + {%endif%} + </option> + {%endfor%} + </select> + <small id="help-select-probeset-study" class="form-text text-muted"> + Select from existing ProbeSet studies. + </small> + </div> + + <button type="submit" class="btn btn-primary">select study</button> + </form> </div> -<form method="POST" - action="{{url_for('upload.rqtl2.select_probeset_study', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:select-probeset-study"> - <legend class="heading">Select from existing ProbeSet studies</legend> - {{flash_messages("error-rqtl2-select-probeset-study")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - - <fieldset> - <label for="select:probe-study">Study</label> - <select id="select:probe-study" - name="probe-study-id" - required="required" - {%if studies | length == 0%}disabled="disabled"{%endif%}> - <option value="">Select a study</option> - {%for study in studies%} - <option value={{study.Id}}> - {{study.Name}} - {%if study.FullName%} - -- ({{study.FullName}}) - {%endif%} - </option> - {%endfor%} - </select> - <span class="form-col-2">Select from existing ProbeSet studies.</span> - </fieldset> - - <fieldset> - <input type="submit" - value="select study" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> - -<p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> - -<div class="explainer"> - <p>Create a new ProbeSet dataset below:</p> +<div class="row"> + <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> </div> -<form method="POST" - action="{{url_for('upload.rqtl2.create_probeset_study', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:create-probeset-study"> - <legend class="heading">Create new ProbeSet study</legend> - - {{flash_messages("error-rqtl2-create-probeset-study")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> - - <fieldset> - <label for="select:platform">Platform</label> - <select id="select:platform" - name="platformid" - required="required" - {%if platforms | length == 0%}disabled="disabled"{%endif%}> - <option value="">Select a platform</option> - {%for platform in platforms%} - <option value="{{platform.GeneChipId}}"> - {{platform.GeneChipName}} ({{platform.Name}}) - </option> - {%endfor%} - </select> - <span class="form-col-2">Select from a list of known genomics platforms. - </span> - </fieldset> - - <fieldset> - <label for="txt:studyname">Study name</label> - <input type="text" id="txt:studyname" name="studyname" - placeholder="Name of the study. (Required)" - required="required" - maxlength="100" /> - <span class="form-col-2">Provide a name for the study.</span> - </fieldset> - - <fieldset> - <label for="txt:studyfullname">Full Study Name</label> - <input type="text" id="txt:studyfullname" name="studyfullname" - placeholder="Longer name of the study. (Optional)" - maxlength="100" /> - <span class="form-col-2"> - Provide a longer, more descriptive name for the study. This is optional - and you can leave it blank. - </span> - </fieldset> - - <fieldset> - <label for="txt:studyshortname">Short Study Name</label> - <input type="text" id="txt:studyshortname" name="studyshortname" - placeholder="Shorter name of the study. (Optional)" - maxlength="100" /> - <span class="form-col-2"> - Provide a shorter name for the study. This is optional and you can leave - it blank. - </span> - </fieldset> - - <fieldset> - <input type="submit" - value="create study" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + + <p>Create a new ProbeSet dataset below:</p> + + <form method="POST" + action="{{url_for('upload.rqtl2.create_probeset_study', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:create-probeset-study"> + <legend class="heading">Create new ProbeSet study</legend> + + {{flash_messages("error-rqtl2-create-probeset-study")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="tissueid" value="{{tissue.Id}}" /> + + <div> + <label for="select:platform" class="form-label">Platform</label> + <select id="select:platform" + name="platformid" + required="required" + aria-describedby="help-select-platform" + {%if platforms | length == 0%}disabled="disabled"{%endif%} + class="form-control"> + <option value="">Select a platform</option> + {%for platform in platforms%} + <option value="{{platform.GeneChipId}}"> + {{platform.GeneChipName}} ({{platform.Name}}) + </option> + {%endfor%} + </select> + <small id="help-select-platform" class="form-text text-muted"> + Select from a list of known genomics platforms. + </small> + </div> + + <div class="form-group"> + <label for="txt:studyname" class="form-label">Study name</label> + <input type="text" id="txt:studyname" name="studyname" + placeholder="Name of the study. (Required)" + required="required" + maxlength="100" + class="form-control" /> + <span class="form-text text-muted" id="help-study-name"> + Provide a name for the study.</span> + </div> + + <div class="form-group"> + <label for="txt:studyfullname" class="form-label">Full Study Name</label> + <input type="text" + id="txt:studyfullname" + name="studyfullname" + placeholder="Longer name of the study. (Optional)" + maxlength="100" + class="form-control" /> + <span class="form-text text-muted" id="help-study-full-name"> + Provide a longer, more descriptive name for the study. This is optional + and you can leave it blank. + </span> + </div> + + <div class="form-group"> + <label for="txt:studyshortname" class="form-label">Short Study Name</label> + <input type="text" + id="txt:studyshortname" + name="studyshortname" + placeholder="Shorter name of the study. (Optional)" + maxlength="100" + class="form-control" /> + <span class="form-text text-muted" id="help-study-short-name"> + Provide a shorter name for the study. This is optional and you can leave + it blank. + </span> + </div> + + <button type="submit" class="btn btn-primary">create study</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/select-tissue.html b/qc_app/templates/rqtl2/select-tissue.html index 78d5afe..34e1758 100644 --- a/qc_app/templates/rqtl2/select-tissue.html +++ b/qc_app/templates/rqtl2/select-tissue.html @@ -6,107 +6,110 @@ {%block contents%} <h2 class="heading">Tissue</h2> -<div class="explainer"> +<div class="row"> <p>The data you are uploading concerns a tissue, cell, organ, or other biological material used in an experiment.</p> <p>Select the appropriate biological material below</p> </div> {%if tissues | length > 0%} -<form method="POST" - action="{{url_for('upload.rqtl2.select_tissue', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:select-probeset-dataset"> - <legend class="heading">Select from existing ProbeSet datasets</legend> - {{flash_messages("error-select-tissue")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - - <fieldset> - <label for="select-tissue">Tissue</label> - <select id="select-tissue" - name="tissueid" - required="required" - {%if tissues | length == 0%}disabled="disabled"{%endif%}> - <option value="">Select a tissue</option> - {%for tissue in tissues%} - <option value={{tissue.Id}}> - {{tissue.Name}} - {%if tissue.Short_Name%} - -- ({{tissue.Short_Name}}) - {%endif%} - </option> - {%endfor%} - </select> - - <span class="form-col-2">Select from existing biological material.</span> - </fieldset> - - <fieldset> - <input type="submit" - value="use selected" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> +<div class="row"> + <form method="POST" + action="{{url_for('upload.rqtl2.select_tissue', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:select-probeset-dataset"> + <legend class="heading">Select from existing ProbeSet datasets</legend> + {{flash_messages("error-select-tissue")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + + <div class="form-group"> + <label class="form-label" for="select-tissue">Tissue</label> + <select id="select-tissue" + name="tissueid" + required="required" + {%if tissues | length == 0%}disabled="disabled"{%endif%} + class="form-control" + aria-describedby="help-select-tissue"> + <option value="">Select a tissue</option> + {%for tissue in tissues%} + <option value={{tissue.Id}}> + {{tissue.Name}} + {%if tissue.Short_Name%} + -- ({{tissue.Short_Name}}) + {%endif%} + </option> + {%endfor%} + </select> + + <span id="help-select-tissue" class="form-text text-muted"> + Select from existing biological material.</span> + </div> + + <button type="submit" class="btn btn-primary">use selected</button> + </form> +</div> -<p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> +<div class="row"> + <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> +</div> {%endif%} -<div class="explainer"> +<div class="row"> <p>If you cannot find the biological material in the drop-down above, add it to the system below.</p> -</div> -<form method="POST" - action="{{url_for('upload.rqtl2.create_tissue', - species_id=species.SpeciesId, population_id=population.Id)}}" - id="frm:create-probeset-dataset"> - <legend class="heading">Add new tissue, organ or biological material</legend> - {{flash_messages("error-create-tissue")}} - - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - - <fieldset> - <label for="tissue-name">name</label> - <input type="text" - id="txt-tissuename" - name="tissuename" - required="required" - title = "A name to identify the tissue, organ or biological material." /> - - <span class="form-col-2"> - A name to identify the tissue, organ or biological material. - </span> - </fieldset> - - <fieldset> - <label for="txt-shortname">short name</label> - <input type="text" id="txt-tissueshortname" name="tissueshortname" - required="required" - maxlength="7" - title="A short name (e.g. 'Mam') for the biological material." /> - - <span class="form-col-2"> - Provide a short name for the tissue, organ or biological material used in - the experiment. - </span> - </fieldset> - - <fieldset> - <input type="submit" - value="add new material" - class="btn btn-primary form-col-2" /> - </fieldset> + <form method="POST" + action="{{url_for('upload.rqtl2.create_tissue', + species_id=species.SpeciesId, population_id=population.Id)}}" + id="frm:create-probeset-dataset"> + <legend class="heading">Add new tissue, organ or biological material</legend> + {{flash_messages("error-create-tissue")}} + + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + + <div class="form-group"> + <label class="form-label" for="tissue-name">name</label> + <input type="text" + id="txt-tissuename" + name="tissuename" + required="required" + title = "A name to identify the tissue, organ or biological material." + class="form-control" + aria-describedby="help-tissue-name" /> + + <span class="form-text text-muted" id="help-tissue-name"> + A name to identify the tissue, organ or biological material. + </span> + </div> + + <div class="form-group"> + <label for="txt-shortname" class="form-label">short name</label> + <input type="text" id="txt-tissueshortname" name="tissueshortname" + required="required" + maxlength="7" + title="A short name (e.g. 'Mam') for the biological material." + class="form-control" + aria-describedby="help-tissue-short-name" /> + + <span class="form-text text-muted" id="help-tissue-short-name"> + Provide a short name for the tissue, organ or biological material used in + the experiment. + </span> + </div> + + <button type="submit" class="btn btn-primary" />add new material</button> </form> +</div> {%endblock%} diff --git a/qc_app/templates/rqtl2/summary-info.html b/qc_app/templates/rqtl2/summary-info.html index 8b05578..1be87fa 100644 --- a/qc_app/templates/rqtl2/summary-info.html +++ b/qc_app/templates/rqtl2/summary-info.html @@ -6,60 +6,60 @@ {%block contents%} <h2 class="heading">Summary</h2> -<div class="explainer"> +<div class="row"> <p>This is the information you have provided to accompany the R/qtl2 bundle you have uploaded. Please verify the information is correct before proceeding.</p> </div> -<dl> - <dt>Species</dt> - <dd>{{species.SpeciesName}} ({{species.FullName}})</dd> +<div class="row"> + <dl> + <dt>Species</dt> + <dd>{{species.SpeciesName}} ({{species.FullName}})</dd> - <dt>Population</dt> - <dd>{{population.InbredSetName}}</dd> + <dt>Population</dt> + <dd>{{population.InbredSetName}}</dd> - {%if geno_dataset%} - <dt>Genotype Dataset</dt> - <dd>{{geno_dataset.Name}} ({{geno_dataset.FullName}})</dd> - {%endif%} + {%if geno_dataset%} + <dt>Genotype Dataset</dt> + <dd>{{geno_dataset.Name}} ({{geno_dataset.FullName}})</dd> + {%endif%} - {%if tissue%} - <dt>Tissue</dt> - <dd>{{tissue.TissueName}} ({{tissue.Name}}, {{tissue.Short_Name}})</dd> - {%endif%} + {%if tissue%} + <dt>Tissue</dt> + <dd>{{tissue.TissueName}} ({{tissue.Name}}, {{tissue.Short_Name}})</dd> + {%endif%} - {%if probe_study%} - <dt>ProbeSet Study</dt> - <dd>{{probe_study.Name}} ({{probe_study.FullName}})</dd> - {%endif%} + {%if probe_study%} + <dt>ProbeSet Study</dt> + <dd>{{probe_study.Name}} ({{probe_study.FullName}})</dd> + {%endif%} - {%if probe_dataset%} - <dt>ProbeSet Dataset</dt> - <dd>{{probe_dataset.Name2}} ({{probe_dataset.FullName}})</dd> - {%endif%} -</dl> + {%if probe_dataset%} + <dt>ProbeSet Dataset</dt> + <dd>{{probe_dataset.Name2}} ({{probe_dataset.FullName}})</dd> + {%endif%} + </dl> +</div> -<form id="frm:confirm-rqtl2bundle-details" - action="{{url_for('upload.rqtl2.confirm_bundle_details', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - <legend class="heading">Create ProbeSet dataset</legend> +<div class="row"> + <form id="frm:confirm-rqtl2bundle-details" + action="{{url_for('upload.rqtl2.confirm_bundle_details', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + <legend class="heading">Create ProbeSet dataset</legend> - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> - <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> - <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> - <input type="hidden" name="probe-dataset-id" value="{{probe_dataset.Id}}" /> + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" value="{{rqtl2_bundle_file}}" /> + <input type="hidden" name="geno-dataset-id" value="{{geno_dataset.Id}}" /> + <input type="hidden" name="probe-study-id" value="{{probe_study.Id}}" /> + <input type="hidden" name="probe-dataset-id" value="{{probe_dataset.Id}}" /> - <fieldset> - <input type="submit" - value="continue" - class="btn btn-primary form-col-2" /> - </fieldset> -</form> + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%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 cc7c92e..5cf9dfd 100644 --- a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html +++ b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-01.html @@ -21,13 +21,14 @@ {{flash_all_messages()}} - <fieldset> - <legend>file upload</legend> - <label for="file-rqtl2-bundle">R/qtl2 bundle</label> + <div form-group> + <legend class="heading">file upload</legend> + <label for="file-rqtl2-bundle" class="form-label">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 + required="required" + class="form-control" /> + <span class="form-text text-muted"><p>Provide a valid R/qtl2 zip file here. In particular, ensure your zip bundle contains exactly one control file and the corresponding files mentioned in the control file.</p> <p>The control file can be either a YAML or JSON file. <em>ALL</em> other @@ -36,12 +37,9 @@ <a href="https://kbroman.org/qtl2/assets/vignettes/input_files.html" target="_blank"> R/qtl2 file format specifications</a> for more details.</p></span> - </fieldset> - <fieldset> - <input type="submit" - value="upload R/qtl2 bundle" - class="btn btn-primary form-col-2" /> - </fieldset> + </div> + + <button type="submit" class="btn btn-primary">upload R/qtl2 bundle</button> </form> {%endblock%} diff --git a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-02.html b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-02.html index 75f4a96..93b1dc9 100644 --- a/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-02.html +++ b/qc_app/templates/rqtl2/upload-rqtl2-bundle-step-02.html @@ -6,30 +6,28 @@ {%block contents%} <h2 class="heading">Upload R/qtl2 Bundle</h2> -<div class="explainer"> +<div class="row"> <p>You have successfully uploaded the zipped bundle of R/qtl2 files.</p> <p>The next step is to select the various extra information we need to figure out what to do with the data. You will select/create the relevant studies and/or datasets to organise the data in the steps that follow.</p> <p>Click "Continue" below to proceed.</p> -</div> -<form id="frm-upload-rqtl2-bundle" - action="{{url_for('upload.rqtl2.select_dataset_info', - species_id=species.SpeciesId, - population_id=population.InbredSetId)}}" - method="POST" - enctype="multipart/form-data"> - {{flash_all_messages()}} - <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <input type="hidden" name="population_id" - value="{{population.InbredSetId}}" /> - <input type="hidden" name="rqtl2_bundle_file" - value="{{rqtl2_bundle_file}}" /> + <form id="frm-upload-rqtl2-bundle" + action="{{url_for('upload.rqtl2.select_dataset_info', + species_id=species.SpeciesId, + population_id=population.InbredSetId)}}" + method="POST" + enctype="multipart/form-data"> + {{flash_all_messages()}} + <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> + <input type="hidden" name="population_id" + value="{{population.InbredSetId}}" /> + <input type="hidden" name="rqtl2_bundle_file" + value="{{rqtl2_bundle_file}}" /> - <fieldset> - <input type="submit" value="continue" class="btn btn-primary form-col-2" /> - </fieldset> -</form> + <button type="submit" class="btn btn-primary">continue</button> + </form> +</div> {%endblock%} diff --git a/qc_app/templates/samples/select-population.html b/qc_app/templates/samples/select-population.html index 5d78826..da19ddc 100644 --- a/qc_app/templates/samples/select-population.html +++ b/qc_app/templates/samples/select-population.html @@ -13,33 +13,28 @@ (e.g. Inbred populations, cell tissue, etc.)</p> </div> -<hr /> - <form method="POST" action="{{url_for('samples.select_population', species_id=species.SpeciesId)}}"> <legend class="heading">select grouping/population</legend> {{flash_messages("error-select-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> - <label for="select:inbredset" class="form-col-1">grouping/population</label> + + <div class="form-group"> + <label for="select:inbredset" class="form-label">grouping/population</label> <select id="select:inbredset" name="inbredset_id" required="required" - class="form-col-2"> + class="form-control"> <option value="">Select a grouping/population</option> {%for pop in populations%} <option value="{{pop.InbredSetId}}"> {{pop.InbredSetName}} ({{pop.FullName}})</option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" - value="select population" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">select population</button> </form> <p style="color:#FE3535; padding-left:20em; font-weight:bolder;">OR</p> @@ -50,54 +45,51 @@ {{flash_messages("error-create-population")}} <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <fieldset> + <div class="form-group"> <legend>mandatory</legend> - <label for="txt:inbredset-name" class="form-col-1">name</label> + + <label for="txt:inbredset-name" class="form-label">name</label> <input id="txt:inbredset-name" name="inbredset_name" type="text" required="required" placeholder="Enter grouping/population name" - class="form-col-2" /> + class="form-control" /> - <label for="txt:" class="form-col-1">full name</label> + <label for="txt:" class="form-label">full name</label> <input id="txt:inbredset-fullname" name="inbredset_fullname" type="text" required = "required" placeholder="Enter the grouping/population's full name" - class="form-col-2" /> - </fieldset> - <fieldset> + class="form-control" /> + </div> + <div class="form-group"> <legend>Optional</legend> - <label for="num:public" class="form-col-1">public?</label> + <label for="num:public" class="form-label">public?</label> <input id="num:public" name="public" type="number" min="0" max="2" value="2" - class="form-col-2" /> + class="form-control" /> - <label for="txt:inbredset-family" class="form-col-1">family</label> + <label for="txt:inbredset-family" class="form-label">family</label> <input id="txt:inbredset-family" name="inbredset_family" type="text" placeholder="I am not sure what this is about." - class="form-col-2" /> + class="form-control" /> - <label for="txtarea:" class="form-col-1">Description</label> + <label for="txtarea:" class="form-label">Description</label> <textarea id="txtarea:description" name="description" rows="5" placeholder="Enter a description of this grouping/population" - class="form-col-2"></textarea> - </fieldset> - - <fieldset> - <input type="submit" - value="create grouping/population" - class="btn btn-primary form-col-2" /> - </fieldset> + class="form-control"></textarea> + </div> + + <button type="submit" class="btn btn-primary">create grouping/population</button> </form> {%endblock%} diff --git a/qc_app/templates/samples/select-species.html b/qc_app/templates/samples/select-species.html index 44c0d4f..edadc61 100644 --- a/qc_app/templates/samples/select-species.html +++ b/qc_app/templates/samples/select-species.html @@ -12,18 +12,19 @@ <form method="POST" action="{{url_for('samples.select_species')}}"> <legend class="heading">upload samples</legend> - <fieldset> - <label for="select_species02">Species</label> - <select id="select_species02" name="species_id" required="required"> + <div class="form-group"> + <label for="select_species02" class="form-label">Species</label> + <select id="select_species02" + name="species_id" + required="required" + class="form-control"> <option value="">Select species</option> {%for spec in species%} <option value="{{spec.SpeciesId}}">{{spec.MenuName}}</option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" value="submit" class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">submit</button> </form> {%endblock%} diff --git a/qc_app/templates/samples/upload-samples.html b/qc_app/templates/samples/upload-samples.html index 29b08f6..e62de57 100644 --- a/qc_app/templates/samples/upload-samples.html +++ b/qc_app/templates/samples/upload-samples.html @@ -3,16 +3,7 @@ {%block title%}Upload Samples{%endblock%} -{%block css%} -<style type="text/css"> - #form-samples { - background-color: #D1D1D1; - } - #form-samples fieldset:nth-child(odd){ - background-color: white; - } -</style> -{%endblock%} +{%block css%}{%endblock%} {%block contents%} <h1 class="heading">upload samples</h1> @@ -20,23 +11,23 @@ {{flash_messages("alert-success")}} <p>You can now upload a character-separated value (CSV) file that contains - details about your samples. The CSV file should have the following fields: - <dl> - <dt>Name</dt> - <dd>The primary name for the sample</dd> + details about your samples. The CSV file should have the following fields: + <dl> + <dt>Name</dt> + <dd>The primary name for the sample</dd> - <dt>Name2</dt> - <dd>A secondary name for the sample. This can simply be the same as - <strong>Name</strong> above. This field <strong>MUST</strong> contain a - value.</dd> + <dt>Name2</dt> + <dd>A secondary name for the sample. This can simply be the same as + <strong>Name</strong> above. This field <strong>MUST</strong> contain a + value.</dd> - <dt>Symbol</dt> - <dd>A symbol for the sample. Can be an empty field.</dd> + <dt>Symbol</dt> + <dd>A symbol for the sample. Can be an empty field.</dd> - <dt>Alias</dt> - <dd>An alias for the sample. Can be an empty field.</dd> - </dl> - </p> + <dt>Alias</dt> + <dd>An alias for the sample. Can be an empty field.</dd> + </dl> +</p> <form id="form-samples" method="POST" @@ -45,32 +36,32 @@ population_id=population.InbredSetId)}}" enctype="multipart/form-data"> <legend class="heading">upload samples</legend> - <fieldset> + + <div class="form-group"> <input type="hidden" name="species_id" value="{{species.SpeciesId}}" /> - <label class="form-col-1">species:</label> - <span class="form-col-2">{{species.SpeciesName}} [{{species.MenuName}}]</span> - </fieldset> + <label class="form-label">species:</label> + <span class="form-text">{{species.SpeciesName}} [{{species.MenuName}}]</span> + </div> - <fieldset> + <div class="form-group"> <input type="hidden" name="inbredset_id" value="{{population.InbredSetId}}" /> - <label class="form-col-1">grouping/population:</label> - <span class="form-col-2">{{population.Name}} [{{population.FullName}}]</span> - </fieldset> + <label class="form-label">grouping/population:</label> + <span class="form-text">{{population.Name}} [{{population.FullName}}]</span> + </div> - <fieldset> - <input id="chk:heading" - type="checkbox" - name="first_line_heading" - class="form-col-1" /> - <label for="chk:heading" class="form-col-2">first line is a heading?</label> - </fieldset> + <div class="form-group"> + <label for="file-samples" class="form-label">select file</label> + <input type="file" name="samples_file" id="file:samples" + accept="text/csv, text/tab-separated-values" + class="form-control" /> + </div> - <fieldset> - <label for="select:separator" class="form-col-1">field separator</label> + <div class="form-group"> + <label for="select:separator" class="form-label">field separator</label> <select id="select:separator" name="separator" required="required" - class="form-col-2"> + class="form-control"> <option value="">Select separator for your file: (default is comma)</option> <option value="	">TAB</option> <option value=" ">Space</option> @@ -81,43 +72,46 @@ <input id="txt:separator" type="text" name="other_separator" - class="form-col-2" /> - <span class="form-col-2"> - This is the character that separates the fields in your CSV file. If you - select "<strong>Other</strong>", then you must provide the separator in - the text field provided. - </span> - </fieldset> - - <fieldset> - <label for="txt:delimiter" class="form-col-1">field delimiter</label> + class="form-control" /> + <small class="form-text text-muted"> + If you select '<strong>Other</strong>' for the field separator value, + enter the character that separates the fields in your CSV file in the form + field below. + </small> + </div> + + <div class="form-group form-check"> + <input id="chk:heading" + type="checkbox" + name="first_line_heading" + class="form-check-input" /> + <label for="chk:heading" class="form-check-label"> + first line is a heading?</label> + <small class="form-text text-muted"> + Select this if the first line in your file contains headings for the + columns. + </small> + </div> + + <div class="form-group"> + <label for="txt:delimiter" class="form-label">field delimiter</label> <input id="txt:delimiter" type="text" name="field_delimiter" maxlength="1" - class="form-col-2" /> - <span class="form-col-2"> + class="form-control" /> + <small class="form-text text-muted"> If there is a character delimiting the string texts within particular fields in your CSV, provide the character here. This can be left blank if no such delimiters exist in your file. - </span> - </fieldset> + </small> + </div> - <fieldset> - <label for="file:samples" class="form-col-1">select file</label> - <input type="file" name="samples_file" id="file:samples" - accept="text/csv, text/tab-separated-values" - class="form-col-2" /> - </fieldset> - - <fieldset> - <input type="submit" - value="upload samples file" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" + class="btn btn-primary">upload samples file</button> </form> -<table id="tbl:samples-preview"> +<table id="tbl:samples-preview" class="table"> <caption class="heading">preview content</caption> <thead> diff --git a/qc_app/templates/select_dataset.html b/qc_app/templates/select_dataset.html index 3c9bd6b..2f07de8 100644 --- a/qc_app/templates/select_dataset.html +++ b/qc_app/templates/select_dataset.html @@ -10,17 +10,17 @@ {%block contents%} <h2 class="heading">{{filename}}: select dataset</h2> -<div class="two-column-with-separator"> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.final_confirmation')}}" id="select-dataset-form" class="two-col-sep-col1"> - <legend>choose existing dataset</legend> + <legend class="heading">choose existing dataset</legend> {{hidden_fields( filename, filetype, species=species, genechipid=genechipid, studyid=studyid, totallines=totallines)}} - <fieldset> - <label for="datasetid" class="form-col-1">dataset:</label> - <select id="datasetid" name="datasetid" class="form-col-2" + <div class="form-group"> + <label for="datasetid" class="form-label">dataset:</label> + <select id="datasetid" name="datasetid" class="form-control" {%if datasets | length == 0:%} disabled="disabled" {%endif%}> @@ -30,23 +30,24 @@ </option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" class="btn btn-primary form-col-2" - value="update database" - {%if datasets | length == 0:%} - disabled="disabled" - {%endif%} /> - </fieldset> - </form> + <button type="submit" class="btn btn-primary" + {%if datasets | length == 0:%} + disabled="disabled" + {%endif%} />update database</button> +</form> +</div> +<div class="row"> <p class="two-col-sep-separator">OR</p> +</div> +<div class="row"> <form method="POST" id="create-dataset-form" action="{{url_for('dbinsert.create_dataset')}}" class="two-col-sep-col2"> - <legend>create new dataset</legend> + <legend class="heading">create new dataset</legend> {{hidden_fields( filename, filetype, species=species, genechipid=genechipid, studyid=studyid, totallines=totallines)}} @@ -61,9 +62,9 @@ {%endif%} {%endwith%} - <fieldset> - <label for="avgid" class="form-col-1">average:</label> - <select id="avgid" name="avgid" required="required" class="form-col-2"> + <div class="form-group"> + <label for="avgid" class="form-label">average:</label> + <select id="avgid" name="avgid" required="required" class="form-control"> <option value="">Select averaging method</option> {%for method in avgmethods:%} <option value="{{method['AvgMethodId']}}" @@ -74,46 +75,46 @@ </option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <label for="datasetname" class="form-col-1">name:</label> + <div class="form-group"> + <label for="datasetname" class="form-label">name:</label> <input id="datasetname" name="datasetname" type="text" - class="form-col-2" + class="form-control" {%if datasetname is defined %} value="{{datasetname}}" {%endif%} /> - </fieldset> + </div> - <fieldset> - <label for="datasetname2" class="form-col-1">name 2:</label> + <div class="form-group"> + <label for="datasetname2" class="form-label">name 2:</label> <input id="datasetname2" name="datasetname2" type="text" - required="required" class="form-col-2" + required="required" class="form-control" {%if datasetname2 is defined %} value="{{datasetname2}}" {%endif%} /> - </fieldset> + </div> - <fieldset> - <label for="datasetfullname" class="form-col-1">full name:</label> + <div class="form-group"> + <label for="datasetfullname" class="form-label">full name:</label> <input id="datasetfullname" name="datasetfullname" type="text" - required="required" class="form-col-2" + required="required" class="form-control" {%if datasetfullname is defined %} value="{{datasetfullname}}" {%endif%} /> - </fieldset> + </div> - <fieldset> - <label for="datasetshortname" class="form-col-1">short name:</label> + <div class="form-group"> + <label for="datasetshortname" class="form-label">short name:</label> <input id="datasetshortname" name="datasetshortname" type="text" - required="required" class="form-col-2" + required="required" class="form-control" {%if datasetshortname is defined %} value="{{datasetshortname}}" {%endif%} /> - </fieldset> + </div> - <fieldset> - <label for="datasetpublic" class="form-col-1">public:</label> + <div class="form-group"> + <label for="datasetpublic" class="form-label">public:</label> <input id="datasetpublic" name="datasetpublic" type="number" required="required" min="0" max="2" {%if datasetpublic is defined %} @@ -121,10 +122,10 @@ {%else%} value="0" {%endif%} - class="form-col-2" /> - </fieldset> + class="form-control" /> + </div> - <fieldset> + <div class="form-group"> <label for="datasetconfidentiality">confidentiality:</label> <input id="datasetconfidentiality" name="datasetconfidentiality" type="number" required="required" min="0" max="2" @@ -133,12 +134,12 @@ {%else%} value="0" {%endif%} - class="form-col-2" /> - </fieldset> + class="form-control" /> + </div> - <fieldset> - <label for="datasetdatascale" class="form-col-1">data scale:</label> - <select id="datasetdatascale" name="datasetdatascale" class="form-col-2"> + <div class="form-group"> + <label for="datasetdatascale" class="form-label">data scale:</label> + <select id="datasetdatascale" name="datasetdatascale" class="form-control"> <option value="">None</option> {%for dscale in datascales:%} <option value="{{dscale}}" @@ -151,17 +152,10 @@ </option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" value="create new dataset" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">create new dataset</button> </form> - </div> {%endblock%} - -{%block javascript%} -{%endblock%} diff --git a/qc_app/templates/select_platform.html b/qc_app/templates/select_platform.html index d69a970..d9bc68f 100644 --- a/qc_app/templates/select_platform.html +++ b/qc_app/templates/select_platform.html @@ -5,58 +5,58 @@ {%block contents%} <h2 class="heading">{{filename}}: select platform</h2> -<form method="POST" action="{{url_for('dbinsert.select_study')}}" - id="select-platform-form" data-genechips="{{genechips_data}}"> - <input type="hidden" name="filename" value="{{filename}}" /> - <input type="hidden" name="filetype" value="{{filetype}}" /> - <input type="hidden" name="totallines" value="{{totallines}}" /> +<div class="row"> + <form method="POST" action="{{url_for('dbinsert.select_study')}}" + id="select-platform-form" data-genechips="{{genechips_data}}"> + <input type="hidden" name="filename" value="{{filename}}" /> + <input type="hidden" name="filetype" value="{{filetype}}" /> + <input type="hidden" name="totallines" value="{{totallines}}" /> - <fieldset> - <label for="species" class="form-col-1">species</label> - <select id="species" name="species" class="form-col-2"> - {%for row in species:%} - <option value="{{row['SpeciesId']}}" - {%if row["Name"] == default_species:%} - selected="selected" - {%endif%}> - {{row["MenuName"]}} - </option> - {%endfor%} - </select> - </fieldset> + <div class="form-group"> + <label for="species" class="form-label">species</label> + <select id="species" name="species" class="form-control"> + {%for row in species:%} + <option value="{{row['SpeciesId']}}" + {%if row["Name"] == default_species:%} + selected="selected" + {%endif%}> + {{row["MenuName"]}} + </option> + {%endfor%} + </select> + </div> - <table id="genechips-table"> - <thead> - <tr> - <th>Select</th> - <th>GeneChip ID</th> - <th>GeneChip Name</th> - </tr> - </thead> + <table id="genechips-table" class="table"> + <caption>select platform</caption> + <thead> + <tr> + <th>Select</th> + <th>GeneChip ID</th> + <th>GeneChip Name</th> + </tr> + </thead> - <tbody> - {%for chip in genechips:%} - <tr> - <td> - <input type="radio" name="genechipid" value="{{chip['GeneChipId']}}" - required="required" /> - </td> - <td>{{chip["GeneChipId"]}}</td> - <td>{{chip["GeneChipName"]}}</td> - </tr> - {%else%} - <tr> - <td colspan="5">No chips found for selected species</td> - </tr> - {%endfor%} - </tbody> - </table> + <tbody> + {%for chip in genechips:%} + <tr> + <td> + <input type="radio" name="genechipid" value="{{chip['GeneChipId']}}" + required="required" /> + </td> + <td>{{chip["GeneChipId"]}}</td> + <td>{{chip["GeneChipName"]}}</td> + </tr> + {%else%} + <tr> + <td colspan="5">No chips found for selected species</td> + </tr> + {%endfor%} + </tbody> + </table> - <fieldset> - <input type="submit" class="btn btn-primary form-col-2" - value="submit platform" /> - </fieldset> -</form> + <button type="submit" class="btn btn-primary">submit platform</button> + </form> +</div> {%endblock%} {%block javascript%} diff --git a/qc_app/templates/select_study.html b/qc_app/templates/select_study.html index e474c50..648ad4c 100644 --- a/qc_app/templates/select_study.html +++ b/qc_app/templates/select_study.html @@ -10,34 +10,36 @@ {%block contents%} <h2 class="heading">{{filename}}: select study</h2> -<div class="two-column-with-separator"> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.select_dataset')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col1"> - <legend>Select from existing study</legend> + <legend class="heading">Select from existing study</legend> {{hidden_fields(filename, filetype, species=species, genechipid=genechipid, totallines=totallines)}} - <fieldset> - <label for="study" class="form-col-1">study:</label> - <select id="study" name="studyid" class="form-col-2"> + <div class="form-group"> + <label class="form-label" for="study">study:</label> + <select id="study" name="studyid" class="form-control"> {%for study in studies:%} <option value="{{study['Id']}}">{{study["Name"]}}</option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" value="submit selected study" - class="btn btn-primary form-col-2" - {%if studies | length == 0:%} - disabled="disabled" - {%endif%} /> - </fieldset> - </form> + <button type="submit" + class="btn btn-primary" + {%if studies | length == 0:%} + disabled="disabled" + {%endif%} />submit selected study</button> +</form> +</div> +<div class="row"> <p class="two-col-sep-separator">OR</p> +</div> +<div class="row"> <form method="POST" action="{{url_for('dbinsert.create_study')}}" id="select-platform-form" data-genechips="{{genechips_data}}" class="two-col-sep-col2"> @@ -50,22 +52,22 @@ </ul> {%endif%} {%endwith%} - <legend>Create new study</legend> + <legend class="heading">Create new study</legend> {{hidden_fields(filename, filetype, species=species, genechipid=genechipid, totallines=totallines)}} - <fieldset> - <label for="studyname" class="form-col-1">name:</label> - <input type="text" id="studyname" name="studyname" class="form-col-2" + <div class="form-group"> + <label class="form-label" for="studyname">name:</label> + <input type="text" id="studyname" name="studyname" class="form-control" required="required" {%if studyname:%} value="{{studyname}}" {%endif%} /> - </fieldset> + </div> - <fieldset> - <label for="group" class="form-col-1">group:</label> - <select id="group" name="inbredsetid" class="form-col-2" + <div class="form-group"> + <label class="form-label" for="group">group:</label> + <select id="group" name="inbredsetid" class="form-control" required="required"> <option value="">Select group</option> {%for family in groups:%} @@ -81,11 +83,11 @@ </optgroup> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <label for="tissue" class="form-col-1">tissue:</label> - <select id="tissue" name="tissueid" class="form-col-2" + <div class="form-group"> + <label class="form-label" for="tissue">tissue:</label> + <select id="tissue" name="tissueid" class="form-control" required="required"> <option value="">Select type</option> {%for tissue in tissues:%} @@ -97,12 +99,9 @@ </option> {%endfor%} </select> - </fieldset> + </div> - <fieldset> - <input type="submit" value="create study" - class="btn btn-primary form-col-2" /> - </fieldset> + <button type="submit" class="btn btn-primary">create study</button> </form> </div> diff --git a/qc_app/templates/stdout_output.html b/qc_app/templates/stdout_output.html index f3fcde5..85345a9 100644 --- a/qc_app/templates/stdout_output.html +++ b/qc_app/templates/stdout_output.html @@ -2,9 +2,7 @@ <h4>STDOUT Output</h4> <div class="cli-output"> - {%for line in job.get("stdout", "").split("\n\n"):%} - <p>{{line}}</p> - {%endfor%} + <pre>{{job.get("stdout", "")}}</pre> </div> {%endmacro%} |