From be1bd398f2277490c60a57dd054e1630aede1111 Mon Sep 17 00:00:00 2001
From: Frederick Muriuki Muriithi
Date: Mon, 28 Apr 2025 13:59:40 -0500
Subject: Allow selection from existing publications.

---
 .../templates/phenotypes/add-phenotypes-base.html  | 200 +++++++++------------
 1 file changed, 86 insertions(+), 114 deletions(-)

(limited to 'uploader')

diff --git a/uploader/templates/phenotypes/add-phenotypes-base.html b/uploader/templates/phenotypes/add-phenotypes-base.html
index 8f50882..1463faa 100644
--- a/uploader/templates/phenotypes/add-phenotypes-base.html
+++ b/uploader/templates/phenotypes/add-phenotypes-base.html
@@ -42,110 +42,22 @@
 
     {%block frm_add_phenotypes_elements%}{%endblock%}
 
-    <div class="checkbox">
-      <label>
-        <input id="chk-published" type="checkbox" name="published?" />
-        These phenotypes are published</label>
-    </div>
-
-    <fieldset id="fldset-publication-info" class="visually-hidden">
+    <fieldset id="fldset-publication-info">
       <legend>Publication Information</legend>
-      <div class="form-group">
-        <label for="txt-pubmed-id" class="form-label">Pubmed ID</label>
-        <div class="input-group">
-          <input id="txt-pubmed-id" name="pubmed-id" type="text"
-                 class="form-control" />
-          <span class="input-group-btn">
-            <button id="btn-search-pubmed-id" class="btn btn-info">Search</button>
-          </span>
-        </div>
-        <span id="search-pubmed-id-error"
-              class="form-text text-muted text-danger visually-hidden">
-        </span><br />
-        <span class="form-text text-muted">
-          Enter your publication's PubMed ID above and click "Search" to search
-          for some (or all) of the publication details requested below.
-        </span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-authors" class="form-label">Authors</label>
-        <input id="txt-publication-authors" name="publication-authors"
-               type="text" class="form-control" />
-        <span class="form-text text-muted">
-          Enter the authors in the following format &hellip;</span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-title" class="form-label">
-          Publication Title</label>
-        <input id="txt-publication-title" name="publication-title" type="text"
-               class="form-control" />
-        <span class="form-text text-muted">
-          Enter your publication's title.</span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-abstract" class="form-label">
-          Publication Abstract</label>
-        <textarea id="txt-publication-abstract" name="publication-abstract"
-                  class="form-control" rows="10"></textarea>
-        <span class="form-text text-muted">
-          Enter the abstract for your publication.</span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-journal" class="form-label">Journal</label>
-        <input id="txt-publication-journal" name="journal" type="text"
-               class="form-control" />
-        <span class="form-text text-muted">
-          Enter the name of the journal where your work was published.</span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-volume" class="form-label">Volume</label>
-        <input id="txt-publication-volume" name="publication-volume" type="text"
-               class="form-control" />
-        <span class="form-text text-muted">
-          Enter the volume in the following format &hellip;</span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-pages" class="form-label">Pages</label>
-        <input id="txt-publication-pages" name="publication-pages" type="text"
-               class="form-control" />
-        <span class="form-text text-muted">
-          Enter the journal volume where your work was published.</span>
-      </div>
-
-      <div class="form-group">
-        <label for="select-publication-month" class="form-label">
-          Publication Month</label>
-        <select id="select-publication-month" name="publication-month"
-                class="form-control">
-          {%for month in monthnames%}
-          <option value="{{month | lower}}"
-                  {%if current_month | lower == month | lower%}
-                  selected="selected"
-                  {%endif%}>{{month | capitalize}}</option>
-          {%endfor%}
-        </select>
-        <span class="form-text text-muted">
-          Select the month when the work was published.
-          <span class="text-danger">
-            This cannot be before, say 1600 and cannot be in the future!</span></span>
-      </div>
-
-      <div class="form-group">
-        <label for="txt-publication-year" class="form-label">Publication Year</label>
-        <input id="txt-publication-year" name="publication-year" type="text"
-               class="form-control" value="{{current_year}}" />
-        <span class="form-text text-muted">
-          Enter the year your work was published.
-          <span class="text-danger">
-            This cannot be before, say 1600 and cannot be in the future!</span>
-        </span>
-      </div>
+      <span class="form-text text-muted">
+        Select a publication for your data</span>
+      <table id="tbl-select-publication" class="table compact stripe">
+        <thead>
+          <tr>
+            <th>#</th>
+            <th>PubMed ID</th>
+            <th>Title</th>
+            <th>Authors</th>
+          </tr>
+        </thead>
+
+        <tbody></tbody>
+      </table>
     </fieldset>
 
     <div class="form-group">
@@ -165,18 +77,78 @@
 
 {%block javascript%}
 <script type="text/javascript">
-
-  $("#chk-published").on("click", (event) => {
-      pub_details = $("#fldset-publication-info")
-      if(event.target.checked) {
-          // display the publication details
-          remove_class(pub_details, "visually-hidden");
-      } else {
-          // hide the publication details
-          add_class(pub_details, "visually-hidden");
-      }
+  $(function() {
+      var publicationsDataTable = buildDataTable(
+          "#tbl-select-publication",
+          [],
+          [
+              {
+                  data: (pub) => {
+                      return `<input type="radio" name="publication-id" ` +
+                          `id="rdo-publication-id-${pub.Id}" value="${pub.Id}" />`;
+                  }
+              },
+              {
+                  data: (pub) => {
+                  if(pub.PubMed_ID) {
+                      return `<a href="https://pubmed.ncbi.nlm.nih.gov/` +
+                          `${pub.PubMed_ID}/" target="_blank" ` +
+                          `title="Link to publication on NCBI.">` +
+                          `${pub.PubMed_ID}</a>`;
+                  }
+                  return "";
+                  }
+              },
+              {
+                  data: (pub) => {
+                  var title = "⸻";
+                  if(pub.Title) {
+                      title = pub.Title
+                  }
+                  return `<a href="/publications/view/${pub.Id}" ` +
+                          `target="_blank" ` +
+                          `title="Link to view publication details">` +
+                          `${title}</a>`;
+                  }
+              },
+              {
+                  data: (pub) => {
+                  authors = pub.Authors.split(",").map(
+                      (item) => {return item.trim();});
+                  if(authors.length > 1) {
+                      return authors[0] + ", et. al.";
+                  }
+                  return authors[0];
+                  }
+              }
+          ],
+          {
+              ajax: {
+                  url: "/publications/list",
+                  dataSrc: "publications"
+              },
+              select: "single",
+              scrollY: 700,
+              paging: false,
+              deferRender: true,
+              layout: {
+                  topStart: "info",
+                  topEnd: "search"
+              }
+          });
+      publicationsDataTable.on("select", (event, datatable, type, indexes) => {
+          rows = $("#tbl-select-publication tbody tr");// Really slow — troubleshoot
+          indexes.forEach((element, index, thearray) => {
+              $(rows[element]).find('input[type="radio"]').attr("checked", true);
+          });
+      });
+      publicationsDataTable.on("deselect", (event, datatable, type, indexes) => {
+          rows = $("#tbl-select-publication tbody tr");// Really slow — troubleshoot
+          indexes.forEach((element, index, thearray) => {
+              $(rows[element]).find('input[type="radio"]').attr("checked", false);
+          });
+      });
   });
-
 </script>
 
 {%block more_javascript%}{%endblock%}
-- 
cgit v1.2.3