{%extends "expression-data/index.html"%}
{%from "flash_messages.html" import flash_messages%}
{%from "species/macro-display-species-card.html" import display_species_card%}

{%block title%}Select Grouping/Population{%endblock%}

{%block contents%}
<h1 class="heading">Select grouping/population</h1>

<div class="row">
  <p>The data is organised in a hierarchical form, beginning with
    <em>species</em> at the very top. Under <em>species</em> the data is
    organised by <em>population</em>, sometimes referred to as <em>grouping</em>.
    (In some really old documents/systems, you might see this referred to as
    <em>InbredSet</em>.)</p>
  <p>In this section, you get to define what population your data is to be
    organised by.</p>
</div>

<div class="row">
  <form method="POST"
        action="{{url_for('expression-data.rqtl2.select_population',
                species_id=species.SpeciesId)}}">
    <legend class="heading">select grouping/population</legend>
    {{flash_messages("error-select-population")}}

    <input type="hidden" name="species_id" value="{{species.SpeciesId}}" />

    <div class="form-group">
      <label for="select:inbredset" class="form-label">population</label>
      <select id="select:inbredset"
	      name="inbredset_id"
	      required="required"
	      class="form-control">
        <option value="">Select a grouping/population</option>
        {%for pop in populations%}
        <option value="{{pop.InbredSetId}}">
	  {{pop.InbredSetName}} ({{pop.FullName}})</option>
        {%endfor%}
      </select>
      <span class="form-text text-muted">Select the population for your data from
        the list below.</span>
    </div>

    <button type="submit" class="btn btn-primary" />select population</button>
</form>
</div>

{%endblock%}

{%block sidebarcontents%}
{{display_species_card(species)}}
{%endblock%}


{%block javascript%}
{%endblock%}