<!doctype html>
<html>
  <head>
    {% block head %}
      <link type="text/css" rel="stylesheet" href="{{prepend_path}}/static/loader.css">
      <link rel=stylesheet type=text/css href="https://www.distributedgenomics.ca/static/bootstrap.min.css">
      <link type="text/css" rel="stylesheet" href="{{prepend_path}}/static/dashboard.css">
      <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
      <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
    {% endblock %}
  </head>
  <body>
  {% block nav %}
     <nav class="navbar navbar-expand-sm bg-light">
        <a class="navbar-brand col-1" href="/">
          <img src="https://www.distributedgenomics.ca/static/logo.png" height="35" alt="">
        </a>
      <!-- Links -->
      <ul class="nav col-9" id="topTabs" style="border-bottom:0px;">
         <li class="active">
            <a class="nav-link" href="{{prepend_path}}/"><i class="fas fa-tachometer-alt"></i> Homepage</a>
         </li>
         <li>
            <a class="nav-link" href="{{prepend_path}}/gene_search"><i class="fas fa-search"></i> Gene Search</a>
         </li>
         <li>
            <a class="nav-link" href="{{prepend_path}}/patients_overview"><i class="fas fa-users"></i> Patient Overview</a>
         </li>
         <li>
            <a class="nav-link" href="{{prepend_path}}/sample_analysis"><i class="fas fa-chart-bar"></i> Sample Analysis</a>
         </li>
          <li>
            <a class="nav-link" href="{{prepend_path}}/custom_visualization"><i class="fas fa-chart-pie"></i> Custom Visualization</a>
         </li>
      </ul>
      <span class="dropdown show col-1">
         <a class="dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
           <span class="text" id="dropdownMenuLink"></span>
         </a>
         <span class="dropdown-menu dropdown-menu-right" id="dropdown-menu" aria-labelledby="dropdownMenuLink"></span>
      </span>
      <div class="dropdown show col-1">
         <a class="dropdown-toggle" href="#" role="button" id="user-dropdown-top" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
             <span class="text"><i class="fas fa-user-circle"></i> {{ username }}</span></a>
         <ul class="dropdown-menu dropdown-menu-right" id="user-dropdown" aria-labelledby="dropdownMenuLink">
            <a class="dropdown-item" href="{{prepend_path}}/serverinfo" target="_blank"><i class="fas fa-info-circle"></i> Server info</a>
            <a class="dropdown-item" href="{{prepend_path}}/api_info" target="_blank"><i class="fas fa-file-alt"></i> API info</a>
            <a class="dropdown-item" href="/auth/logout"><i class="fas fa-sign-out-alt"></i> Logout</a>
         </ul>
      </div>
   </nav>

    <div class="alert alert-danger alert-dismissible" role="alert" id="warningMsg" style="display:none">
      <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
    </div>

   <div id="initial_loader" class="wrapper">
        <img src="https://www.distributedgenomics.ca/static/logo.png" height="100" alt="" class="logo_image">
         <div class="sk-folding-cube">
            <div class="sk-cube1 sk-cube"></div>
            <div class="sk-cube2 sk-cube"></div>
            <div class="sk-cube4 sk-cube"></div>
            <div class="sk-cube3 sk-cube"></div>
          </div>
   </div>
  {% endblock %}
  {% block content %}{% endblock %}

  {% block footer %}
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
      <script src="https://www.distributedgenomics.ca/static/bootstrap.min.js"></script>
      <script src="https://www.distributedgenomics.ca/static/highcharts.js"></script>
      <script type="text/javascript">
      let datasetId;
      let finalDatasetName = [];
      let finalDatasetId = [];
      const prepend_path = '{{prepend_path}}';
    </script>
    <script src="{{prepend_path}}/static/dist/global.js"></script>
  {% endblock %}
  </body>
</html>