{%extends "base.html"%}

{%block title%}Data Upload{%endblock%}

{%block contents%}
<h1 class="heading">data upload</h1>

<h2>Expression Data</h2>

<div id="explainer">
  <p>This application assumes that you are familiar with the basics of data
    verification formats and uploading procedures. If you haven't done so please
    go to this page to learn the requirements for file formats and helpful
    suggestions to enter your data in a fast and easy way.</p>

  <ol>
    <li><strong>PLEASE REVIEW YOUR DATA.</strong>Make sure your data complies
      with our system requirements. (
      <a href="{{url_for('entry.data_review')}}#data-concerns"
	 title="Details for the data expectations.">Help</a>
      )</li>
    <li><strong>UPLOAD YOUR DATA FOR DATA VERIFICATION.</strong> We accept
      <strong>.csv</strong>, <strong>.txt</strong> and <strong>.zip</strong>
      files (<a href="{{url_for('entry.data_review')}}#file-types"
	 title="Details for the data expectations.">Help</a>)</li>
  </ol>
</div>

<form action="{{url_for('entry.upload_file')}}"
      method="POST" enctype="multipart/form-data">
  <legend class="heading">upload expression data</legend>
  {%with messages = get_flashed_messages(with_categories=True) %}
  {%if messages %}
  <div class="alerts">
    {%for category, message in messages %}
    <span class="alert {{category}}">{{message}}</span>
    {%endfor%}
  </div>
  {%endif%}
  {%endwith%}

  <fieldset>
    <legend>file type</legend>

    <input type="radio" name="filetype" value="average" id="filetype_average"
	   required="required" class="form-col-1" />
    <label for="filetype_average" class="form-col-2">average</label>

    <input type="radio" name="filetype" value="standard-error"
	   id="filetype_standard_error" required="required"
	   class="form-col-1" />
    <label for="filetype_standard_error" class="form-col-2">
      standard error
    </label>
  </fieldset>

  <fieldset>
    <span id="no-file-error" class="alert-error" style="display: none;">
      No file selected
    </span>
    <label for="file_upload" class="form-col-1">select file</label>
    <input type="file" name="qc_text_file" id="file_upload"
	   accept="text/plain, text/tab-separated-values, application/zip"
	   class="form-col-2"/>
  </fieldset>

  <fieldset>
    <input type="submit" value="upload file" class="btn btn-main form-col-2" />
  </fieldset>
</form>

<div id="progress-indicator" class="hidden">
  <h3>Uploading file</h3>
  <p id="progress-filename">the-file</p>
  <progress id="progress-bar" value="0" max="100">
    0
  </progress>
  <p id="progress-text">Uploading 0%</p>
  <p id="progress-extra-text">Processing</p>
  <form id="frm-cancel-upload" style="border-style: none;">
    <button id="btn-cancel-upload" type="submit" class="btn btn-danger">
      Cancel
    </button>
  </form>
</div>

<h2>samples/cases</h2>

<div>
  <p>For the expression data above, you need the samples/cases in your file to
    already exist in the GeneNetwork database. If there are any samples that do
    not already exist the upload of the expression data will fail.</p>
  <p>This section gives you the opportunity to upload any missing samples</p>
</div>

<form method="POST" action="{{url_for('samples.select_species')}}">
  <legend class="heading">upload samples</legend>
  <fieldset>
    <label for="select:species">Species</label>
    <select id="select:species" name="species_id" required="required">
      <option value="">Select species</option>
      {%for spec in species%}
      <option value="{{spec.SpeciesId}}">{{spec.MenuName}}</option>
      {%endfor%}
    </select>
  </fieldset>

  <fieldset>
    <input type="submit" value="submit" class="btn btn-main form-col-2" />
  </fieldset>
</form>

{%endblock%}


{%block javascript%}
<script type="text/javascript" src="static/js/upload_progress.js"></script>
<script type="text/javascript">
  setup_upload_handlers();
</script>
{%endblock%}