From 3c960f6cf885934e5f390390c9e0fae0d6b93d5d Mon Sep 17 00:00:00 2001
From: Frederick Muriuki Muriithi
Date: Tue, 18 Feb 2025 11:10:29 -0600
Subject: Enable creating new populations on the "Phenotype Data" path.

Enable creating new populations in the case where the population a
user wants to use does not exist in the database.
---
 .../templates/phenotypes/select-population.html    | 20 +++++---
 .../templates/populations/create-population.html   |  5 +-
 .../populations/macro-select-population.html       | 55 ++++++++++++----------
 3 files changed, 47 insertions(+), 33 deletions(-)

(limited to 'uploader/templates')

diff --git a/uploader/templates/phenotypes/select-population.html b/uploader/templates/phenotypes/select-population.html
index eafd4a7..d6e6aa1 100644
--- a/uploader/templates/phenotypes/select-population.html
+++ b/uploader/templates/phenotypes/select-population.html
@@ -11,18 +11,24 @@
 {%block contents%}
 {{flash_all_messages()}}
 
-<div class="row">
-  <p>Select the population for your phenotypes to view and manage the phenotype
-    datasets that relate to it.</p>
-</div>
 
 <div class="row">
-  {{select_population_form(url_for("species.populations.phenotypes.select_population",
-  species_id=species.SpeciesId),
-  populations)}}
+  {{select_population_form(url_for("species.populations.phenotypes.select_population", species_id=species.SpeciesId), species, populations)}}
 </div>
 {%endblock%}
 
 {%block sidebarcontents%}
 {{display_species_card(species)}}
 {%endblock%}
+
+{%block javascript%}
+<script type="text/javascript"
+        src="{{url_for('base.datatables',
+             filename='js/jquery.dataTables.js')}}"></script>
+<script type="text/javascript" src="/static/js/populations.js"></script>
+<script type="text/javascript">
+  $(function() {
+      populationDataTable(JSON.parse($("#tbl-select-population").attr("data-populations-list")));
+  });
+  </script>
+{%endblock%}
diff --git a/uploader/templates/populations/create-population.html b/uploader/templates/populations/create-population.html
index 86aebda..c0c4f45 100644
--- a/uploader/templates/populations/create-population.html
+++ b/uploader/templates/populations/create-population.html
@@ -37,12 +37,15 @@
 <div class="row">
   <form method="POST"
         action="{{url_for('species.populations.create_population',
-                species_id=species.SpeciesId)}}">
+                species_id=species.SpeciesId,
+                return_to=return_to)}}">
 
     <legend>Create Population</legend>
 
     {{flash_all_messages()}}
 
+    <input type="hidden" name="return_to" value="{{return_to}}">
+
     <div {%if errors.population_fullname%}
          class="form-group has-error"
          {%else%}
diff --git a/uploader/templates/populations/macro-select-population.html b/uploader/templates/populations/macro-select-population.html
index ef74ac3..b7ff088 100644
--- a/uploader/templates/populations/macro-select-population.html
+++ b/uploader/templates/populations/macro-select-population.html
@@ -1,33 +1,38 @@
-{%macro select_population_form(form_action, populations)%}
+{%macro select_population_form(form_action, species, populations)%}
 <form method="GET" action="{{form_action}}" class="form-horizontal">
-  <legend>Select Population</legend>
 
-  <div class="form-group">
-    <label for="select-population" class="control-label col-sm-2">
-      Population</label>
-    <div class="col-sm-10">
-      <select id="select-population"
-              name="population_id"
-              class="form-control"
-              required="required">
-        <option value="">Select Population</option>
-        {%for family in populations%}
-        <optgroup {%if family[0][1] is not none%}
-                  label="{{family[0][1]}}"
-                  {%else%}
-                  label="Undefined"
-                  {%endif%}>
-          {%for population in family[1]%}
-          <option value="{{population.Id}}">{{population.FullName}}</option>
-          {%endfor%}
-        </optgroup>
-        {%endfor%}
-      </select>
-    </div>
+  {%if populations | length != 0%}
+
+  <label class="control-label">What population will you be working with?</label>
+  <table id="tbl-select-population" class="table compact stripe"
+         data-populations-list='{{populations | tojson}}'>
+    <thead>
+      <tr>
+        <th></th>
+        <th>Population</th>
+      </tr>
+    </thead>
+
+    <tbody></tbody>
+  </table>
+
+  <div>
+    <label class="control-label">
+      <input type="radio" name="population_id" value="CREATE-POPULATION" />
+      I cannot find the population I want &mdash; create it!
+    </label>
   </div>
 
+  {%else%}
+  <p class="form-text">
+    There are no populations currently defined for {{species['FullName']}}
+    ({{species['SpeciesName']}}).<br />
+    Click "Continue" to create the first!</p>
+  <input type="hidden" name="population_id" value="CREATE-POPULATION" />
+  {%endif%}
+
   <div class="col-sm-offset-2 col-sm-10">
-    <input type="submit" value="Select" class="btn btn-primary" />
+    <input type="submit" value="continue" class="btn btn-primary" />
   </div>
 </form>
 {%endmacro%}
-- 
cgit v1.2.3