Added html/css for new "Filter Samples by Value" feature and changed a couple class names to make more sense for being shared between both this feature and "Block Samples by Index"

2 files changed, 23 insertions, 4 deletions

diff --git a/wqflask/wqflask/static/new/css/show_trait.css b/wqflask/wqflask/static/new/css/show_trait.css
index 5e1a279b..39c6ba53 100644
--- a/wqflask/wqflask/static/new/css/show_trait.css
+++ b/wqflask/wqflask/static/new/css/show_trait.css
@@ -145,11 +145,11 @@ input.corr-location {
   display: inline;
 }
 
-div.block-by-index-div {
+div.block-div {
   margin-bottom: 10px;
 }
 
-div.block-by-attribute-div {
+div.block-div-2 {
   margin-top:10px;
   margin-bottom:10px;
 }
diff --git a/wqflask/wqflask/templates/show_trait_transform_and_filter.html b/wqflask/wqflask/templates/show_trait_transform_and_filter.html
index 0418d972..22c52d8c 100644
--- a/wqflask/wqflask/templates/show_trait_transform_and_filter.html
+++ b/wqflask/wqflask/templates/show_trait_transform_and_filter.html
@@ -4,7 +4,7 @@
         <strong>Reset</strong> option as
         needed.
     </p>
-    <div id="blockMenuSpan" class="input-append block-by-index-div">
+    <div id="blockMenuSpan" class="input-append block-div">
         <label for="remove_samples_field">Block samples by index:</label>
         <input type="text" id="remove_samples_field" placeholder="Example: 3, 5-10, 12">
         <select id="block_group" size="1">
@@ -20,8 +20,27 @@
     <div id="remove_samples_invalid" class="alert alert-error" style="display:none;">
           Please check that your input is formatted correctly, e.g. <strong>3, 5-10, 12</strong>
     </div>
+    <div id="filterMenuSpan" class="input-append block-div-2">
+      <label for="filter_samples_field">Filter samples by value </label>
+      <select id="filter_logic" size="1">
+        <option value="greater_than">></option>
+        <option value="less_than"><</option>
+        <option value="greater_or_equal">≥</option>
+        <option value="less_or_equal">≤</option>
+      </select>
+      <input type="text" id="filter_value" placeholder="Example: 3, 10, 15">
+      <select id="filter_group" size="1">
+        <option value="primary">
+          {{ sample_group_types['samples_primary'] }}
+        </option>
+        <option value="other">
+          {{ sample_group_types['samples_other'] }}
+        </option>
+      </select>
+      <input type="button" id="filter_by_value" class="btn btn-danger" value="Filter">
+    </div>
     {% if sample_groups[0].attributes %}
-    <div class="input-append block-by-attribute-div">
+    <div class="input-append block-div-2">
         <label for="exclude_menu">Block samples by group:</label>
         <select id="exclude_menu" size=1>
           {% for attribute in sample_groups[0].attributes %}