{%extends "base.html"%}
{%from "flash_messages.html" import flash_all_messages%}
{%from "macro-forms.html" import add_http_feature_flags%}

{%block title%}Home{%endblock%}

{%block pagetitle%}Home{%endblock%}

{%block extra_breadcrumbs%}{%endblock%}

{%block contents%}

{%macro add_form_buttons()%}
<div class="row form-buttons">
  <div class="col">
    <input type="submit"
           class="btn btn-primary"
           value="use selected species" />
  </div>
  <div class="col">
    <a href="{{url_for('species.create_species', return_to='base.index')}}"
       class="btn btn-outline-primary"
       title="Add a new species to Genenetwork.">add a new Species</a>
  </div>
</div>
{%endmacro%}

<div class="row">{{flash_all_messages()}}</div>

{%if user_logged_in()%}

<div class="row">
  <ul class="nav nav-tabs" id="index-actions">
    <li class="nav-item presentation">
      <button class="nav-link active"
              id="upload-data-tab"
              data-bs-toggle="tab"
              data-bs-target="#upload-data-content"
              type="button"
              role="tab"
              aria-controls="upload-data-content"
              aria-selected="false">Upload Data</button></li>
    <li class="nav-item presentation">
      <button class="nav-link"
              id="publications-tab"
              data-bs-toggle="tab"
              data-bs-target="#publications-content"
              type="button"
              role="tab"
              aria-controls="publications-content"
              aria-selected="true">Publications</button></li>
  </ul>
</div>

<div class="row">
  <div class="tab-content" id="upload-data-tabs-content">
    <div class="tab-pane fade show active"
         id="upload-data-content"
         role="tabpanel"
         aria-labelledby="upload-data-content-tab">
      <h2 class="heading">Species</h2>

      <p>Select the species you want to work with.</p>

      <form method="GET" action="{{url_for('base.index')}}" class="form-horizontal">
        {{add_http_feature_flags()}}

        {{add_form_buttons()}}

        {%if species | length != 0%}
        <div style="margin-top:1em;">
          <table id="tbl-select-species" class="table compact stripe"
                 data-species-list='{{species | tojson}}'>
            <thead>
              <tr>
                <th></th>
                <th>Species Name</th>
              </tr>
            </thead>

            <tbody></tbody>
          </table>
        </div>

        {%else%}

        <label class="control-label" for="rdo-cant-find-species">
          <input id="rdo-cant-find-species" type="radio" name="species_id"
                 value="CREATE-SPECIES" />
          There are no species to select from. Create the first one.</label>

        <div class="col-sm-offset-10 col-sm-2">
          <input type="submit"
                 class="btn btn-primary col-sm-offset-1"
                 value="continue" />
        </div>

        {%endif%}

        {{add_form_buttons()}}

      </form>
    </div>

    <div class="tab-pane fade"
         id="publications-content"
         role="tabpanel"
         aria-labelledby="publications-content-tab">
      <p>You can view, edit, and delete existing publications, as well as add
        new ones, by clicking the button below.</p>

      <a href="{{url_for('publications.index')}}"
         title="Manage publications."
         class="btn btn-primary">manage publications</a>
    </div>
  </div>
</div>

{%else%}

<div class="row">
  <img src="/static/images/frontpage_banner.png"
       alt="Banner image showing the process flow a user would follow." />
</div>

<div class="row">
  <p>The GeneNetwork Uploader (gn-uploader) lets you easily add new data to the
    GeneNetwork System. It automatically checks your data for quality and walks
    you through fixing any issues before submission.</p>
</div>

<div class="row">
  <div class="col">
      <a href="{{authserver_authorise_uri()}}"
         title="Sign in to the system"
         class="btn btn-primary">Sign in</a>
  </div>
</div>
{%endif%}

{%endblock%}



{%block sidebarcontents%}
{%if view_under_construction%}
<div class="row">
  <p>The data in Genenetwork is related to one species or another. Use the form
    provided to select from existing species, or click on the
    "Create a New Species" button if you cannot find the species you want to
    work with.</p>
</div>
<div class="row">
  <form id="frm-quick-navigation">
    <legend>Quick Navigation</legend>
    <div class="form-group">
      <label for="fqn-species-id">Species</label>
      <select name="species_id">
        <option value="">Select species</option>
      </select>
    </div>
  </form>
</div>
{%endif%}
{%endblock%}


{%block javascript%}
<script type="text/javascript" src="/static/js/species.js"></script>
{%endblock%}