source: extensions/net.sf.basedb.meludi/trunk/resources/sampleproc/extraction_preparation.jsp @ 4244

Last change on this file since 4244 was 4244, checked in by olle, 5 years ago

Refs #911. MeLuDI updated in sample preparation wizards to open file selection dialogs for data in tabular format with hint to show files with file extension ".csv" or ".tsv":

  1. JSP file extraction_preparation.jsp in /resources/´sampleproc/ updated in input field for opening a consumables lot number file to accept files with file extension ".csv" or ".tsv".
  2. JSP file extraction_registration.jsp in /resources/sampleproc/ updated in input field for opening a reagent lot number file to accept files with file extension ".csv" or ".tsv".
File size: 29.7 KB
Line 
1<%@ page
2  pageEncoding="UTF-8"
3  session="false"
4  import="net.sf.basedb.core.User"
5  import="net.sf.basedb.core.DbControl"
6  import="net.sf.basedb.core.SessionControl"
7  import="net.sf.basedb.core.Application"
8  import="net.sf.basedb.util.formatter.DateFormatter"
9  import="net.sf.basedb.util.formatter.Formatter"
10  import="net.sf.basedb.clients.web.Base" 
11  import="net.sf.basedb.clients.web.util.HTML" 
12  import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
13  import="java.util.Date"
14%>
15<%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
16<%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
17<%
18final SessionControl sc = Base.getExistingSessionControl(request, true);
19final String ID = sc.getId();
20final float scale = Base.getScale(sc);
21final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.meludi");
22DbControl dc = null;
23try
24{
25  dc = sc.newDbControl();
26  final User user = User.getById(dc, sc.getLoggedInUserId());
27  final Formatter dateFormat = new DateFormatter("yyyyMMdd");
28%>
29<base:page type="default" >
30<base:head 
31  scripts="~../meludi-2.js,~extraction_preparation.js,~extraction_utils.js" 
32  styles="path.css,~../css/meludi-2.css"
33  >
34<style>
35tr.highlight
36{
37  border-top-width: 1px;
38  border-top-style: dotted;
39}
40
41#detailsTable
42{
43  width: 100%;
44  border-collapse: collapse;
45  border-bottom-width: 1px;
46  border-top-width: 1px;
47}
48
49#detailsTable td, #detailsTable th
50{
51  text-align: center;
52  min-width: 5%;
53  padding-top: 1px;
54  padding-bottom: 1px;
55}
56
57#detailsTable .comment
58{
59  min-width: 10%;
60}
61
62#detailsTable .italic
63{
64  font-style: italic;
65}
66
67.nondefault
68{
69  background: #FFF066;
70}
71.nondefault:after
72{
73  content: '›';
74}
75.nondefault:before
76{
77  content: '‹';
78}
79span.status
80{
81  width: 20px;
82  float: right;
83}
84</style>
85</base:head>
86<base:body>
87
88  <p:path><p:pathelement 
89    title="MeLuDi" href="<%="../index.jsp?ID="+ID%>" 
90    /><p:pathelement title="Lab tracking protocol for FFPE extraction" 
91    /></p:path>
92
93  <div class="content">
94
95  <form name="meludi" action="extraction_protocol2.jsp" method="post" target="_blank" id="wizard" class="wizard">
96    <input type="hidden" name="ID" value="<%=ID%>">
97    <input type="hidden" name="hiddenSubmitInfo" value="">
98    <input type="hidden" name="hiddenNumItems" value="">
99    <input type="hidden" name="hiddenCounterBalanceInfoRow" value="">
100
101  <div class="step auto-hide" id="step-1">
102    <div class="step-no">1</div>
103    <div class="step-title">Select unprocessed extract source items</div>
104    <div class="step-content">
105 
106      <table class="step-form">
107      <tr class="align-top">
108        <td class="prompt">Specimens/RNA/DNA</td>
109        <td class="input">
110          <select name="extractSourceItems" id="extractSourceItems" multiple size="30"></select>
111        </td>
112        <td class="status" id="extractSourceItems.status"></td>
113        <td class="help">
114          <span id="extractSourceItems.message" class="message" ></span>
115          Select 1-24 items. If the number is <= 12, locations will be reserved
116          in a single QIAcube, otherwise two. If 1 or 11 items are reserved for a QIAcube,
117          a counterbalance blank vial filled with water must be added, to ensure balance.
118          The list contains unprocessed specimen and unquantified RNA/DNA items.
119        </td>
120      </tr>
121      </table>
122    </div>
123  </div>
124 
125  <!-- 2. Deparaffinization + QIAcube information -->
126  <div class="step auto-hide" id="step-2">
127    <div class="step-no">2</div>
128    <div class="step-title">Common information for Deparaffinization and QIAcube step</div>
129    <div class="step-content">
130   
131      <div id="commonInfoSection">
132
133      <table class="step-form">
134      <tbody class="section-header">
135        <tr>
136          <td colspan="4">Deparaffinization</td>
137        </tr>
138      </tbody>
139      <tr>
140        <td class="prompt">Start list name</td>
141        <td class="input">
142          <input type="text" name="startListName" id="startListName" 
143            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="isolationDate"
144            maxlength="255">
145        </td>
146        <td class="status" id="startListName.status"></td>
147        <td class="help">
148          <span id="startListName.message" class="message">Start list used for this batch of extract source items.</span>
149          Start list for this batch of extract source items
150        </td>
151      </tr>
152      <tr>
153        <td class="prompt">Isolation date</td>
154        <td class="input">
155          <input type="text" name="isolationDate" id="isolationDate"
156            value="<%=dateFormat.format(new Date()) %>" 
157            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="extractionOperator"
158            style="width: 8em;" maxlength="10">
159            <base:icon 
160              id="isolationDateCalendar"
161              subclass="auto-init"
162              data-auto-init="calendar"
163              data-textarea-id="isolationDate"
164              data-date-format="yyyyMMdd"
165              data-title="Isolation date"
166              image="calendar.png" 
167              tooltip="Select a date from a calendar" 
168              tabindex="-1"
169            />
170        </td>
171        <td class="status" id="isolationDate.status"></td>
172        <td class="help">
173          <span id="isolationDate.message" class="message"></span>
174          (YYYYMMDD or MMDD)
175        </td>
176      </tr>
177      <tr>
178        <td class="prompt">Operator</td>
179        <td class="input">
180          <input type="text" name="extractionOperator" id="extractionOperator" 
181            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="extractionProtocol"
182            value="<%=HTML.encodeTags(user.getName()) %>" maxlength="255">
183        </td>
184        <td class="status" id="extractionOperator.status"></td>
185        <td class="help">
186          <span id="extractionOperator.message" class="message"></span>
187        </td>
188      </tr>
189      <tr>
190        <td class="prompt">Protocol</td>
191        <td class="input">
192          <select name="extractionProtocol" id="extractionProtocol" 
193            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeDate"
194          ></select>
195        </td>
196        <td class="status" id="extractionProtocol.status"></td>
197        <td class="help">
198          <span id="extractionProtocol.message" class="message"></span>
199          Select the protocol which was used in the extraction step.
200        </td>
201      </tr>
202      <tr>
203<!--
204      <tr>
205        <td class="prompt">RNA default volume (µl)</td>
206        <td class="input">
207          <input type="text" name="rnaDefaultVolume" id="rnaDefaultVolume"
208            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="dnaDefaultVolume"
209            maxlength="255">
210        </td>
211        <td class="status" id="rnaDefaultVolume.status"></td>
212        <td class="help">
213          <span id="rnaDefaultVolume.message" class="message"></span>
214          Default RNA elution volume.
215        </td>
216      </tr>
217      <tr>
218        <td class="prompt">DNA default volume (µl)</td>
219        <td class="input">
220          <input type="text" name="dnaDefaultVolume" id="dnaDefaultVolume"
221            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeDate"
222            maxlength="255">
223        </td>
224        <td class="status" id="dnaDefaultVolume.status"></td>
225        <td class="help">
226          <span id="dnaDefaultVolume.message" class="message"></span>
227          Default DNA elution volume.
228        </td>
229      </tr>
230-->
231      <tr>
232        <td class="subprompt" id="xyleneSpecimen.title">Xylene</td>
233        <td class="input">
234          <input type="text" name="xyleneSpecimen" id="xyleneSpecimen" 
235            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="etoh995Specimen"
236            maxlength="255">
237        </td>
238        <td class="status" id="xyleneSpecimen.status"></td>
239        <td class="help">
240          <span id="xyleneSpecimen.message" class="message"></span>
241          Lot numbers for the reagents used.
242        </td>
243      </tr>
244      <tr>
245        <td class="subprompt" id="etoh995Specimen.title">ETOH 99.5%</td>
246        <td class="input">
247          <input type="text" name="etoh995Specimen" id="etoh995Specimen" 
248            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="allPrepFfpeKit"
249            maxlength="255">
250        </td>
251        <td class="status" id="etoh995Specimen.status"></td>
252        <td class="help">
253          <span id="etoh995Specimen.message" class="message"></span>
254          Lot numbers for the reagents used.
255        </td>
256      </tr>
257      <tr>
258        <td class="subprompt" id="allPrepFfpeKit.title">FFPE DNA/RNA kit</td>
259        <td class="input">
260          <input type="text" name="allPrepFfpeKit" id="allPrepFfpeKit" 
261            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferPkdSpecimen"
262            maxlength="255">
263        </td>
264        <td class="status" id="allPrepFfpeKit.status"></td>
265        <td class="help">
266          <span id="allPrepFfpeKit.message" class="message"></span>
267          Lot numbers for the reagents used.
268        </td>
269      </tr>
270      <tr>
271        <td class="subprompt" id="bufferPkdSpecimen.title">PKD buffer</td>
272        <td class="input">
273          <input type="text" name="bufferPkdSpecimen" id="bufferPkdSpecimen" 
274            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferAtlSpecimen"
275            maxlength="255">
276        </td>
277        <td class="status" id="bufferPkdSpecimen.status"></td>
278        <td class="help">
279          <span id="bufferPkdSpecimen.message" class="message"></span>
280          Lot numbers for the reagents used.
281        </td>
282      </tr>
283      <tr>
284        <td class="subprompt" id="bufferAtlSpecimen.title">ATL buffer</td>
285        <td class="input">
286          <input type="text" name="bufferAtlSpecimen" id="bufferAtlSpecimen" 
287            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="proteinaseKSpecimen"
288            maxlength="255">
289        </td>
290        <td class="status" id="bufferAtlSpecimen.status"></td>
291        <td class="help">
292          <span id="bufferAtlSpecimen.message" class="message"></span>
293          Lot numbers for the reagents used.
294        </td>
295      </tr>
296      <tr>
297        <td class="subprompt" id="proteinaseKSpecimen.title">Proteinase K</td>
298        <td class="input">
299          <input type="text" name="proteinaseKSpecimen" id="proteinaseKSpecimen" 
300            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="rnaseASpecimen"
301            maxlength="255">
302        </td>
303        <td class="status" id="proteinaseKSpecimen.status"></td>
304        <td class="help">
305          <span id="proteinaseKSpecimen.message" class="message"></span>
306          Lot numbers for the reagents used.
307        </td>
308      </tr>
309      <tr>
310        <td class="subprompt" id="rnaseASpecimen.title">RNase A</td>
311        <td class="input">
312          <input type="text" name="rnaseASpecimen" id="rnaseASpecimen" 
313            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeDate"
314            maxlength="255">
315        </td>
316        <td class="status" id="rnaseASpecimen.status"></td>
317        <td class="help">
318          <span id="rnaseASpecimen.message" class="message"></span>
319          Lot numbers for the reagents used.
320        </td>
321      </tr>
322      <tbody class="section-header">
323        <tr>
324          <td colspan="4">QIAcube</td>
325        </tr>
326      </tbody>
327      <tr>
328        <td class="prompt">Date</td>
329        <td class="input">
330          <input type="text" name="qiacubeDate" id="qiacubeDate"
331            value="<%=dateFormat.format(new Date()) %>" 
332            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeOperator"
333            style="width: 8em;" maxlength="10">
334            <base:icon 
335              id="qiacubeDateCalendar"
336              subclass="auto-init"
337              data-auto-init="calendar"
338              data-textarea-id="qiacubeDate"
339              data-date-format="yyyyMMdd"
340              data-title="Qiacube date"
341              image="calendar.png" 
342              tooltip="Select a date from a calendar" 
343              tabindex="-1"
344            />
345        </td>
346        <td class="status" id="qiacubeDate.status"></td>
347        <td class="help">
348          <span id="qiacubeDate.message" class="message"></span>
349          (YYYYMMDD or MMDD) Used in names of sample id files
350        </td>
351      </tr>
352      <tr>
353        <td class="prompt">Operator</td>
354        <td class="input">
355          <input type="text" name="qiacubeOperator" id="qiacubeOperator" 
356            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubePrimaryPrefix"
357            value="<%=HTML.encodeTags(user.getName()) %>" maxlength="255">
358        </td>
359        <td class="status" id="qiacubeOperator.status"></td>
360        <td class="help">
361          <span id="qiacubeOperator.message" class="message"></span>
362        </td>
363      </tr>
364      <tr>
365        <td class="prompt">Primary QIAcube prefix</td>
366        <td class="input">
367          <select name="qiacubePrimaryPrefix" id="qiacubePrimaryPrefix"
368            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeSecondaryPrefix">
369            <option value="A">A
370            <option selected value="B">B
371            <option value="C">C
372            <option value="D">D
373            <option value="E">E
374            <option value="F">F
375            <option value="G">G
376            <option value="H">H
377            <option value="I">I
378            <option value="J">J
379            <option value="K">K
380            <option value="L">L
381            <option value="M">M
382            <option value="N">N
383            <option value="O">O
384            <option value="P">P
385            <option value="Q">Q
386            <option value="R">R
387            <option value="S">S
388            <option value="T">T
389            <option value="U">U
390            <option value="V">V
391            <option value="W">W
392            <option value="X">X
393            <option value="Y">Y
394            <option value="Z">Z
395          </select>
396        </td>
397        <td class="status" id="qiacubePrimaryPrefix.status"></td>
398        <td class="help">
399          <span id="qiacubePrimaryPrefix.message" class="message"></span>
400          Prefix for primary QIAcube.
401        </td>
402      </tr>
403      <tr>
404        <td class="prompt">Secondary QIAcube prefix</td>
405        <td class="input">
406          <select name="qiacubeSecondaryPrefix" id="qiacubeSecondaryPrefix"
407            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiacubeRunNo">
408            <option value="A">A
409            <option value="B">B
410            <option selected value="C">C
411            <option value="D">D
412            <option value="E">E
413            <option value="F">F
414            <option value="G">G
415            <option value="H">H
416            <option value="I">I
417            <option value="J">J
418            <option value="K">K
419            <option value="L">L
420            <option value="M">M
421            <option value="N">N
422            <option value="O">O
423            <option value="P">P
424            <option value="Q">Q
425            <option value="R">R
426            <option value="S">S
427            <option value="T">T
428            <option value="U">U
429            <option value="V">V
430            <option value="W">W
431            <option value="X">X
432            <option value="Y">Y
433            <option value="Z">Z
434          </select>
435        </td>
436        <td class="status" id="qiacubeSecondaryPrefix.status"></td>
437        <td class="help">
438          <span id="qiacubeSecondaryPrefix.message" class="message"></span>
439          Prefix for secondary QIAcube (if needed).
440        </td>
441      </tr>
442      <tr>
443        <td class="prompt">Run number</td>
444        <td class="input">
445          <input type="text" name="qiacubeRunNo" id="qiacubeRunNo"
446            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="etoh995"
447            style="width: 8em;" maxlength="10" value="1">
448        </td>
449        <td class="status" id="qiacubeRunNo.status"></td>
450        <td class="help"><span id="qiacubeRunNo.message" class="message"></span>
451           Used in names of sample id files
452        </td>
453      </tr>
454      <tr>
455        <td class="subprompt" id="etoh995.title">ETOH 99.5%</td>
456        <td class="input">
457          <input type="text" name="etoh995" id="etoh995" 
458            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferRlt"
459            maxlength="255">
460        </td>
461        <td class="status" id="etoh995.status"></td>
462        <td class="help">
463          <span id="etoh995.message" class="message"></span>
464          Lot numbers for the reagents used.
465        </td>
466      </tr>
467      <tr>
468        <td class="subprompt" id="bufferRlt.title">Buffer RLT</td>
469        <td class="input">
470          <input type="text" name="bufferRlt" id="bufferRlt" 
471            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferFrn"
472            maxlength="255">
473        </td>
474        <td class="status" id="bufferRlt.status"></td>
475        <td class="help">
476          <span id="bufferRlt.message" class="message"></span>
477          Lot numbers for the reagents used.
478        </td>
479      </tr>
480      <tr>
481        <td class="subprompt" id="bufferFrn.title">Buffer FRN</td>
482        <td class="input">
483          <input type="text" name="bufferFrn" id="bufferFrn" 
484            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferRpe"
485            maxlength="255">
486        </td>
487        <td class="status" id="bufferFrn.status"></td>
488        <td class="help">
489          <span id="bufferFrn.message" class="message"></span>
490          Lot numbers for the reagents used.
491        </td>
492      </tr>
493      <tr>
494        <td class="subprompt" id="bufferRpe.title">Buffer RPE</td>
495        <td class="input">
496          <input type="text" name="bufferRpe" id="bufferRpe" 
497            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferAl"
498            maxlength="255">
499        </td>
500        <td class="status" id="bufferRpe.status"></td>
501        <td class="help">
502          <span id="bufferRpe.message" class="message"></span>
503          Lot numbers for the reagents used.
504        </td>
505      </tr>
506      <tr>
507        <td class="subprompt" id="bufferAl.title">Buffer AL</td>
508        <td class="input">
509          <input type="text" name="bufferAl" id="bufferAl" 
510            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferAw1"
511            maxlength="255">
512        </td>
513        <td class="status" id="bufferAl.status"></td>
514        <td class="help">
515          <span id="bufferAl.message" class="message"></span>
516          Lot numbers for the reagents used.
517        </td>
518      </tr>
519      <tr>
520        <td class="subprompt" id="bufferAw1.title">Buffer AW1</td>
521        <td class="input">
522          <input type="text" name="bufferAw1" id="bufferAw1" 
523            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferAw2"
524            maxlength="255">
525        </td>
526        <td class="status" id="bufferAw1.status"></td>
527        <td class="help">
528          <span id="bufferAw1.message" class="message"></span>
529          Lot numbers for the reagents used.
530        </td>
531      </tr>
532      <tr>
533        <td class="subprompt" id="bufferAw2.title">Buffer AW2</td>
534        <td class="input">
535          <input type="text" name="bufferAw2" id="bufferAw2" 
536            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferAte"
537            maxlength="255">
538        </td>
539        <td class="status" id="bufferAw2.status"></td>
540        <td class="help">
541          <span id="bufferAw2.message" class="message"></span>
542          Lot numbers for the reagents used.
543        </td>
544      </tr>
545      <tr>
546        <td class="subprompt" id="bufferAte.title">Buffer ATE</td>
547        <td class="input">
548          <input type="text" name="bufferAte" id="bufferAte" 
549            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="bufferRdd"
550            maxlength="255">
551        </td>
552        <td class="status" id="bufferAte.status"></td>
553        <td class="help">
554          <span id="bufferAte.message" class="message"></span>
555          Lot numbers for the reagents used.
556        </td>
557      </tr>
558      <tr>
559        <td class="subprompt" id="bufferRdd.title">Buffer RDD</td>
560        <td class="input">
561          <input type="text" name="bufferRdd" id="bufferRdd" 
562            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="rnaseFreeWater"
563            maxlength="255">
564        </td>
565        <td class="status" id="bufferRdd.status"></td>
566        <td class="help">
567          <span id="bufferRdd.message" class="message"></span>
568          Lot numbers for the reagents used.
569        </td>
570      </tr>
571      <tr>
572        <td class="subprompt" id="rnaseFreeWater.title">RNase free water</td>
573        <td class="input">
574          <input type="text" name="rnaseFreeWater" id="rnaseFreeWater" 
575            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="dnaseMix"
576            maxlength="255">
577        </td>
578        <td class="status" id="rnaseFreeWater.status"></td>
579        <td class="help">
580          <span id="rnaseFreeWater.message" class="message"></span>
581          Lot numbers for the reagents used.
582        </td>
583      </tr>
584      <tr>
585        <td class="subprompt" id="dnaseMix.title">DNAse mix</td>
586        <td class="input">
587          <input type="text" name="dnaseMix" id="dnaseMix" 
588            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="rneasyMinEluteSpinColumn"
589            maxlength="255">
590        </td>
591        <td class="status" id="dnaseMix.status"></td>
592        <td class="help">
593          <span id="dnaseMix.message" class="message"></span>
594          Lot numbers for the reagents used.
595        </td>
596      </tr>
597      <tr>
598        <td class="subprompt" id="rneasyMinEluteSpinColumn.title">RNeasy Min Elute Spin Column</td>
599        <td class="input">
600          <input type="text" name="rneasyMinEluteSpinColumn" id="rneasyMinEluteSpinColumn" 
601            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qiaampMinEluteSpinColumn"
602            maxlength="255">
603        </td>
604        <td class="status" id="rneasyMinEluteSpinColumn.status"></td>
605        <td class="help">
606          <span id="rneasyMinEluteSpinColumn.message" class="message"></span>
607          Lot numbers for the reagents used.
608        </td>
609      </tr>
610      <tr>
611        <td class="subprompt" id="qiaampMinEluteSpinColumn.title">QIAamp Min Elute Spin Column</td>
612        <td class="input">
613          <input type="text" name="qiaampMinEluteSpinColumn" id="qiaampMinEluteSpinColumn" 
614            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="kapaSybrFast"
615            maxlength="255">
616        </td>
617        <td class="status" id="qiaampMinEluteSpinColumn.status"></td>
618        <td class="help">
619          <span id="qiaampMinEluteSpinColumn.message" class="message"></span>
620          Lot numbers for the reagents used.
621        </td>
622      </tr>
623      <tbody class="section-header">
624        <tr>
625          <td colspan="4">Quality control</td>
626        </tr>
627      </tbody>
628      <tr>
629        <td class="subprompt" id="kapaSybrFast.title">Kapa SYBR Fast</td>
630        <td class="input">
631          <input type="text" name="kapaSybrFast" id="kapaSybrFast" 
632            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qualityControlPrimersQcpRgt"
633            maxlength="255">
634        </td>
635        <td class="status" id="kapaSybrFast.status"></td>
636        <td class="help">
637          <span id="kapaSybrFast.message" class="message"></span>
638          Lot numbers for the reagents used.
639        </td>
640      </tr>
641      <tr>
642        <td class="subprompt" id="qualityControlPrimersQcpRgt.title">Quality Control Primers (QCP) RGT</td>
643        <td class="input">
644          <input type="text" name="qualityControlPrimersQcpRgt" id="qualityControlPrimersQcpRgt" 
645            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qualityControlTemplateQct"
646            maxlength="255">
647        </td>
648        <td class="status" id="qualityControlPrimersQcpRgt.status"></td>
649        <td class="help">
650          <span id="qualityControlPrimersQcpRgt.message" class="message"></span>
651          Lot numbers for the reagents used.
652        </td>
653      </tr>
654      <tr>
655        <td class="subprompt" id="qualityControlTemplateQct.title">Quality Control Template (QCT)</td>
656        <td class="input">
657          <input type="text" name="qualityControlTemplateQct" id="qualityControlTemplateQct" 
658            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qubitDnaHighSens"
659            maxlength="255">
660        </td>
661        <td class="status" id="qualityControlTemplateQct.status"></td>
662        <td class="help">
663          <span id="qualityControlTemplateQct.message" class="message"></span>
664          Lot numbers for the reagents used.
665        </td>
666      </tr>
667      <tr>
668        <td class="subprompt" id="qubitDnaHighSens.title">QUBIT DNA High Sens</td>
669        <td class="input">
670          <input type="text" name="qubitDnaHighSens" id="qubitDnaHighSens" 
671            class="auto-init" data-auto-init="focus-on-enter" data-next-focus="qubitDnaBroadRange"
672            maxlength="255">
673        </td>
674        <td class="status" id="qubitDnaHighSens.status"></td>
675        <td class="help">
676          <span id="qubitDnaHighSens.message" class="message"></span>
677          Lot numbers for the reagents used.
678        </td>
679      </tr>
680      <tr>
681        <td class="subprompt" id="qubitDnaBroadRange.title">QUBIT DNA Broad Range</td>
682        <td class="input">
683          <input type="text" name="qubitDnaBroadRange" id="qubitDnaBroadRange" 
684            class="auto-init" data-auto-init="focus-on-enter" data-next-focus=""
685            maxlength="255">
686        </td>
687        <td class="status" id="qubitDnaBroadRange.status"></td>
688        <td class="help">
689          <span id="qubitDnaBroadRange.message" class="message"></span>
690          Lot numbers for the reagents used.
691        </td>
692      </tr>
693      </table>
694
695      <table class="step-form">
696      <tbody class="section-header">
697        <tr>
698          <td colspan="4">Input options</td>
699        </tr>
700      </tbody>
701      <tr>
702        <td class="prompt">Reagent lot numbers</td>
703        <td>
704          <div class="button basicbutton interactable clear-reagents" style="width: 6em;">Clear</div>
705        </td>
706        <td class="status" id="clearReagents.status"></td>
707        <td class="help">
708          <span id="clearReagents.message" class="message"></span>
709          Clear reagents input fields.
710        </td>
711      </tr>
712      <tr>
713        <td class="subprompt">From latest registered DNA</td>
714        <td>
715          <div class="button basicbutton interactable copy-reagents-from-latest-extract" style="width: 6em;">Use latest</div>
716        </td>
717        <td class="status" id="copyReagentsFromExtract.status"></td>
718        <td class="help">
719          <span id="copyReagentsFromExtract.message" class="message"></span>
720          Copy reagent lot no. from latest registered DNA.
721        </td>
722      </tr>
723      <tr>
724        <td class="subprompt">From file</td>
725        <td class="input">
726          <input type="file" name="reagentFile" id="reagentFile" class="required" style="width: 95%;" accept=".csv,.tsv">
727        </td>
728        <td class="status" id="reagentFile.status"></td>
729        <td class="help">
730          <span id="reagentFile.message" class="message"></span>
731          Select a CSV file containing lot numbers for the reagents.
732        </td>
733      </tr>
734      <tr>
735        <td class="prompt">Download reagent lot no. file</td>
736        <td class="input">
737          <base:button id="downloadReagentLotNoFile" title="Download..."
738            image="<%=home + "/images/download.png"%>" style="width:10em;" />
739        </td>
740        <td class="status" id="downloadReagentLotNoFile.status"></td>
741        <td class="help">
742          <span id="downloadReagentLotNoFile.message" class="message"></span>
743          Download file with current lot no.s for future import/reference.
744        </td>
745      </tr>
746      </table>
747      </div>
748    </div>
749  </div>
750 
751  <!-- 3. DNA/RNA information -->
752  <div class="step" id="step-3">
753    <div class="step-no">3</div>
754    <div class="step-title">RNA/DNA details</div>
755    <div class="step-content">
756
757<!--   
758      <div class="bg-filled-50" style="padding: 2px;">
759        The table below show values from the QIAcube run.
760        <span class="nondefault">Highlighted</span> values have been manually
761        changed from their default values. If the QIAcube positions are not correct,
762        they must be fixed before the <i>NanoDrop Sample ID</i> file is downloaded
763        since the order in this file depends on the positions. The concentrations
764        and other values are loaded from the file after the NanoDrop has been completed.
765      </div>
766-->
767      <div class="bg-filled-50" id="detailsStartListName" style="padding: 2px;"></div>
768      <div class="bg-filled-50" style="padding: 2px;">
769        1. Check QIAcube positions (instrument prefix ID ['A'-'Z'] + position [1-12], e.g. "B3") and edit if necessary.<br>
770        2. Download NanoDrop sample ID file for import by NanoDrop software.<br>
771        3. Download qPCR sample ID file for import by qPCR software.<br>
772        4. Create lab tracking protocol (opens in new tab/window).<br>
773        5. Important! If you want to import DNA concentration values from a Qubit value file, the items must be measured in exactly the same order, as in the lab tracking protocol.<br>
774        6. If everything is OK, click "Register" to register the new start list.<br>
775        <br>
776        <span class="nondefault">Highlighted</span> values in the table below have been manually
777        changed from their default values. If the QIAcube positions are not correct,
778        they must be fixed before the <i>NanoDrop Sample ID</i> file is downloaded
779        since the order in this file depends on the positions. The concentrations
780        and other values are loaded in the next wizard after the NanoDrop, qPCR, and Qubit
781        runs/measurements have been completed.
782      </div>
783
784      <div id="detailsSection"></div>
785
786      <table class="step-form">
787      <tr class="align-top">
788        <td class="prompt">NanoDrop Sample ID</td>
789        <td class="input">
790          <base:button id="downloadSampleIdFile" title="Download..."
791            image="<%=home + "/images/download.png"%>" style="width:10em;" />
792          <label><input type="checkbox" name="blankControlColumn" id="blankControlColumn" value="true" checked>Column with blank controls</label>
793        </td>
794        <td class="status" id="downloadSampleIdFile.status"></td>
795        <td class="help">
796          <span id="downloadSampleIdFile.message" class="message"></span>
797          Download and import this file to the NanoDrop software before analyzing the RNA.
798          <b>Note that the samples are sorted by QIAcube position!</b>
799        </td>
800      </tr>
801      <tr>
802        <td class="prompt">qPCR Sample ID</td>
803        <td class="input">
804          <base:button id="downloadQPcrSampleIdFile" title="Download..."
805            image="<%=home + "/images/download.png"%>" style="width:10em;" />
806        </td>
807        <td class="status" id="downloadQPcrSampleIdFile.status"></td>
808        <td class="help">
809          <span id="downloadQPcrSampleIdFile.message" class="message"></span>
810          Download and import this file to the qPCR software before analyzing the DNA.
811        </td>
812      </tr>
813      </table>
814    </div>
815  </div>
816 
817  <div id="wizard-status"></div>
818 
819  <table class="navigation" id="navigation">
820  <tr>
821    <td><base:button id="gocancel" title="Cancel" /></td>
822    <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" /></td>
823<!--
824    <td><base:button id="goregister" title="Register start list" image="<%=home+"/images/import.png"%>"  /></td>
825-->
826    <td><base:button id="goregister" title="Register" image="<%=home+"/images/import.png"%>"  /></td>
827    <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" /></td>
828    <td><base:button id="gocreate" title="Create lab tracking protocol" image="<%=home+"/images/import.png"%>" /></td>
829    <td id="gonext-message" class="message"></td>
830  </tr>
831  </table>
832 
833  </form>
834 
835  <div id="debug-tools">
836  </div>
837 
838  </div>
839 
840</base:body>
841</base:page>
842<%
843}
844finally
845{
846  if (dc != null) dc.close();
847}
848%>
Note: See TracBrowser for help on using the repository browser.