From 4aa6d2cba4128e75adfe9a91954aff1bd46ef7ae Mon Sep 17 00:00:00 2001
From: Frederick Muriuki Muriithi
Date: Mon, 6 Jan 2025 13:12:20 -0600
Subject: Add resumable UI elements for all file inputs.

---
 .../phenotypes/add-phenotypes-raw-files.html       | 51 ++++++++++++++++++----
 1 file changed, 43 insertions(+), 8 deletions(-)

(limited to 'uploader')

diff --git a/uploader/templates/phenotypes/add-phenotypes-raw-files.html b/uploader/templates/phenotypes/add-phenotypes-raw-files.html
index 8d29823..2264b59 100644
--- a/uploader/templates/phenotypes/add-phenotypes-raw-files.html
+++ b/uploader/templates/phenotypes/add-phenotypes-raw-files.html
@@ -128,13 +128,15 @@
   "resumable-phenotype-descriptions",
   "phenotype descriptions",
   '<p>You can drop a CSV file that contains the phenotype descriptions here,
-    or you can click the "Browse" button to select it from your computer.</p>
+    or you can click the "Browse" button (below and to the right) to select it
+    from your computer.</p>
   <p>The CSV file must conform to some standards, as documented in the
     <a href="#docs-file-phenotype-description"
        title="Documentation of the phenotype data file format.">
       "Phenotypes Descriptions" documentation</a> section below.</p>')}}
 
-  <div class="form-group">
+
+  <div class="form-group non-resumable-elements">
     <label for="finput-phenotype-data" class="form-label">Phenotype Data</label>
     <input id="finput-phenotype-data"
            name="phenotype-data"
@@ -144,13 +146,24 @@
            required="required"  />
     <span class="form-text text-muted">
       Provide a file that contains only the phenotype data. See
-      <a href="#docs-phenotype-data"
+      <a href="#docs-file-phenotype-data"
          title="Documentation of the phenotype data file format.">
         the documentation for the expected format of the file</a>.</span>
   </div>
 
+  {{display_resumable_elements(
+  "resumable-phenotype-data",
+  "phenotype data",
+  '<p>You can drop a CSV file that contains the phenotype data here,
+    or you can click the "Browse" button (below and to the right) to select it
+    from your computer.</p>
+  <p>The CSV file must conform to some standards, as documented in the
+    <a href="#docs-file-phenotype-data"
+       title="Documentation of the phenotype data file format.">
+      "Phenotypes Data" documentation</a> section below.</p>')}}
+
   {%if population.Family in families_with_se_and_n%}
-  <div class="form-group">
+  <div class="form-group non-resumable-elements">
     <label for="finput-phenotype-se" class="form-label">Phenotype: Standard Errors</label>
     <input id="finput-phenotype-se"
            name="phenotype-se"
@@ -162,8 +175,19 @@
       Provide a file that contains only the standard errors for the phenotypes,
       computed from the data above.</span>
   </div>
+  {{display_resumable_elements(
+  "resumable-phenotype-se",
+  "standard errors",
+  '<p>You can drop a CSV file that contains the computed standard-errors data
+    here, or you can click the "Browse" button (below and to the right) to
+    select it from your computer.</p>
+  <p>The CSV file must conform to some standards, as documented in the
+    <a href="#docs-file-phenotype-se"
+       title="Documentation of the phenotype data file format.">
+      "Phenotypes Data" documentation</a> section below.</p>')}}
 
-  <div class="form-group">
+  
+  <div class="form-group non-resumable-elements">
     <label for="finput-phenotype-n" class="form-label">Phenotype: Number of Samples/Individuals</label>
     <input id="finput-phenotype-n"
            name="phenotype-n"
@@ -175,6 +199,17 @@
       Provide a file that contains only the number of samples/individuals used in
       the computation of the standard errors above.</span>
   </div>
+  {{display_resumable_elements(
+  "resumable-phenotype-n",
+  "number of samples/individuals",
+  '<p>You can drop a CSV file that contains the number of samples/individuals
+    used in computation of the standard-errors here, or you can click the
+    "Browse" button (below and to the right) to select it from your computer.
+  </p>
+  <p>The CSV file must conform to some standards, as documented in the
+    <a href="#docs-file-phenotype-n"
+       title="Documentation of the phenotype data file format.">
+      "Phenotypes Data" documentation</a> section below.</p>')}}
 </fieldset>
 {%endif%}
 {%endblock%}
@@ -284,9 +319,9 @@
     comma as a way to separate the "general category and ontology terms".</p>
 
   <h3 class="subheading">file: Phenotype Data, Standard Errors and/or Sample Counts</h3>
-  <span id="docs-phenotype-data"></span>
-  <span id="docs-phenotype-se"></span>
-  <span id="docs-phenotype-n"></span>
+  <span id="docs-file-phenotype-data"></span>
+  <span id="docs-file-phenotype-se"></span>
+  <span id="docs-file-phenotype-n"></span>
   <p>The data is a matrix of <em>phenotypes × individuals</em>, e.g.</p>
   <code>
     # num-cases: 2549
-- 
cgit v1.2.3