<header>
  <div class="container">
    <ol class="breadcrumb">
      <li>Edge</li>
      <li><a href="#/genomes">Genomes</a></li>
      <li>
        <a class="fs-block" href="#/genomes/{{ genome.id }}"
          ><span ng-bind-html="genome.name"></span
        ></a>
      </li>
      <li>Blast</li>
    </ol>
  </div>
</header>

<div class="container">
  <h3>
    BLAST on Genome {{ genome.id }}:
    <span class="fs-block" ng-bind-html="genome.name"></span>
  </h3>

  <div
    role="form"
    id="blast-inputs"
    class="space-top"
    ng-init="program = 'blastn'"
  >
    <div class="form-inline">
      Program
      <div class="form-group">
        <select class="form-control" ng-model="program">
          <option value="blastn">blastn</option>
          <option value="tblastn">tblastn</option>
        </select>
      </div>
    </div>
    Query
    <br />
    <textarea class="form-control sequence" ng-model="query"></textarea>
    <button class="btn btn-primary" ng-click="Blast(query, program)">
      BLAST
    </button>
  </div>

  <div ng-if="waiting === true">
    <p>
      <br />
      <em>Waiting for server to respond ...</em>
      <br />
    </p>
  </div>

  <div ng-if="results" class="space-top">
    <partial template="blast-results" ng-init="blast_results=results"></partial>
  </div>
</div>
