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

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

References #481: Register prepared flow cells

Changed orientation of the HiSeq? position/ReadString table.

File size: 26.8 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 startup 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="2">
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="2">
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="2"><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">Sequencing machine</td>
842        <td class="input" colspan="2"><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     
850      <tr valign="top" style="border-top: 1em solid transparent;">
851        <td class="prompt"></td>
852        <td style="font-weight: bold;">HiSeq position</td>
853        <td style="font-weight: bold;">ReadString</td>
854        <td class="status"></td>
855        <td class="help"></td>
856      </tr>
857      <tr valign="top" class="fc-0">
858        <td class="subprompt"><span id="fc-0.name.s"></span></td>
859        <td>&nbsp;
860          <label><input type="radio" name="fc-0.pos" value="A" onclick="hiseqPosOnClick(0)" checked>A</label>
861          &nbsp;
862          <label><input type="radio" name="fc-0.pos" value="B" onclick="hiseqPosOnClick(0)">B</label>
863        </td>
864        <td><input type="text" class="required" name="fc-0.readString" onblur="readStringOnBlur(this.name)"></td>
865        <td class="status" id="fc-0.readString.status"></td>
866        <td class="help"><span id="fc-0.readString.message" class="message"></span></td>
867      </tr>
868      <tr valign="top" class="fc-1">
869        <td class="subprompt"><span id="fc-1.name.s"></span></td>
870        <td>&nbsp;
871          <label><input type="radio" name="fc-1.pos" value="A" onclick="hiseqPosOnClick(1)">A</label>
872          &nbsp;
873          <label><input type="radio" name="fc-1.pos" value="B" onclick="hiseqPosOnClick(1)" checked>B</label>
874        </td>
875        <td><input type="text" class="required" name="fc-1.readString" onblur="readStringOnBlur(this.name)"></td>
876        <td class="status" id="fc-1.readString.status"></td>
877        <td class="help"><span id="fc-1.readString.message" class="message"></span></td>
878      </tr>
879
880
881      <tr valign="top" style="border-top: 1em solid transparent;">
882        <td class="prompt">Comments</td>
883        <td class="input" colspan="2"><textarea rows="4" cols="50" style="width: 90%;" name="sequencingComments" value=""></textarea></td>
884        <td class="status" id="sequencingComments.status"></td>
885        <td class="help"><span id="sequencingComments.message" class="message" style="display: none;"></span>Comments about the sequencing startup.</td>
886      </tr>
887      </table>
888    </td>
889  </tr>
890  </table>
891  </div>
892 
893  <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>
894 
895  <div class="messagecontainer error" id="errorMessage" style="display: none; width: 950px; margin-left: 20px; margin-bottom: 0px;"></div>
896 
897  <div id="messages" class="success" style="display: none; width: 950px; margin-left: 20px; margin-top: 20px;"></div>
898 
899  <table style="margin-left: 20px; margin-top: 10px;" class="navigation">
900    <tr>
901      <td><base:button id="gocancel" title="Cancel" onclick="goRestart(false)" style="display: none;"/></td>
902      <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" onclick="goNext(true)"/></td>
903      <td><base:button id="goregister" title="Register" image="<%=home+"/images/import.png"%>" onclick="goRegister()" style="display: none;"/></td>
904      <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" onclick="goRestart(true)" style="display: none;"/></td>
905      <td id="gonext.message" class="message"></td>
906    </tr>
907  </table>
908 
909  </form>
910  </div>
911 
912</base:body>
913</base:page>
914<%
915}
916finally
917{
918  if (dc != null) dc.close();
919}
920%>
Note: See TracBrowser for help on using the repository browser.