{% extends 'program_base.html' %}

{% block stylelink %}"{{ url_for('static', filename='css/depht_train_style.css') }}"{% endblock %}
{% block script %}"{{url_for('static', filename='js/arguments.js')}}"{% endblock %}

{% block heading %}
  <h2 class="page_heading">Train a model using DEPhT</h2>
{% endblock %}

{% block form_content %}

  {% if no_models %}
    <script type="text/javascript">
      window.alert("No local models!")
    </script>
  {% endif %}

  <form class="inner args_form" method="post"
    action="{{url_for('train.training_results')}}" enctype="multipart/form-data">
    <table>
      <tr>
        <td>
          <label for="name">Model name</label>
        </td>
        <td>
          <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
            alt="help" class="help_icon">
            <span class="help_text">Name of the new model being created</span>
          </div>
          <input type="text" name="name" required>
        </td>
      </tr>

      <tr>
        <td><label for="phage">Phage FASTA directory</label></td>
        <td>
          <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
            alt="help" class="help_icon">
            <span class="help_text">Directory containing phage FASTA files</span>
          </div>
          <input type="file" name="phage" multiple required>
        </td>
      </tr>
      <tr>
        <td>
          <label for="bact">Bacterial FASTA directory</label>
        </td>
        <td>
          <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
            alt="help" class="help_icon">
            <span class="help_text">Directory containing bacterial FASTA files</span>
          </div>
          <input type="file" name="bact" multiple required>
        </td>
      </tr>
    </table>
    <br>
    <hr>
    <br>
    <a href="javascript:void(0)" name="show_opt" id="t_show_opt" class="more"
      onclick="show_optional('train_opt', id, 't_hide_opt')">
      Show optional arguments
    </a>
    <span id="train_opt", class="opt">
      <h4>Optional arguments</h4>

      <table class="optional_args">
        <tr>
          <td>
            <label for="csv">Prophage CSV</label>
            <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
              alt="help" class="help_icon">
              <span class="help_text">3-column CSV mapping the coordinates of
                any known prophages in the bacterial contigs</span>
            </div>
          </td>
          <td>
            <input type="file" name="csv">
          </td>
        </tr>

        <tr>
          <td><label for="window">Window size</label></td>
          <td>
            <input type="text" name="window" value="{{window}}">
            <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
              alt="help" class="help_icon">
              <span class="help_text">Number of genes to average features over</span>
            </div>
          </td>
        </tr>

        <tr>
          <td><label for="cpu">CPU cores</label></td>
          <td>
            <select class="cores" id="cores", name="cpu"></select>
            <div class="help"><img src="{{url_for('static', filename='images/help_icon.png')}}"
            alt="help" class="help_icon">
            <span class="help_text">
              Number of CPU cores to use</span>
            </div>
          </td>
        </tr>
      </table>
      <br>
      <br>
      <a href="javascript:void(0)" name="hide_opt" id="t_hide_opt" class="more"
        onclick="show_optional('train_opt','t_show_opt', id)">
        Hide optional arguments
      </a>
    </span>
    <br>
    <br>
    <br>
    <input type="submit" value="Submit" id="submit_train"
      onclick="this.value = 'Loading...'; this.style.border = '2px solid red'">
  <br><br>
  </form>
{% endblock %}
