--- a
+++ b/qiita_pet/templates/redbiom.html
@@ -0,0 +1,224 @@
+{% from qiita_core.qiita_settings import qiita_config %}
+{% extends sitebase.html %}
+
+{%block head%}
+<script type="text/javascript" src="{% raw qiita_config.portal_dir %}/static/js/sharing.js"></script>
+<script type="text/javascript">
+  $(document).ready(function() {
+
+    $("#search").keyup(function() {
+      var new_value = $(this).val().replace('`', "'")
+                                   .replace('~', "'")
+                                   .replace('ยด', "'");
+      $(this).val(new_value);
+    });
+
+    qiita_websocket.init(window.location.host + '{% raw qiita_config.portal_dir %}/study/list/socket/', error, error);
+    qiita_websocket.add_callback('sel', show_alert);
+    $("#redbiom-table").dataTable({
+      "dom": '<"ps">lfr<t><"footer">ip',
+      'footerCallback': function ( row, data, start, end, display ) {
+        var api = this.api(), artifacts = 0, samples = 0;
+
+        api.column(0).nodes().each(function (cell, i) {
+          var elements = $(cell).children().children().children();
+          var idx = elements.length - 1;
+          var text = $(elements[idx]).text();
+          elements = text.split(" | ");
+          artifacts += parseInt(elements[0].split(": ")[1]);
+          samples += parseInt(elements[1].split(": ")[1]);
+        });
+
+        $('.footer').addClass("col-md-12 text-right");
+        if (artifacts == 0) {
+          text = '';
+        } else {
+            text = 'Found ' + artifacts + ' artifacts with ' + samples + ' samples.';
+        }
+        $('.footer').html(text)
+      },
+      "columns": [
+        { "orderable": false,       "width": "20%", "data": "artifact_biom_ids"},
+        { "data": "study_title",    "width": "70%" },
+        { "data": "study_abstract", "width": "0%" },
+        { "data": "study_id",       "width": "10%" },
+        { "data": "study_alias",    "width": "0%" }],
+      columnDefs: [
+        // {type:'natural', targets:[2,6,7]},
+        {"targets": [ 2, 4 ], "visible": false},
+        // render zero
+        {"render": function ( data, type, row, meta ) {
+          if (data !== null && data !== undefined){
+            var artifacts = 0, unique_samples = {};
+            for (var d in data) {
+              if (data.hasOwnProperty(d)) {
+                // to get only unique sample names we will create a dict
+                // and then just get the keys; by creating a dict we are
+                // avoiding to check if an element is already in the list
+                var samples = data[d];
+                for (var i = 0; i < samples.length; i++) {
+                  if (! unique_samples[samples[i]] ) {
+                    unique_samples[samples[i]] = true;
+                  }
+                }
+                artifacts++;
+              }
+            }
+            unique_samples = Object.keys(unique_samples);
+            if (artifacts != 0) {
+              return '<div class="container" style="max-width: 15em;">'+
+                '<div class="row justify-content-md-center">' +
+                  {% if current_user is not None %}
+                    '<div class="col-md-12 text-center details-control">&nbsp;</div>' +
+                  {% end %}
+                  '<div class="col-md-12 text-center">' +
+                    'Artifacts: ' + artifacts + ' | ' +
+                    'Samples: ' + unique_samples.length +
+                  '</div>' +
+                '</div>' +
+              '</div>';
+            }
+          }
+          return 'No BIOMs';
+        }, targets: [0]},
+        // render the title cell
+        {"render": function ( data, type, row, meta ) {
+          {% if current_user is not None %}
+            result = "<a target='_blank' href='{% raw qiita_config.portal_dir %}/study/description/" + row.study_id +
+              "' id='study"+ meta.row +"-title'>"+ data +"</a>";
+          {% else %}
+             result = data
+          {% end %}
+            return result
+        }, targets: [1]},
+        ],
+      "language": {
+          "search": "Filter results by column data:",
+          "loadingRecords": "Please wait - loading information ...",
+          "zeroRecords": "  "
+      },
+  });
+
+  // Add event listener for opening and closing details
+  $('#redbiom-table tbody').on('click', 'div.details-control', function () {
+      var table = $('#redbiom-table').DataTable();
+      var tr = $(this).closest('tr');
+      var row = table.row( tr );
+
+      if ( row.child.isShown() ) {
+        // This row is already open - close it
+        row.child.hide();
+        tr.removeClass('shown');
+      } else {
+        // Open this row
+        // modified from: https://jsfiddle.net/8rejaL88/2/
+        tr.addClass('shown');
+        row.child('<p><center><img src="{% raw qiita_config.portal_dir %}/static/img/waiting.gif" style="display:block;margin-left: auto;margin-right: auto"/></center></p>', 'no-padding' ).show();
+
+        var artifact_biom_ids = row.data().artifact_biom_ids;
+        var artifact_biom_ids_keys = []
+        $.each(artifact_biom_ids, function(e){ artifact_biom_ids_keys.push(e) });
+        $.post('/artifact/info/', {ids: artifact_biom_ids_keys })
+          .done(function ( data ) {
+            if (data['status']=='success') {
+              $('td', row.child()).html(format_biom_rows(data.data, row.index(), true, samples=artifact_biom_ids)).show();
+            } else {
+              bootstrapAlert('ERROR: ' + data['msg'], "danger", 10000);
+            }
+          });
+      }
+  });
+
+  $("#submitForm").submit(function(event){
+    event.preventDefault();
+
+    show_loading("redbiom-info", true);
+
+    var search = $("#search").val();
+    var search_on = $("#search_on").val();
+    var redbiom_info = $('#redbiom-info');
+
+    $.post("/redbiom/", {'search': search, 'search_on': search_on})
+      .done(function ( data ){
+        var redbiom_table = $('#redbiom-table').DataTable();
+        // the next 4 lines reset the column filtering
+        var placer = $(".ps");
+        redbiom_table.column(3).search("").draw();
+        redbiom_table.clear().draw();
+        placer.empty();
+        if(data.status == "error") {
+          bootstrapAlert(data.message.replace("\n", "<br/>"), "danger");
+        } else {
+          if(data.message != ''){
+            redbiom_info.html(
+              `<div class="alert alert-warning alert-dismissible" role="alert">
+              <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+              <strong>Warning!</strong> ` + data.message + `</div><br/>`)
+          } else if(data.data){
+            redbiom_table.rows.add(data.data).draw();
+            redbiom_info.html('');
+          }
+        }
+      })
+    .fail(function(response, status, error) {
+      var text = 'The query response is larger than is currently allowed, please try another. <a href="https://github.com/biocore/qiita/issues/2312" target="_blank">Track progress on this issue.</a>';
+      if (response.status != 504) {
+        text = 'Status code: "' + response.status + '" - ' + error + '.<br/>Please send a screenshot to <a href="mailto:{% raw qiita_config.portal_dir %}">{% raw qiita_config.portal_dir %}</a>.';
+      }
+      redbiom_info.html(
+        `<div class="alert alert-danger alert-dismissible" role="alert">
+        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+        <strong>Error!</strong> ` + text + `</div><br/>`)
+    })
+    });
+  });
+</script>
+
+{%end%}
+
+{%block content%}
+  <small>
+    <!-- Date to be fixed once we fix: https://github.com/biocore/qiita/issues/2773 -->
+    Redbiom only searches on public data. Last update: <i>{{latest_release}}</i>. Note that you will only be able to expand and add artifacts to analyses if you are signed into Qiita.
+    <br/><br/>
+    <a href="{% raw qiita_config.portal_dir %}/static/doc/html/redbiom.html" class="btn btn-info btn-sm" target="_blank">Help and examples?</a>
+    <br/>
+  </small>
+  <br/>
+  <form data-toggle="validator" role="form" id="submitForm">
+    <div class="form-group row">
+      <div class="col-xs-8">
+        <input type="text" class="form-control" name="search" id="search" placeholder="Search" required>
+      </div>
+      <div class="col-xs-2">
+        <select class="selectpicker form-control col-xs-2" name="search_on" id="search_on">
+          <option value="metadata">Metadata</option>
+          <option checked value="feature">Feature</option>
+          <option checked value="taxon">Taxon</option>
+        </select>
+      </div>
+      <div class="col-xs-1">
+        <button class="btn btn-default" type="submit"><span class="glyphicon glyphicon-search"></span></button>
+      </div>
+    </div>
+  </form>
+  <hr>
+
+  <div class="row">
+    <div class="col-md-12" id="redbiom-info"></div>
+  </div>
+  <div class="row">
+    <table id="redbiom-table" class="table table-bordered gray-msg">
+      <thead>
+        <tr>
+          <th>Expand for analysis (artifact count)</th>
+          <th>Title</th>
+          <th>Abstract</th>
+          <th>Study ID</th>
+          <th>Study Alias</th>
+        </tr>
+      </thead>
+    </table>
+  </div>
+
+{% end %}