{% extends "base.html" %}
<!DOCTYPE html>
<html>
   <head>
    {% block head %}
      <title>Sample Analysis</title>
      {{ super() }}
      <link rel="stylesheet" href="https://www.distributedgenomics.ca/static/ag-grid.css">
      <link rel="stylesheet" href="https://www.distributedgenomics.ca/static/ag-theme-balham.css">
   </head>
   {% endblock %}
   {% block nav %}
     {{ super() }}
   {% endblock %}

   {% block content %}
      <div id="sample_analysis">
        <h2 style="text-align: center; margin-bottom: 100px;" class="title" id="sample_analysis_title">Sample Analysis</h2>
         <div class="wrapper" style="margin-top: 50px">
               <select class="form-control" id="sampleSelect"></select>
               <button id="sampleSearch" class="btn btn-primary" name="submit">Submit</button>
         </div>
         <div class="container-fluid row" style="margin-top: 50px;">
               <div class="col-sm-2 ag-theme-balham" id="extractions"></div>
               <div class="col-sm-2 ag-theme-balham" id="alignments"></div>
               <div class="col-sm-2 ag-theme-balham" id="sequencing"></div>
               <div class="col-sm-2 ag-theme-balham" id="variantcalling"></div>
               <div class="col-sm-2 ag-theme-balham" id="fusiondetection"></div>
               <div class="col-sm-2 ag-theme-balham" id="expressionanalysis"></div>
         </div>
      </div>
    {% endblock %}

   {% block footer %}
      {{ super() }}
      <script src="https://www.distributedgenomics.ca/static/ag-grid-community.min.noStyle.js"></script>
      <script src="{{prepend_path}}/static/dist/sample_analysis.js"></script>
    {% endblock %}
</html>