about summary refs log tree commit diff
path: root/uploader/templates/species/create-species.html
diff options
context:
space:
mode:
Diffstat (limited to 'uploader/templates/species/create-species.html')
-rw-r--r--uploader/templates/species/create-species.html148
1 files changed, 148 insertions, 0 deletions
diff --git a/uploader/templates/species/create-species.html b/uploader/templates/species/create-species.html
new file mode 100644
index 0000000..138dbaa
--- /dev/null
+++ b/uploader/templates/species/create-species.html
@@ -0,0 +1,148 @@
+{%extends "species/base.html"%}
+{%from "flash_messages.html" import flash_all_messages%}
+
+{%block title%}Create Species{%endblock%}
+
+{%block pagetitle%}Create Species{%endblock%}
+
+{%block lvl2_breadcrumbs%}
+<li {%if activelink=="create-species"%}
+    class="breadcrumb-item active"
+    {%else%}
+    class="breadcrumb-item"
+    {%endif%}>
+  <a href="{{url_for('species.create_species')}}">Create</a>
+</li>
+{%endblock%}
+
+{%block contents%}
+<div class="row">
+  <form id="frm-create-species"
+        method="POST"
+        action="{{url_for('species.create_species', return_to=return_to)}}"
+        class="form-horizontal">
+    <legend>Create Species</legend>
+
+    {{flash_all_messages()}}
+
+    <input type="hidden" name="return_to" value="{{return_to}}">
+
+    <div class="form-group">
+      <label for="txt-taxonomy-id" class="control-label col-sm-2">
+        Taxonomy ID</label>
+      <div class="col-sm-10">
+        <div class="input-group">
+          <input id="txt-taxonomy-id"
+                 name="species_taxonomy_id"
+                 type="text"
+                 class="form-control" />
+          <span class="input-group-btn">
+            <button id="btn-search-taxonid" class="btn btn-info">Search</button>
+          </span>
+        </div>
+        <small class="form-text text-small text-muted">
+          Use
+          <a href="https://www.ncbi.nlm.nih.gov/Taxonomy/taxonomyhome.html/"
+             title="NCBI's Taxonomy Browser homepage"
+             target="_blank">
+            NCBI's Taxonomy Browser homepage</a> to search for the species you
+          want. If the species exists on NCBI, they will have a Taxonomy ID. Copy
+          that Taxonomy ID to this field, and click "Search" to auto-fill the
+          details.<br />
+          This field is optional.</small>
+      </div>
+    </div>
+
+    <div class="form-group">
+      <label for="txt-species-name" class="control-label col-sm-2">Common Name</label>
+      <div class="col-sm-10">
+        <input id="txt-species-name"
+               name="common_name"
+               type="text"
+               class="form-control"
+               required="required" />
+        <small class="form-text text-muted">This is the day-to-day term used by
+          laymen, e.g. Mouse (instead of Mus musculus), round worm (instead of
+          Ascaris lumbricoides), etc.<br />
+          For species without this, just enter the scientific name.
+        </small>
+      </div>
+    </div>
+
+    <div class="form-group">
+      <label for="txt-species-scientific" class="control-label col-sm-2">
+        Scientific Name</label>
+      <div class="col-sm-10">
+        <input id="txt-species-scientific"
+               name="scientific_name"
+               type="text"
+               class="form-control"
+               required="required" />
+        <small class="form-text text-muted">This is the scientific name for the
+          species e.g. Homo sapiens, Mus musculus, etc.</small>
+      </div>
+    </div>
+
+    <div class="form-group">
+      <label for="select-species-family" class="control-label col-sm-2">Family</label>
+      <div class="col-sm-10">
+        <select id="select-species-family"
+                name="species_family"
+                required="required"
+                class="form-control">
+          <option value="ungrouped">I do not know what to pick</option>
+          {%for family in families%}
+          <option value="{{family}}">{{family}}</option>
+          {%endfor%}
+        </select>
+        <small class="form-text text-muted">
+          This is a rough grouping of the species.</small>
+      </div>
+    </div>
+
+    <div class="col-sm-offset-2 col-sm-10">
+      <input type="submit"
+             value="create new species"
+             class="btn btn-primary" />
+    </div>
+
+  </form>
+</div>
+{%endblock%}
+
+{%block javascript%}
+<script>
+  var lastTaxonId = null;
+
+  var fetch_taxonomy = (taxonId) => {
+      var uri = (
+          "https://rest.uniprot.org/taxonomy/" + encodeURIComponent(taxonId));
+      $.get(
+          uri,
+          {},
+          (data, textStatus, jqXHR) => {
+              if(textStatus == "success") {
+                  lastTaxonId = taxonId;
+                  $("#txt-species-scientific").val(data.scientificName);
+                  $("#txt-species-name").val(data.commonName);
+                  return false;
+              }
+              msg = (
+                  "Request to '${uri}' failed with message '${textStatus}'. "
+                      + "Please try again later, or fill the details manually.");
+              alert(msg);
+              console.error(msg, data, textStatus);
+              return false;
+          },
+          "json");
+  };
+
+  $("#btn-search-taxonid").on("click", (event) => {
+      event.preventDefault();
+      taxonId = $("#txt-taxonomy-id").val();
+      if((taxonId !== "") && (taxonId !== lastTaxonId)) {
+          fetch_taxonomy(taxonId);
+      }
+  });
+</script>
+{%endblock%}