source: extensions/net.sf.basedb.reggie/trunk/resources/libprep/flowcell_registration.jsp @ 2063

Last change on this file since 2063 was 2063, checked in by Nicklas Nordborg, 9 years ago

References #501: Generate lab protocol for clustering

Re-organized the lab protocol to make it more similar to the registration wizard. It is now divided into two parts. One for the clustering and one for the sequencing startup.

File size: 26.9 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.clients.web.Base" 
9  import="net.sf.basedb.clients.web.util.HTML" 
10  import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
11%>
12<%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
13<%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
14<%
15final SessionControl sc = Base.getExistingSessionControl(request, true);
16final String ID = sc.getId();
17final float scale = Base.getScale(sc);
18final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.reggie");
19DbControl dc = null;
20try
21{
22  dc = sc.newDbControl();
23  final User user = User.getById(dc, sc.getLoggedInUserId());
24%>
25<base:page type="default" >
26<base:head scripts="ajax.js" styles="path.css">
27  <link rel="stylesheet" type="text/css" href="../css/reggie.css">
28  <script language="JavaScript" src="../reggie.js" type="text/javascript" charset="UTF-8"></script>
29
30<script language="JavaScript">
31
32var debug = true;
33var currentStep = 1;
34
35var flowCellsAreValid = false;
36var commentsIsValid = [];
37var dateIsValid = [];
38var flowCellIdIsValid = [];
39var readStringIsValid = [];
40
41function init()
42{
43  var frm = document.forms['reggie'];
44  var flowCells = getFlowCells();
45 
46  // Load existing Flow cells not yet registered
47  if (flowCells != null && flowCells.length > 0)
48  {
49    for (var i=0; i < flowCells.length; i++)
50    {
51      var flowCell = flowCells[i];
52      var option = new Option(flowCell.name, flowCell.id, i < 2);
53      option.flowCell = flowCell;
54      frm.flowcells.options[frm.flowcells.length] = option;
55    }
56    flowCellsOnChange();
57    outcomeOnChange();
58  }
59  else
60  {
61    var msg = 'No flow cells available for processing.';
62    setFatalError(msg);
63    return;
64  }
65
66  // All is ok
67  frm.flowcells.focus();
68}
69
70
71function goNextAuto()
72{
73  goNext(false);
74}
75
76function goNext(manual)
77{
78  setInnerHTML('gonext.message', '');
79  if (currentStep == 1)
80  {
81    if (step1IsValid()) gotoStep2();
82  }
83  else if (currentStep == 2)
84  {
85    if (step2IsValid()) gotoStep3();
86  }
87  setCurrentStep(currentStep);
88}
89
90// Check that 1 or 2 flow cells are selected
91function flowCellsOnChange()
92{
93  var frm = document.forms['reggie']; 
94  flowCellsAreValid = false;
95 
96  var numSelected = 0;
97  for (var i = 0; i < frm.flowcells.length; i++)
98  {
99    if (frm.flowcells[i].selected) numSelected++;
100  }
101 
102  if (numSelected < 1 || numSelected > 2)
103  {
104    setInputStatus('flowcells', 'Select 1 or 2 flow cells', 'invalid');
105    return false;
106  }
107 
108  setInputStatus('flowcells', '', 'valid');
109  flowCellsAreValid = true;
110}
111
112
113function step1IsValid()
114{
115  return flowCellsAreValid;
116}
117
118function step2IsValid()
119{
120  if (dateIsValid['clusterDate'] != true) return false;
121 
122  var frm = document.forms['reggie'];
123  var failed = frm.outcome[1].checked;
124 
125  var index = 0;
126  for (var i = 0; i < frm.flowcells.length; i++)
127  {
128    if (frm.flowcells[i].selected)
129    {
130      var fc = frm.flowcells[i].flowCell;
131      //Main.debug(fc.name + ':'+ fc.id + ':' + flowCellIsValid['fc.'+fc.id+'.id'] + ':' + flowCellIsValid['fc.'+fc.id+'.readString']);
132      if (flowCellIdIsValid['fc-'+index+'.id'] != true) return false;
133      if (commentsIsValid['fc-'+index+'.comments'] != true) return false;
134      index++;
135    }
136  }
137 
138  return true; 
139}
140
141function step3IsValid()
142{
143  if (dateIsValid['sequencingStartDate'] != true) return false;
144 
145  var frm = document.forms['reggie'];
146  var index = 0;
147  for (var i = 0; i < frm.flowcells.length; i++)
148  {
149    if (frm.flowcells[i].selected)
150    {
151      var fc = frm.flowcells[i].flowCell;
152      //Main.debug(fc.name + ':'+ fc.id + ':' + flowCellIsValid['fc.'+fc.id+'.id'] + ':' + flowCellIsValid['fc.'+fc.id+'.readString']);
153      if (readStringIsValid['fc-'+index+'.readString'] != true) return false;
154      index++;
155    }
156  }
157 
158  return true;
159}
160
161function getFlowCells()
162{
163  var frm = document.forms['reggie']; 
164 
165  var request = Ajax.getXmlHttpRequest();
166  try
167  {
168    showLoadingAnimation('Loading flow cells lists...');
169    var url = '../FlowCell.servlet?ID=<%=ID%>&cmd=GetUnprocessedFlowCells';   
170    request.open("GET", url, false); 
171    request.send(null);
172  }
173  finally
174  {
175    hideLoadingAnimation();
176  }
177 
178  if (debug) Main.debug(request.responseText);
179  var response = JSON.parse(request.responseText); 
180  if (response.status != 'ok')
181  {
182    setFatalError(response.message);
183    return false;
184  }
185  return response.flowCells;
186}
187
188function gotoStep2()
189{
190  var frm = document.forms['reggie'];
191 
192  // Disable controls
193  frm.flowcells.disabled = true;
194  frm.outcome[0].disabled = true;
195  frm.outcome[1].disabled = true;
196 
197  var failed = frm.outcome[1].checked;
198
199  currentStep = 2;
200  Main.show('step.2.section');
201  Main.hide('step.1.section');
202  Main.addClass(document.getElementById('step.1.section'), 'disabled');
203  Main.show('gocancel');
204  if (failed)
205  {
206    Main.hide('gonext');
207    Main.show('goregister');
208    Main.hide('step.3.box');
209  }
210
211  // Load clustering protocols
212  var clusterProtocols = getProtocols('CLUSTER_PROTOCOL');
213  for (var i = 0; i < clusterProtocols.length; i++)
214  {
215    var protocol = clusterProtocols[i];
216    frm.clusterProtocol[frm.clusterProtocol.length] = new Option(protocol.name, protocol.id, protocol.isDefault);
217    setInputStatus('clusterProtocol', '', 'valid');
218  }
219  if (frm.clusterProtocol.length == 0)
220  {
221    frm.clusterProtocol[0] = new Option('- none -', '');
222  }
223
224  var index = 0;
225  for (var i = 0; i < frm.flowcells.length && index < 2; i++)
226  {
227    if (frm.flowcells[i].selected)
228    {
229      var fc = frm.flowcells[i].flowCell;
230      var prefix = 'fc-'+index;
231      setInnerHTML(prefix+'.name.c', fc.name);
232      frm[prefix+'.comments'].value = fc.comments;
233      commentsOnChange(prefix+'.comments');
234      frm[prefix+'.id'].value = fc.externalId;
235      flowCellIdOnBlur(prefix+'.id');
236      index++;
237    }
238  }
239
240  if (index == 1)
241  {
242    // Only one flow cell selected
243    Main.addClass(document.getElementById('step.2.section'), 'hide-fc-1');
244   
245  }
246
247 
248  frm.clusterDate.focus();
249}
250
251function disableStep2()
252{
253  var frm = document.forms['reggie'];
254  // Disable controls
255  frm.clusterDate.disabled = true;
256  frm.clusterOperator.disabled = true;
257  frm.clusterProtocol.disabled = true;
258  frm['fc-0.id'].disabled = true;
259  frm['fc-0.comments'].disabled = true;
260  frm['fc-1.id'].disabled = true;
261  frm['fc-1.comments'].disabled = true;
262
263  Main.addClass(document.getElementById('step.2.section'), 'disabled');
264}
265
266function gotoStep3()
267{
268  var frm = document.forms['reggie'];
269 
270  disableStep2();
271  Main.hide('step.2.section');
272  Main.show('step.3.section');
273  Main.hide('gonext');
274  Main.show('goregister');
275  currentStep = 3;
276
277  // Load sequencing protocols
278  var protocols = getProtocols('SEQUENCING_PROTOCOL');
279  for (var i = 0; i < protocols.length; i++)
280  {
281    var protocol = protocols[i];
282    frm.sequencingProtocol[frm.sequencingProtocol.length] = new Option(protocol.name, protocol.id, protocol.isDefault);
283    setInputStatus('sequencingProtocol', '', 'valid');
284  }
285  if (frm.sequencingProtocol.length == 0)
286  {
287    frm.sequencingProtocol[0] = new Option('- none -', '');
288  }
289
290  // Load sequencing machines
291  var sequencers = getHardware('SEQUENCER');
292  for (var i = 0; i < sequencers.length; i++)
293  {
294    var sequencer = sequencers[i];
295    frm.sequencer[frm.sequencer.length] = new Option(sequencer.name, sequencer.id, sequencer.isDefault);
296    setInputStatus('sequencer', '', 'valid');
297  }
298  if (frm.sequencer.length == 0)
299  {
300    frm.sequencer[0] = new Option('- none -', '');
301  }
302 
303  var index = 0;
304  for (var i = 0; i < frm.flowcells.length && index < 2; i++)
305  {
306    if (frm.flowcells[i].selected)
307    {
308      var fc = frm.flowcells[i].flowCell;
309      var prefix = 'fc-'+index;
310      setInnerHTML(prefix+'.name.s', fc.name);
311      frm[prefix+'.readString'].value = fc.ReadString;
312      readStringOnBlur(prefix+'.readString');
313      index++;
314    }
315  }
316
317  if (index == 1)
318  {
319    // Only one flow cell selected
320    Main.addClass(document.getElementById('step.3.section'), 'hide-fc-1');
321  }
322   
323  frm.sequencingStartDate.focus();
324}
325
326function getProtocols(subtype)
327{
328  var request = Ajax.getXmlHttpRequest();
329  try
330  {
331    showLoadingAnimation('Loading ' + subtype + ' protocols...');
332    var url = '../Protocol.servlet?ID=<%=ID%>&cmd=GetProtocols&subtype='+subtype;   
333    request.open("GET", url, false); 
334    request.send(null);
335  }
336  finally
337  {
338    hideLoadingAnimation();
339  }
340
341  if (debug) Main.debug(request.responseText);
342  var response = JSON.parse(request.responseText); 
343  if (response.status != 'ok')
344  {
345    setFatalError(response.message);
346    return false;
347  }
348  return response.protocols;
349}
350
351function getHardware(subtype)
352{
353  var request = Ajax.getXmlHttpRequest();
354  try
355  {
356    showLoadingAnimation('Loading ' + subtype + ' protocols...');
357    var url = '../Hardware.servlet?ID=<%=ID%>&cmd=GetHardware&subtype='+subtype;   
358    request.open("GET", url, false); 
359    request.send(null);
360  }
361  finally
362  {
363    hideLoadingAnimation();
364  }
365
366  if (debug) Main.debug(request.responseText);
367  var response = JSON.parse(request.responseText); 
368  if (response.status != 'ok')
369  {
370    setFatalError(response.message);
371    return false;
372  }
373  return response.hardware;
374}
375
376
377function outcomeOnChange()
378{
379  var frm = document.forms['reggie'];
380  var failed = document.getElementById('outcomeFailed').checked;
381  Main.addOrRemoveClass(frm['fc-0.comments'], 'required', failed);
382  Main.addOrRemoveClass(frm['fc-1.comments'], 'required', failed);
383}
384
385function dateOnChange(dateField)
386{
387  var frm = document.forms['reggie'];
388
389  setInputStatus(dateField, '', '');
390  dateIsValid[dateField] = true;
391  var date = frm[dateField].value;
392
393  if (date == '')
394  {
395    var required = frm[dateField].className.indexOf('required') != -1;
396    setInputStatus(dateField, 'Missing date', required ? 'invalid' : 'warning');
397    if (required) dateIsValid[dateField] = false;
398    return;
399  }
400
401  // Auto-fill the date if it's only given with 4(MMdd) or 6(yyMMdd) digits.   
402  date = autoFillDate(date);
403  frm[dateField].value = date;
404  if (!Dates.isDate(date, 'yyyyMMdd'))
405  {
406    setInputStatus(dateField, 'Not a valid date', 'invalid');
407    dateIsValid[dateField] = false;
408    return;
409  }
410 
411  setInputStatus(dateField, '', 'valid');
412}
413
414function setDate(frmName, dateField, date)
415{
416  var frm = document.forms['reggie'];
417  frm[dateField].value = date;
418  dateOnChange(dateField);
419  frm[dateField].focus();
420}
421
422// Cluster comments are required when 'Failure' has been selected
423function commentsOnChange(commentField)
424{
425  var frm = document.forms['reggie'];
426  commentsIsValid[commentField] = false;
427  setInputStatus(commentField, '', '');
428 
429  var comments = frm[commentField].value;
430  if (comments == '')
431  {
432    var required = frm[commentField].className.indexOf('required') != -1;
433    if (required)
434    {
435      setInputStatus(commentField, 'Missing', 'invalid');
436      return;
437    }
438  }
439
440  setInputStatus(commentField, '', 'valid');
441  commentsIsValid[commentField] = true;
442}
443
444function flowCellIdOnBlur(idField)
445{
446  var frm = document.forms['reggie'];
447 
448  setInputStatus(idField, '', '');
449  flowCellIdIsValid[idField] = false;
450 
451  var id = frm[idField].value;
452  if (id == '')
453  {
454    setInputStatus(idField, 'ID is a required value', 'invalid');
455    return;
456  }
457 
458  setInputStatus(idField, '', 'valid');
459  flowCellIdIsValid[idField] = true;
460}
461
462function readStringOnBlur(readStringField)
463{
464  var frm = document.forms['reggie'];
465 
466  setInputStatus(readStringField, '', '');
467  readStringIsValid[readStringField] = false;
468 
469  var readString = frm[readStringField].value;
470  if (readString == '')
471  {
472    setInputStatus(readStringField, 'ReadString is a required value', 'invalid');
473    return;
474  }
475  if (!readString.match(/^([YNIJ]\d+)+$/))
476  {
477    setInputStatus(readStringField, 'Not a valid ReadString value', 'invalid');
478    return;
479  }
480 
481  readStringIsValid[readStringField] = true;
482  setInputStatus(readStringField, '', 'valid');
483}
484
485
486function goRegister()
487{
488  var failed = document.getElementById('outcomeFailed').checked;
489  var frm = document.forms['reggie'];
490  if (failed)
491  {
492    if (!step2IsValid()) return;
493    disableStep2();
494  }
495  else
496  {
497    if (!step3IsValid()) return;
498    Main.addClass(document.getElementById('step.3.section'), 'disabled');
499    frm.sequencingStartDate.disabled = true;
500    frm.sequencingOperator.disabled = true;
501    frm.sequencingProtocol.disabled = true;
502    frm.sequencer.disabled = true;
503    frm.sequencingComments.disabled = true;
504  }
505 
506
507  Main.hide('goregister');
508  Main.hide('gocancel');
509 
510  var submitInfo = {};
511  submitInfo.failed = failed;
512 
513  // Cluster fields
514  submitInfo.clusterDate = frm.clusterDate.value;
515  submitInfo.clusterOperator = frm.clusterOperator.value;
516  submitInfo.clusterProtocol = parseInt(frm.clusterProtocol.value, 10);
517 
518  if (!failed)
519  {
520    // Sequence start fields
521    submitInfo.sequencingStartDate = frm.sequencingStartDate.value;
522    submitInfo.sequencingOperator = frm.sequencingOperator.value;
523    submitInfo.sequencingProtocol = parseInt(frm.sequencingProtocol.value, 10);
524    submitInfo.sequencer = parseInt(frm.sequencer.value, 10);
525    submitInfo.sequencingComments = frm.sequencingComments.value;
526  }
527
528  submitInfo.flowCells = [];
529  var index = 0;
530  for (var i = 0; i < frm.flowcells.length; i++)
531  {
532    if (frm.flowcells[i].selected) 
533    {
534      var fc = frm.flowcells[i].flowCell;
535      frm['fc-'+index+'.readString'].disabled = true;
536      fc.externalId = frm['fc-'+index+'.id'].value;
537      fc.comments = frm['fc-'+index+'.comments'].value;
538      if (!failed)
539      {
540        fc.ReadString = frm['fc-'+index+'.readString'].value;
541        fc.HiSeqPosition = Forms.getCheckedRadio(frm['fc-'+index+'.pos']).value;
542      }
543      submitInfo.flowCells[submitInfo.flowCells.length] = fc;
544      index++;
545    }
546  }
547 
548  if (debug) Main.debug(JSON.stringify(submitInfo));
549  var url = '../FlowCell.servlet?ID=<%=ID%>&cmd=RegisterFlowCells';
550 
551  var request = Ajax.getXmlHttpRequest();
552  try
553  {
554    showLoadingAnimation('Performing registration...');
555    request.open("POST", url, false);
556    request.send(JSON.stringify(submitInfo));
557  }
558  finally
559  {
560    hideLoadingAnimation();
561  }
562 
563  if (debug) Main.debug(request.responseText);
564  var response = JSON.parse(request.responseText);
565 
566  if (response.messages && response.messages.length > 0)
567  {
568    var msg = '<ul>';
569    for (var i = 0; i < response.messages.length; i++)
570    {
571      var msgLine = response.messages[i];
572      if (msgLine.indexOf('[Warning]') >= 0)
573      {
574        msg += '<li class="warning">' + msgLine.replace('[Warning]', '');
575      }
576      else
577      {
578        msg += '<li>' + msgLine;
579      }
580    }
581    msg += '</ul>';
582    setInnerHTML('messages', msg);
583    Main.show('messages');
584  }
585 
586  if (response.status != 'ok')
587  {
588    Main.addClass(document.getElementById('messages'), 'failure');
589    setFatalError(response.message);
590    return false;
591  }
592
593  Main.show('gorestart');
594}
595
596function hiseqPosOnClick(index)
597{
598  var frm = document.forms['reggie'];
599
600  var clicked = frm['fc-'+index+'.pos'];
601  var other = frm['fc-'+(1-index)+'.pos'];
602 
603  other[0].checked = clicked[1].checked;
604  other[1].checked = clicked[0].checked;
605 
606}
607
608</script>
609<style>
610#step\.2\.section.hide-fc-1  .fc-1
611{
612  display: none;
613}
614
615#step\.3\.section.hide-fc-1  .fc-1
616{
617  visibility: hidden;
618}
619
620</style>
621</base:head>
622<base:body onload="init()">
623
624  <p:path><p:pathelement 
625    title="Reggie" href="<%="../index.jsp?ID="+ID%>" 
626    /><p:pathelement title="Register clustering and sequencing startup" 
627    /></p:path>
628
629  <div class="content">
630  <%
631  if (sc.getActiveProjectId() == 0)
632  {
633    %>
634    <div class="messagecontainer note" style="width: 950px; margin-left: 20px; margin-bottom: 20px; margin-right: 0px; font-weight: bold; color: #cc0000;">
635      No project has been selected. You may proceed with the registration but
636      created items will not be shared.
637    </div>
638    <%
639  }
640  %>
641
642  <div class="allsteps">
643    <div class="step current" id="step.1">1</div>
644    ›
645    <div class="step future" id="step.2">2</div>
646    <span id="step.3.box">
647    ›
648    <div class="step future" id="step.3">3</div>
649    </span>
650  </div>
651
652
653  <form name="reggie" onsubmit="return false;">
654    <input type="hidden" name="pdf.id" value="">
655 
656  <div id="step.1.section">
657  <table class="stepform">
658  <tr>
659    <td rowspan="3" class="stepno">1</td>
660    <td class="steptitle">Select flow cells</td>
661  </tr>
662  <tr>
663    <td class="stepfields">
664      <table>
665      <tr valign="top">
666        <td class="prompt">Flow cells</td>
667        <td class="input"><select class="required" style="width:90%;" 
668            name="flowcells" id="flowcells" multiple size="4" onchange="flowCellsOnChange()"></select>
669        </td>
670        <td class="status" id="flowcells.status"></td>
671        <td class="help"><span id="flowcells.message" class="message" style="display: none;"></span>
672          Select 1 or 2 existing flow cells. The list contain all flow cells that
673          has not yet been clustered or sequenced (determined by the absence of a 'creation' date).
674        </td>
675      </tr>
676      <tr valign="top">
677        <td class="prompt">Outcome</td>
678        <td class="input">
679          <input type="radio" name="outcome" id="outcomeSuccess" 
680            onchange="outcomeOnChange()" checked><label for="outcomeSuccess">Success</label> - sequencing has started<br>
681          <input type="radio" name="outcome" id="outcomeFailed" 
682            onchange="outcomeOnChange()"><label for="outcomeFailed">Failure</label> - no sequencing
683        </td>
684        <td class="status"></td>
685        <td class="help">
686          Select the <b>Success</b> option if sequencing has been started.
687          Select the <b>Failure</b> option if it was not poosible to start sequencing
688          the flow cells.
689        </td>
690      </tr>
691      </table>
692    </td>
693  </tr>
694  </table>
695  </div>
696 
697  <div id="step.2.section" style="display: none;">
698  <table class="stepform">
699  <tr>
700    <td rowspan="3" class="stepno">2</td>
701    <td class="steptitle">Clustering information</td>
702  </tr>
703  <tr>
704    <td class="stepfields">
705      <table>
706      <tr valign="top">
707        <td class="prompt">Date</td>
708        <td class="input">
709          <input type="text" class="required" name="clusterDate" value="" size="12" maxlength="10"
710            onblur="dateOnChange('clusterDate')" onkeypress="focusOnEnter(event, 'clusterOperator')">
711            <base:icon 
712              onclick="Dates.selectDate('Cluster date', 'reggie', 'clusterDate', 'setDate', 'yyyyMMdd')"
713              image="calendar.png" 
714              tooltip="Select a date from a calendar" 
715              tabindex="-1"
716            />
717        </td>
718        <td class="status" id="clusterDate.status"></td>
719        <td class="help">
720          <span id="clusterDate.message" class="message" style="display: none;"></span>(YYYYMMDD or MMDD)
721        </td>
722      </tr>
723      <tr valign="top">
724        <td class="prompt">Operator</td>
725        <td class="input">
726          <input type="text" name="clusterOperator" value="<%=HTML.encodeTags(user.getName()) %>" 
727            style="width: 90%;" maxlength="255" onkeypress="focusOnEnter(event, 'clusterProtocol')">
728        </td>
729        <td class="status" id="clusterOperator.status"></td>
730        <td class="help">
731          <span id="clusterOperator.message" class="message" style="display: none;"></span>
732        </td>
733      </tr>
734      <tr valign="top">
735        <td class="prompt">Protocol</td>
736        <td class="input"><select style="width:90%" name="clusterProtocol" id="clusterProtocol" 
737          onkeypress="focusOnEnter(event, 'fc-0.id')"></select></td>
738        <td class="status" id="clusterProtocol.status"></td>
739        <td class="help"><span id="clusterProtocol.message" class="message" style="display: none;"></span>
740          Select the protocol which was used in the clustering.
741        </td>
742      </tr>
743      <tbody class="fc-0">
744      <tr valign="top">
745        <td class="prompt" id="fc-0.name.c">Flow cell A</td>
746        <td class="input"></td>
747        <td class="status"></td>
748        <td class="help"></td>
749      </tr>
750      <tr valign="top">
751        <td class="subprompt">ID</td>
752        <td><input type="text" class="required" name="fc-0.id" onblur="flowCellIdOnBlur(this.name)" onkeypress="focusOnEnter(event, 'fc-0.comments')"></td>
753        <td class="status" id="fc-0.id.status"></td>
754        <td class="help"><span id="fc-0.id.message" class="message"></span></td>
755      </tr>
756      <tr valign="top">
757        <td class="subprompt">Comments</td>
758        <td class="input"><textarea rows="4" cols="50" style="width: 90%;" name="fc-0.comments" onblur="commentsOnChange(this.name)"></textarea></td>
759        <td class="status" id="fc-0.comments.status"></td>
760        <td class="help"><span id="fc-0.comments.message" class="message" style="display: none;"></span>
761          Comments about the clustering.
762        </td>
763      </tr>
764      </tbody>
765      <tbody class="fc-1">
766      <tr valign="top">
767        <td class="prompt" id="fc-1.name.c">Flow cell B</td>
768        <td class="input"></td>
769        <td class="status"></td>
770        <td class="help"></td>
771      </tr>
772      <tr valign="top">
773        <td class="subprompt">ID</td>
774        <td><input type="text" class="required" name="fc-1.id" onblur="flowCellIdOnBlur(this.name)" onkeypress="focusOnEnter(event, 'fc-1.comments')"></td>
775        <td class="status" id="fc-1.id.status"></td>
776        <td class="help"><span id="fc-1.id.message" class="message"></span></td>
777      </tr>
778      <tr valign="top">
779        <td class="subprompt">Comments</td>
780        <td class="input"><textarea rows="4" cols="50" style="width: 90%;" name="fc-1.comments" onblur="commentsOnChange(this.name)"></textarea></td>
781        <td class="status" id="fc-1.comments.status"></td>
782        <td class="help"><span id="fc-1.comments.message" class="message" style="display: none;"></span>
783          Comments about the clustering.
784        </td>
785      </tr>
786      </tbody>
787      </table>
788    </td>
789  </tr>
790  </table>
791  </div>
792 
793 
794  <div id="step.3.section" style="display: none;">
795  <table class="stepform">
796  <tr>
797    <td rowspan="3" class="stepno">3</td>
798    <td class="steptitle">Sequencing start information</td>
799  </tr>
800  <tr>
801    <td class="stepfields">
802      <table style="border-collapse: collapse;">
803      <tr>
804        <td class="prompt">Sequencing start date</td>
805        <td class="input" colspan="3">
806          <input type="text" class="required" name="sequencingStartDate" maxlength="10" style="width: 8em;"
807            onblur="dateOnChange('sequencingStartDate')" onkeypress="focusOnEnter(event, 'sequencingOperator')">
808            <base:icon 
809              onclick="Dates.selectDate('Sequence start date', 'reggie', 'sequencingStartDate', 'setDate', 'yyyyMMdd')"
810              image="calendar.png" 
811              tooltip="Select a date from a calendar" 
812              tabindex="-1"
813            />
814        </td>
815        <td class="status" id="sequencingStartDate.status"></td>
816        <td class="help">
817          <span id="sequencingStartDate.message" class="message" style="display: none;"></span>(YYYYMMDD or MMDD)
818        </td>
819      </tr>
820      <tr valign="top">
821        <td class="prompt">Operator</td>
822        <td class="input" colspan="3">
823          <input type="text" name="sequencingOperator" value="<%=HTML.encodeTags(user.getName()) %>" 
824            style="width: 90%;" maxlength="255" onkeypress="focusOnEnter(event, 'sequencingProtocol')">
825        </td>
826        <td class="status" id="sequencingOperator.status"></td>
827        <td class="help">
828          <span id="sequencingOperator.message" class="message" style="display: none;"></span>
829        </td>
830      </tr>
831      <tr valign="top">
832        <td class="prompt">Protocol</td>
833        <td class="input" colspan="3"><select style="width:90%" name="sequencingProtocol" id="sequencingProtocol" 
834          onkeypress="focusOnEnter(event, 'sequencer')"></select></td>
835        <td class="status" id="sequencingProtocol.status"></td>
836        <td class="help"><span id="sequencingProtocol.message" class="message" style="display: none;"></span>
837          Select the protocol for the sequencing.
838        </td>
839      </tr>
840      <tr valign="top">
841        <td class="prompt">HiSeq</td>
842        <td class="input" colspan="3"><select style="width:90%" name="sequencer" id="sequencer" 
843          onkeypress="focusOnEnter(event, 'sequencingComments')"></select></td>
844        <td class="status" id="sequencer.status"></td>
845        <td class="help"><span id="sequencer.message" class="message" style="display: none;"></span>
846          Select the HiSeq machine which is used for sequencing.
847        </td>
848      </tr>
849      <tr valign="top" style="border-top: 1em solid transparent;">
850        <td class="prompt">Flow cells</td>
851        <td class="fc-0" colspan="2"><span id="fc-0.name.s"></span></td>
852        <td class="fc-1"><span id="fc-1.name.s"></span></td>
853        <td class="status"></td>
854        <td class="help"></td>
855      </tr>
856      <tr valign="top">
857        <td class="subprompt">ReadString</td>
858        <td class="fc-0"><input type="text" class="required" name="fc-0.readString" onblur="readStringOnBlur(this.name)"></td>
859        <td class="status" id="fc-0.readString.status"></td>
860        <td class="fc-1"><input type="text" class="required" name="fc-1.readString" onblur="readStringOnBlur(this.name)"></td>
861        <td class="status fc-1" id="fc-1.readString.status"></td>
862        <td class="help"><span id="fc-0.readString.message" class="message"></span><span id="fc-1.readString.message" class="message"></span></td>
863      </tr>
864      <tr valign="top">
865        <td class="subprompt">HiSeq position</td>
866        <td class="fc-0">
867          <label><input type="radio" name="fc-0.pos" value="A" onclick="hiseqPosOnClick(0)" checked>A</label><br>
868          <label><input type="radio" name="fc-0.pos" value="B" onclick="hiseqPosOnClick(0)">B</label>
869        </td>
870        <td class="status"></td>
871        <td class="fc-1">
872          <label><input type="radio" name="fc-1.pos" value="A" onclick="hiseqPosOnClick(1)">A</label><br>
873          <label><input type="radio" name="fc-1.pos" value="B" onclick="hiseqPosOnClick(1)" checked>B</label>
874        </td>
875        <td class="status fc-1"></td>
876        <td class="help">Select <b>A</b> or <b>B</b> position for each flow cell.</td>
877      </tr>
878      <tr valign="top" style="border-top: 1em solid transparent;">
879        <td class="prompt">Comments</td>
880        <td class="input" colspan="3"><textarea rows="4" cols="50" style="width: 90%;" name="sequencingComments" value=""></textarea></td>
881        <td class="status" id="sequencingComments.status"></td>
882        <td class="help"><span id="sequencingComments.message" class="message" style="display: none;"></span>Comments about the sequencing startup.</td>
883      </tr>
884      </table>
885    </td>
886  </tr>
887  </table>
888  </div>
889 
890  <div class="loading" id="loading" style="display: none;"><table><tr><td><img src="../images/loading.gif"></td><td id="loading.msg">Please wait...</td></tr></table></div>
891 
892  <div class="messagecontainer error" id="errorMessage" style="display: none; width: 950px; margin-left: 20px; margin-bottom: 0px;"></div>
893 
894  <div id="messages" class="success" style="display: none; width: 950px; margin-left: 20px; margin-top: 20px;"></div>
895 
896  <table style="margin-left: 20px; margin-top: 10px;" class="navigation">
897    <tr>
898      <td><base:button id="gocancel" title="Cancel" onclick="goRestart(false)" style="display: none;"/></td>
899      <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" onclick="goNext(true)"/></td>
900      <td><base:button id="goregister" title="Register" image="<%=home+"/images/import.png"%>" onclick="goRegister()" style="display: none;"/></td>
901      <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" onclick="goRestart(true)" style="display: none;"/></td>
902      <td id="gonext.message" class="message"></td>
903    </tr>
904  </table>
905 
906  </form>
907  </div>
908 
909</base:body>
910</base:page>
911<%
912}
913finally
914{
915  if (dc != null) dc.close();
916}
917%>
Note: See TracBrowser for help on using the repository browser.