aboutsummaryrefslogtreecommitdiff
path: root/qc_app/templates/index.html
blob: 588133a50994bd6247f3e3004fa9d7e944ceb4c3 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
{%extends "base.html"%}
{%from "flash_messages.html" import flash_messages%}
{%from "upload_progress_indicator.html" import upload_progress_indicator%}

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

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

<div class="explainer">
  <p>Each of the sections below gives you a different option for data upload.
    Please read the documentation for each section carefully to understand what
    each section is about.</p>
</div>

<h2 class="heading">R/qtl2 Bundles</h2>

<div class="explainer">
  <p>This feature combines and extends the two upload methods below. Instead of
    uploading one item at a time, the R/qtl2 bundle you upload can contain both
    the genotypes data (samples/individuals/cases and their data) and the
    expression data.</p>
  <p>The R/qtl2 bundle, additionally, can contain extra metadata, that neither
    of the methods below can handle.</p>

  <a href={{url_for("upload.rqtl2.select_species")}}
     title="Upload a zip bundle of R/qtl2 files">
    <button class="btn btn-main">upload R/qtl2 bundle</button></a>
</div>

<h2 class="heading">Expression Data</h2>

<div class="explainer">
  <p>This feature enables you to upload expression data. It expects the data to
    be in <strong>tab-separated values (TSV)</strong> files. The data should be
    a simple matrix of <em>phenotype × sample</em>, i.e. The first column is a
    list of the <em>phenotypes</em> and the first row is a list of
    <em>samples/cases</em>.</p>

  <p>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"
      id="frm-upload-expression-data">
  <legend class="heading">upload expression data</legend>
  {{flash_messages("error-expr-data")}}

  <fieldset>
    <label for="select_species01">Species</label>
    <select id="select_species01"
	    name="speciesid"
	    required="required">
      <option value="">Select species</option>
      {%for aspecies in species%}
      <option value="{{aspecies.SpeciesId}}">{{aspecies.MenuName}}</option>
      {%endfor%}
    </select>
  </fieldset>

  <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>

{{upload_progress_indicator()}}

<h2 class="heading">samples/cases</h2>

<div class="explainer">
  <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_species02">Species</label>
    <select id="select_species02" 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">
  function setup_formdata(form) {
      var formdata = new FormData();
      formdata.append(
	  "speciesid",
	  form.querySelector("#select_species01").value)
      formdata.append(
	  "qc_text_file",
	  form.querySelector("input[type='file']").files[0]);
      formdata.append(
	  "filetype",
	  selected_filetype(
	      Array.from(form.querySelectorAll("input[type='radio']"))));
      return formdata;
  }

  setup_upload_handlers(
      "frm-upload-expression-data", make_data_uploader(setup_formdata));
</script>
{%endblock%}