extensions/net.sf.basedb.meludi/trunk/resources/libprep/select_dna.jsp

Code
Comments
Other
Rev Date Author Line
3449 28 Jul 15 olle 1 <%@ page
3449 28 Jul 15 olle 2   pageEncoding="UTF-8"
3449 28 Jul 15 olle 3   session="false"
3449 28 Jul 15 olle 4   import="net.sf.basedb.core.Application"
3449 28 Jul 15 olle 5   import="net.sf.basedb.core.User"
3449 28 Jul 15 olle 6   import="net.sf.basedb.core.DbControl"
3449 28 Jul 15 olle 7   import="net.sf.basedb.core.SessionControl"
3449 28 Jul 15 olle 8   import="net.sf.basedb.clients.web.Base"
3449 28 Jul 15 olle 9   import="net.sf.basedb.clients.web.util.HTML"
3449 28 Jul 15 olle 10   import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
3449 28 Jul 15 olle 11   import="net.sf.basedb.util.Values"
3449 28 Jul 15 olle 12   import="net.sf.basedb.util.formatter.WellCoordinateFormatter"
3449 28 Jul 15 olle 13 %>
3449 28 Jul 15 olle 14 <%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
3449 28 Jul 15 olle 15 <%@ taglib prefix="m" uri="/WEB-INF/menu.tld" %>
3449 28 Jul 15 olle 16 <%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
3449 28 Jul 15 olle 17 <%@ taglib prefix="tbl" uri="/WEB-INF/table.tld" %>
3449 28 Jul 15 olle 18 <%
3449 28 Jul 15 olle 19 final SessionControl sc = Base.getExistingSessionControl(request, true);
3449 28 Jul 15 olle 20 final String ID = sc.getId();
3449 28 Jul 15 olle 21 final float scale = Base.getScale(sc);
3449 28 Jul 15 olle 22 final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.meludi");
3449 28 Jul 15 olle 23 final boolean isNeoPrep = Values.getBoolean(request.getParameter("neoprep"));
3449 28 Jul 15 olle 24 DbControl dc = null;
3449 28 Jul 15 olle 25 try
3449 28 Jul 15 olle 26 {
3449 28 Jul 15 olle 27   dc = sc.newDbControl();
3449 28 Jul 15 olle 28   final User user = User.getById(dc, sc.getLoggedInUserId());
3449 28 Jul 15 olle 29 %>
3449 28 Jul 15 olle 30 <base:page type="default">
3449 28 Jul 15 olle 31 <base:head 
3449 28 Jul 15 olle 32   scripts="~../meludi-2.js,~select_dna.js,~plate.js,~pools.js,js-draw.js" 
3449 28 Jul 15 olle 33   styles="path.css,toolbar.css,~../css/meludi-2.css,~../css/plate.css"
3449 28 Jul 15 olle 34   >
3449 28 Jul 15 olle 35 <style>
3449 28 Jul 15 olle 36
3449 28 Jul 15 olle 37 /* Empty wells should have greyed, italic text */
3449 28 Jul 15 olle 38 .well.empty
3449 28 Jul 15 olle 39 {
3449 28 Jul 15 olle 40   text-align: center;
3449 28 Jul 15 olle 41   vertical-align: middle;
3449 28 Jul 15 olle 42   font-style: italic;
3449 28 Jul 15 olle 43   color: #999999;
3449 28 Jul 15 olle 44 }
3449 28 Jul 15 olle 45
3449 28 Jul 15 olle 46 /* A well assigned for QC include a background icon as indicator */
3449 28 Jul 15 olle 47 .well.qc
3449 28 Jul 15 olle 48 {
3449 28 Jul 15 olle 49   background-image: url('../images/mrnaqc.png');
3449 28 Jul 15 olle 50   background-position: 98% 25%;
3449 28 Jul 15 olle 51   background-repeat: no-repeat;
3449 28 Jul 15 olle 52 }
3449 28 Jul 15 olle 53
3449 28 Jul 15 olle 54 /* A well which contain replicate DNA is also marked with an icon */
3449 28 Jul 15 olle 55 .well.replicate
3449 28 Jul 15 olle 56 {
3449 28 Jul 15 olle 57   background-image: url('../images/copy.png');
3449 28 Jul 15 olle 58   background-position: 98% 25%;
3449 28 Jul 15 olle 59   background-repeat: no-repeat;
3449 28 Jul 15 olle 60 }
3449 28 Jul 15 olle 61
3449 28 Jul 15 olle 62 /* A well that is both a replicate and QC need to re-arrange the icons a bit */
3449 28 Jul 15 olle 63 .well.qc.replicate
3449 28 Jul 15 olle 64 {
3449 28 Jul 15 olle 65   background-image: url('../images/mrnaqc.png'), url('../images/copy.png');
3449 28 Jul 15 olle 66   background-position: 98% 25%, 98% 75%;
3449 28 Jul 15 olle 67   background-repeat: no-repeat;
3449 28 Jul 15 olle 68 }
3449 28 Jul 15 olle 69
3449 28 Jul 15 olle 70 .well .missing
3449 28 Jul 15 olle 71 {
3449 28 Jul 15 olle 72   font-style: italic;
3449 28 Jul 15 olle 73 }
3449 28 Jul 15 olle 74
3449 28 Jul 15 olle 75 .plate.hide-location .location
3449 28 Jul 15 olle 76 {
3449 28 Jul 15 olle 77   display: none;
3449 28 Jul 15 olle 78 }
3449 28 Jul 15 olle 79 .plate.hide-quantity .quantity
3449 28 Jul 15 olle 80 {
3449 28 Jul 15 olle 81   display: none;
3449 28 Jul 15 olle 82 }
3449 28 Jul 15 olle 83 .plate.hide-volumes .volumes
3449 28 Jul 15 olle 84 {
3449 28 Jul 15 olle 85   display: none;
3449 28 Jul 15 olle 86 }
3449 28 Jul 15 olle 87 .plate.hide-qubitconc .qubitconc
3449 28 Jul 15 olle 88 {
3449 28 Jul 15 olle 89   display: none;
3449 28 Jul 15 olle 90 }
3449 28 Jul 15 olle 91 .plate.hide-quality-score .quality-score
3449 28 Jul 15 olle 92 {
3449 28 Jul 15 olle 93   display: none;
3449 28 Jul 15 olle 94 }
3449 28 Jul 15 olle 95 .plate.hide-qiacube-date .qiacube-date
3449 28 Jul 15 olle 96 {
3449 28 Jul 15 olle 97   display: none;
3449 28 Jul 15 olle 98 }
3449 28 Jul 15 olle 99 .plate.hide-qiacube-date .dilution-date
3449 28 Jul 15 olle 100 {
3449 28 Jul 15 olle 101   display: none;
3449 28 Jul 15 olle 102 }
3449 28 Jul 15 olle 103 .volume
3449 28 Jul 15 olle 104 {
3449 28 Jul 15 olle 105   color: #C80000;
3449 28 Jul 15 olle 106 }
3449 28 Jul 15 olle 107 .water
3449 28 Jul 15 olle 108 {
3449 28 Jul 15 olle 109   color: #0000C8;
3449 28 Jul 15 olle 110 }
3449 28 Jul 15 olle 111 .comment
3449 28 Jul 15 olle 112 {
3449 28 Jul 15 olle 113   font-style: italic;
3449 28 Jul 15 olle 114 }
3449 28 Jul 15 olle 115 #iconSpecialSelect
3449 28 Jul 15 olle 116 {
3449 28 Jul 15 olle 117   cursor: pointer;
3449 28 Jul 15 olle 118 }
3449 28 Jul 15 olle 119 #flaggedRna:before
3449 28 Jul 15 olle 120 {
3449 28 Jul 15 olle 121   content: url('../images/flag.png');
3449 28 Jul 15 olle 122   padding-right: 4px;
3449 28 Jul 15 olle 123 }
3449 28 Jul 15 olle 124 #select-barcode-all
3449 28 Jul 15 olle 125 {
3449 28 Jul 15 olle 126   max-height: 20em;
3449 28 Jul 15 olle 127   overflow: auto;
3449 28 Jul 15 olle 128 }
3449 28 Jul 15 olle 129
3449 28 Jul 15 olle 130 #select-barcode .menuitem
3449 28 Jul 15 olle 131 {
3449 28 Jul 15 olle 132   padding-left: 16px;
3449 28 Jul 15 olle 133 }
3449 28 Jul 15 olle 134
3449 28 Jul 15 olle 135 #select-barcode div.current
3449 28 Jul 15 olle 136 {
3449 28 Jul 15 olle 137   font-weight: bold;
3449 28 Jul 15 olle 138   background-image: url('../images/selected.gif');
3449 28 Jul 15 olle 139   background-position: 2px 50%;
3449 28 Jul 15 olle 140   background-repeat: no-repeat;
3449 28 Jul 15 olle 141 }
3449 28 Jul 15 olle 142
3449 28 Jul 15 olle 143 #select-barcode .menuitem:hover
3449 28 Jul 15 olle 144 {
3449 28 Jul 15 olle 145   padding-left: 14px;
3449 28 Jul 15 olle 146   background-position: 0px 50%;
3449 28 Jul 15 olle 147 }
3449 28 Jul 15 olle 148
3449 28 Jul 15 olle 149 </style>
3449 28 Jul 15 olle 150 </base:head>
3449 28 Jul 15 olle 151 <base:body>
3449 28 Jul 15 olle 152   <p:path><p:pathelement 
3449 28 Jul 15 olle 153     title="MeLuDI" href="<%="../index.jsp?ID="+ID%>" 
3449 28 Jul 15 olle 154     /><p:pathelement title="<%=isNeoPrep ? "Create new NeoPrep plate" : "Create new DNA plate" %>" 
3449 28 Jul 15 olle 155     /></p:path>
3449 28 Jul 15 olle 156
3449 28 Jul 15 olle 157   <div id="page-data" class="datacontainer"
3449 28 Jul 15 olle 158     data-is-neoprep="<%=isNeoPrep ? 1 : 0%>"
3449 28 Jul 15 olle 159   ></div>
3449 28 Jul 15 olle 160
3449 28 Jul 15 olle 161   <div id="canvas" class="absolutefull" style="z-index: -1;">
3449 28 Jul 15 olle 162   
3449 28 Jul 15 olle 163   <div class="content">
3449 28 Jul 15 olle 164   <m:menu
3449 28 Jul 15 olle 165     id="menuSpecialSelect"
3449 28 Jul 15 olle 166     style="display: none; font-weight: normal; text-align: left;">
3449 28 Jul 15 olle 167     <m:menuitem 
3449 28 Jul 15 olle 168       title="All" 
3449 28 Jul 15 olle 169       subclass="auto-init"
3449 28 Jul 15 olle 170       data-auto-init="special-select"
3449 28 Jul 15 olle 171       data-special="all"
3449 28 Jul 15 olle 172       tooltip="Select/deselect all wells on the plate"
3449 28 Jul 15 olle 173     />
3449 28 Jul 15 olle 174     <m:menuitem 
3449 28 Jul 15 olle 175       title="None" 
3449 28 Jul 15 olle 176       subclass="auto-init"
3449 28 Jul 15 olle 177       data-auto-init="special-select"
3449 28 Jul 15 olle 178       data-special="none"
3449 28 Jul 15 olle 179       tooltip="Deselect all wells on the plate (no toggle!)"
3449 28 Jul 15 olle 180     />
3449 28 Jul 15 olle 181     <m:menuitem 
3449 28 Jul 15 olle 182       title="Primary" 
3449 28 Jul 15 olle 183       subclass="auto-init"
3449 28 Jul 15 olle 184       data-auto-init="special-select"
3449 28 Jul 15 olle 185       data-special="pools"
3449 28 Jul 15 olle 186       tooltip="Select/deselect all primary wells on the plate"
3449 28 Jul 15 olle 187     />
3449 28 Jul 15 olle 188     <m:menuitem 
3449 28 Jul 15 olle 189       title="All empty" 
3449 28 Jul 15 olle 190       subclass="auto-init"
3449 28 Jul 15 olle 191       data-auto-init="special-select"
3449 28 Jul 15 olle 192       data-special="empty"
3449 28 Jul 15 olle 193       tooltip="Select/deselect all empty wells on the plate"
3449 28 Jul 15 olle 194     />
3449 28 Jul 15 olle 195     <m:menuitem 
3449 28 Jul 15 olle 196       title="Empty in primary" 
3449 28 Jul 15 olle 197       subclass="auto-init"
3449 28 Jul 15 olle 198       data-auto-init="special-select"
3449 28 Jul 15 olle 199       data-special="empty-pools"
3449 28 Jul 15 olle 200       tooltip="Select/deselect all empty primary wells on the plate"
3449 28 Jul 15 olle 201     />
3449 28 Jul 15 olle 202     <m:menuseparator />
3449 28 Jul 15 olle 203     <m:menuitem 
3449 28 Jul 15 olle 204       icon="<%=home+"/images/stratagene.png"%>"
3449 28 Jul 15 olle 205       title="Stratagene" 
3449 28 Jul 15 olle 206       subclass="auto-init"
3449 28 Jul 15 olle 207       data-auto-init="special-select"
3449 28 Jul 15 olle 208       data-special="stratagene"
3449 28 Jul 15 olle 209       tooltip="Select/deselect all wells with Stratagene"
3449 28 Jul 15 olle 210     />
3449 28 Jul 15 olle 211     <m:menuitem 
3449 28 Jul 15 olle 212       icon="<%=home+"/images/external.png"%>"
3449 28 Jul 15 olle 213       title="External" 
3449 28 Jul 15 olle 214       subclass="auto-init"
3449 28 Jul 15 olle 215       data-auto-init="special-select"
3449 28 Jul 15 olle 216       data-special="external"
3449 28 Jul 15 olle 217       tooltip="Select/deselect all wells with external DNA"
3449 28 Jul 15 olle 218     />
3449 28 Jul 15 olle 219     <m:menuitem 
3449 28 Jul 15 olle 220       icon="<%=home+"/images/copy.png"%>"
3449 28 Jul 15 olle 221       title="Replicates" 
3449 28 Jul 15 olle 222       subclass="auto-init"
3449 28 Jul 15 olle 223       data-auto-init="special-select"
3449 28 Jul 15 olle 224       data-special="replicates"
3449 28 Jul 15 olle 225       tooltip="Select/deselect all wells with replicated DNA"
3449 28 Jul 15 olle 226     />
3449 28 Jul 15 olle 227     <m:menuitem 
3449 28 Jul 15 olle 228       icon="<%=home+"/images/error.png"%>"
3449 28 Jul 15 olle 229       title="Error" 
3449 28 Jul 15 olle 230       subclass="auto-init"
3449 28 Jul 15 olle 231       data-auto-init="special-select"
3449 28 Jul 15 olle 232       data-special="error"
3449 28 Jul 15 olle 233       tooltip="Select/deselect all wells with an error"
3449 28 Jul 15 olle 234     />
3449 28 Jul 15 olle 235     <m:menuitem 
3449 28 Jul 15 olle 236       icon="<%=home+"/images/warning.png"%>"
3449 28 Jul 15 olle 237       title="Warning" 
3449 28 Jul 15 olle 238       subclass="auto-init"
3449 28 Jul 15 olle 239       data-auto-init="special-select"
3449 28 Jul 15 olle 240       data-special="warning"
3449 28 Jul 15 olle 241       tooltip="Select/deselect all wells with an error"
3449 28 Jul 15 olle 242     />
3449 28 Jul 15 olle 243   </m:menu>
3449 28 Jul 15 olle 244   
3449 28 Jul 15 olle 245   <m:menu
3449 28 Jul 15 olle 246     id="menuContext"
3449 28 Jul 15 olle 247     style="display: none; font-weight: normal; text-align: left;">
3449 28 Jul 15 olle 248     <m:menuitem 
3449 28 Jul 15 olle 249       id="mnuComment"
3449 28 Jul 15 olle 250       title="Comments&hellip;" 
3449 28 Jul 15 olle 251       icon="<%=home+"/images/comment.png"%>" 
3449 28 Jul 15 olle 252       tooltip="Add a comment to the selected wells"
3449 28 Jul 15 olle 253     />
3449 28 Jul 15 olle 254     <m:menuitem 
3449 28 Jul 15 olle 255       id="mnuToggleQc"
3449 28 Jul 15 olle 256       title="Toggle QC" 
3449 28 Jul 15 olle 257       icon="<%=home+"/images/mrnaqc.png"%>" 
3449 28 Jul 15 olle 258       tooltip="Select/deselect DNA for QC" 
3449 28 Jul 15 olle 259     />
3449 28 Jul 15 olle 260     <m:menuseparator />
3449 28 Jul 15 olle 261     <m:menuitem 
3449 28 Jul 15 olle 262       id="mnuCutSelected"
3449 28 Jul 15 olle 263       title="Cut&hellip;" 
3449 28 Jul 15 olle 264       icon="<%=home+"/images/cut.png"%>" 
3449 28 Jul 15 olle 265       tooltip="Clear the selected wells" 
3449 28 Jul 15 olle 266     />
3449 28 Jul 15 olle 267     <m:menuitem  
3449 28 Jul 15 olle 268       id="mnuCopySelected"
3449 28 Jul 15 olle 269       title="Copy" 
3449 28 Jul 15 olle 270       icon="<%=home+"/images/copy.png"%>" 
3449 28 Jul 15 olle 271       tooltip="Make a copy of the selected DNA" 
3449 28 Jul 15 olle 272     />
3449 28 Jul 15 olle 273     <m:menuitem  
3449 28 Jul 15 olle 274       id="mnuPasteToSelected"
3449 28 Jul 15 olle 275       title="Paste" 
3449 28 Jul 15 olle 276       icon="<%=home+"/images/paste.png"%>" 
3449 28 Jul 15 olle 277       tooltip="Paste DNA into selected wells" 
3449 28 Jul 15 olle 278     />
3449 28 Jul 15 olle 279     <m:menuitem  
3449 28 Jul 15 olle 280       id="mnuSwitch"
3449 28 Jul 15 olle 281       title="Switch" 
3449 28 Jul 15 olle 282       icon="<%=home+"/images/switch.png"%>" 
3449 28 Jul 15 olle 283       tooltip="Switch the selected wells (if exactly two)" 
3449 28 Jul 15 olle 284     />
3449 28 Jul 15 olle 285     <m:menuseparator />
3449 28 Jul 15 olle 286     <m:submenu
3449 28 Jul 15 olle 287       subid="flagMenu"
3449 28 Jul 15 olle 288       title="Flag"
3449 28 Jul 15 olle 289       icon="<%=home+"/images/flag.png"%>"
3449 28 Jul 15 olle 290     />
3449 28 Jul 15 olle 291     <m:menuseparator id="sepCaseSummary" />
3449 28 Jul 15 olle 292     <m:menuitem
3449 28 Jul 15 olle 293       id="mnuCaseSummary"
3449 28 Jul 15 olle 294       icon="<%=home+"/images/case_summary.png"%>"
3449 28 Jul 15 olle 295       tooltip="Show case summary"
3449 28 Jul 15 olle 296       title="Case summary&hellip;"
3449 28 Jul 15 olle 297     />
3449 28 Jul 15 olle 298   </m:menu>
3449 28 Jul 15 olle 299
3449 28 Jul 15 olle 300   <m:menu
3449 28 Jul 15 olle 301     id="flagMenu"
3449 28 Jul 15 olle 302     style="display: none;"
3449 28 Jul 15 olle 303     >
3449 28 Jul 15 olle 304 <!--
3449 28 Jul 15 olle 305     <m:menuitem 
3449 28 Jul 15 olle 306       id="mnuFlagLowQualityScore"
3449 28 Jul 15 olle 307       data-flag="LowQualityScore"
3449 28 Jul 15 olle 308       title="LowQualityScore" 
3449 28 Jul 15 olle 309       tooltip="Flag the selected DNA as having a too low RQS/RIN value"
3449 28 Jul 15 olle 310     />
3449 28 Jul 15 olle 311 -->
3449 28 Jul 15 olle 312     <m:menuitem 
3449 28 Jul 15 olle 313       id="mnuFlagLowQualityScore"
3449 28 Jul 15 olle 314       data-flag="LowQualityScore"
3449 28 Jul 15 olle 315       title="LowQualityScore" 
3449 28 Jul 15 olle 316       tooltip="Flag the selected DNA as having a too low Î”Ct value"
3449 28 Jul 15 olle 317     />
3449 28 Jul 15 olle 318     <m:menuitem 
3449 28 Jul 15 olle 319       id="mnuFlagNotEnoughRemainingQuantity"
3449 28 Jul 15 olle 320       data-flag="NotEnoughRemainingQuantity"
3449 28 Jul 15 olle 321       title="NotEnoughRemainingQuantity" 
3449 28 Jul 15 olle 322       tooltip="Flag the selected DNA as having too little remaining quantity"
3449 28 Jul 15 olle 323     />
3449 28 Jul 15 olle 324     <m:menuseparator />
3449 28 Jul 15 olle 325     <m:menuitem 
3449 28 Jul 15 olle 326       id="mnuFlagOther"
3449 28 Jul 15 olle 327       data-flag="ManualFlag"
3449 28 Jul 15 olle 328       title="Other..." 
3449 28 Jul 15 olle 329       tooltip="Flag the selected DNA for some other reason"
3449 28 Jul 15 olle 330     />
3449 28 Jul 15 olle 331   </m:menu>
3449 28 Jul 15 olle 332   
3449 28 Jul 15 olle 333   <div id="select-barcode" class="menu vertical bg-filled-100" style="width: 15em; z-index: 2; display: none;">
3449 28 Jul 15 olle 334     <div class="menuitem interactable enabled" id="select-barcode-default">Default</div>
3449 28 Jul 15 olle 335     <div class="menuseparator" id="select-barcode-default-separator"></div>
3449 28 Jul 15 olle 336     <div id="select-barcode-all"></div>
3449 28 Jul 15 olle 337   </div>
3449 28 Jul 15 olle 338
3449 28 Jul 15 olle 339   <form name="meludi" id="wizard" class="wizard">
3449 28 Jul 15 olle 340   
3449 28 Jul 15 olle 341   <div class="step auto-hide" id="step-1">
3449 28 Jul 15 olle 342     <div class="step-no">1</div>
3449 28 Jul 15 olle 343     <div class="step-title"><%=isNeoPrep ? "NeoPrep plate" : "Fragmented DNA plate"%></div>
3449 28 Jul 15 olle 344     <div class="step-content">
3449 28 Jul 15 olle 345
3449 28 Jul 15 olle 346       <table class="step-form">
3449 28 Jul 15 olle 347       <tr>
3449 28 Jul 15 olle 348         <td class="prompt">Name</td>
3449 28 Jul 15 olle 349         <td class="input" id="plateName"></td>
3449 28 Jul 15 olle 350         <td class="status"></td>
3449 28 Jul 15 olle 351         <td class="help">Select DNA items to use for the new plate.</td>
3449 28 Jul 15 olle 352       </tr>
3449 28 Jul 15 olle 353       <%
3449 28 Jul 15 olle 354       if (isNeoPrep)
3449 28 Jul 15 olle 355       {
3449 28 Jul 15 olle 356         %>
3449 28 Jul 15 olle 357         <tr>
3449 28 Jul 15 olle 358           <td class="prompt">Pool layout</td>
3449 28 Jul 15 olle 359           <td class="input">
3449 28 Jul 15 olle 360             <select name="pool_schema" id="pool_schema" class="required"></select>
3449 28 Jul 15 olle 361           </td>
3449 28 Jul 15 olle 362           <td class="status"></td>
3449 28 Jul 15 olle 363           <td class="help">Pool layout (can't be changed later).</td>
3449 28 Jul 15 olle 364         </tr>
3449 28 Jul 15 olle 365         <tr>
3449 28 Jul 15 olle 366           <td class="prompt">Barcode variant</td>
3449 28 Jul 15 olle 367           <td class="input">
3449 28 Jul 15 olle 368             <select name="barcode_variant" id="barcode_variant" class="required"></select>
3449 28 Jul 15 olle 369           </td>
3449 28 Jul 15 olle 370           <td class="status"></td>
3449 28 Jul 15 olle 371           <td class="help">Barcode variant.</td>
3449 28 Jul 15 olle 372         </tr>
3449 28 Jul 15 olle 373         <%
3449 28 Jul 15 olle 374       }
3449 28 Jul 15 olle 375       else
3449 28 Jul 15 olle 376       {
3449 28 Jul 15 olle 377         %>
3449 28 Jul 15 olle 378         <tr>
3449 28 Jul 15 olle 379           <td class="prompt">Preliminary pool layout</td>
3449 28 Jul 15 olle 380           <td class="input">
3449 28 Jul 15 olle 381             <select name="pool_schema" id="pool_schema" class="required"></select>
3449 28 Jul 15 olle 382           </td>
3449 28 Jul 15 olle 383           <td class="status"></td>
3449 28 Jul 15 olle 384           <td class="help">Preliminary pool layout (can be changed later).</td>
3449 28 Jul 15 olle 385         </tr>
3449 28 Jul 15 olle 386         <%
3449 28 Jul 15 olle 387       }
3449 28 Jul 15 olle 388       %>
3449 28 Jul 15 olle 389       <tr>
3449 28 Jul 15 olle 390         <td class="prompt">Stratagene to use</td>
3449 28 Jul 15 olle 391         <td class="input">
3449 28 Jul 15 olle 392           <select name="stratagene" class="required"></select>
3449 28 Jul 15 olle 393         </td>
3449 28 Jul 15 olle 394         <td class="status"></td>
3449 28 Jul 15 olle 395         <td class="help">
3449 28 Jul 15 olle 396           Select the Stratagene tube to use. If not known, the
3449 28 Jul 15 olle 397           generic <b>Stratagene.r</b> should be used.
3449 28 Jul 15 olle 398         </td>
3449 28 Jul 15 olle 399       </tr>
3449 28 Jul 15 olle 400       <tr>
3449 28 Jul 15 olle 401         <td class="prompt">Amount of DNA</td>
3449 28 Jul 15 olle 402         <td class="input">
3449 28 Jul 15 olle 403           Normal 
3449 28 Jul 15 olle 404           <input type="text" class="text required" name="quantity_regular" id="quantity_regular"
3449 28 Jul 15 olle 405             value="<%=isNeoPrep ? "0.1" : "1.1"%>" style="width: 4em;">µg,
3449 28 Jul 15 olle 406           QC 
3449 28 Jul 15 olle 407           <input type="text" class="text required" name="quantity_qc" id="quantity_qc"
3449 28 Jul 15 olle 408             value="1.22" style="width: 4em;" <%=isNeoPrep ? "disabled" : "" %>>µg
3449 28 Jul 15 olle 409         </td>
3449 28 Jul 15 olle 410         <td class="status" id="quantities.status"></td>
3449 28 Jul 15 olle 411         <td class="help">
3449 28 Jul 15 olle 412           <span id="quantities.message" class="message" style="display: none;"></span>
3449 28 Jul 15 olle 413           Specify the amount of DNA to use. Aliquots for QC usually need 0.12µg extra.
3449 28 Jul 15 olle 414         </td>
3449 28 Jul 15 olle 415       </tr>
3449 28 Jul 15 olle 416       <tr class="align-top">
3449 28 Jul 15 olle 417         <td class="prompt">Comments</td>
3449 28 Jul 15 olle 418         <td class="input">
3449 28 Jul 15 olle 419           <textarea rows="2" name="comments" id="comments"></textarea>
3449 28 Jul 15 olle 420         </td>
3449 28 Jul 15 olle 421         <td class="status"></td>
3449 28 Jul 15 olle 422         <td class="help">Comments about the new plate.</td>
3449 28 Jul 15 olle 423       </tr>
3449 28 Jul 15 olle 424       <tr class="align-top">
3449 28 Jul 15 olle 425         <td class="prompt">Show</td>
3449 28 Jul 15 olle 426         <td class="input" colspan="2">
3449 28 Jul 15 olle 427           <table>
3449 28 Jul 15 olle 428           <tr>
3449 28 Jul 15 olle 429             <td>
3449 28 Jul 15 olle 430               <input type="checkbox" name="location" id="location" checked><label for="location">Bioplate location</label><br>
3449 28 Jul 15 olle 431               <input type="checkbox" name="quantity" id="quantity" checked><label for="quantity">Remaining quantity</label><br>
3449 28 Jul 15 olle 432             </td>
3449 28 Jul 15 olle 433             <td>
3449 28 Jul 15 olle 434 <!--
3449 28 Jul 15 olle 435               <input type="checkbox" name="quality-score" id="quality-score"><label for="quality-score">RQS/RIN</label><br>
3449 28 Jul 15 olle 436 -->
3449 28 Jul 15 olle 437               <input type="checkbox" name="quality-score" id="quality-score" checked><label for="quality-score">ΔCt</label><br>
3449 28 Jul 15 olle 438               <input type="checkbox" name="qubitconc" id="qubitconc" checked><label for="qubitconc">QubitConc</label><br>
3449 28 Jul 15 olle 439             </td>
3449 28 Jul 15 olle 440             <td>
3449 28 Jul 15 olle 441               <input type="checkbox" name="volumes" id="volumes" checked><label for="volumes">Used volume+water</label><br>
3449 28 Jul 15 olle 442               <input type="checkbox" name="qiacube-date" id="qiacube-date" checked><label for="qiacube-date">Qiacube/Dilution date</label><br>
3449 28 Jul 15 olle 443             </td>
3449 28 Jul 15 olle 444           </tr>
3449 28 Jul 15 olle 445           </table>
3449 28 Jul 15 olle 446         </td>
3449 28 Jul 15 olle 447         <td class="help">Toggles visiblity of the selected information inside each well on the plate.</td>
3449 28 Jul 15 olle 448       </tr>
3449 28 Jul 15 olle 449       <tr>
3449 28 Jul 15 olle 450         <td class="prompt">Warning levels</td>
3449 28 Jul 15 olle 451 <!--
3449 28 Jul 15 olle 452         <td class="input">
3449 28 Jul 15 olle 453           Remaining quantity&lt;<input type="text" class="text" name="warning_quantity" id="warning_quantity"
3449 28 Jul 15 olle 454             value="<%=isNeoPrep ? "0.5" : "2.2"%>" style="width: 4em;">µg,
3449 28 Jul 15 olle 455           RQS/RIN&lt;<input type="text" class="text" name="warning_quality_score" id="warning_quality_score" 
3449 28 Jul 15 olle 456             value="8" style="width: 4em;">
3449 28 Jul 15 olle 457         </td>
3449 28 Jul 15 olle 458 -->
3449 28 Jul 15 olle 459         <td class="input">
3449 28 Jul 15 olle 460           Remaining quantity&lt;<input type="text" class="text" name="warning_quantity" id="warning_quantity"
3449 28 Jul 15 olle 461             value="<%=isNeoPrep ? "0.5" : "2.2"%>" style="width: 4em;">µg,
3449 28 Jul 15 olle 462           Î”Ct&gt;<input type="text" class="text" name="warning_quality_score" id="warning_quality_score" 
3449 28 Jul 15 olle 463             value="8" style="width: 4em;">
3449 28 Jul 15 olle 464         </td>
3449 28 Jul 15 olle 465         <td class="status" id="warnings.status"></td>
3449 28 Jul 15 olle 466 <!--
3449 28 Jul 15 olle 467         <td class="help">
3449 28 Jul 15 olle 468           <span id="warnings.message" class="message" style="display: none;"></span>
3449 28 Jul 15 olle 469           Warning levels for remaining quantity and RQS/RIN values.
3449 28 Jul 15 olle 470         </td>
3449 28 Jul 15 olle 471 -->
3449 28 Jul 15 olle 472         <td class="help">
3449 28 Jul 15 olle 473           <span id="warnings.message" class="message" style="display: none;"></span>
3449 28 Jul 15 olle 474           Warning levels for remaining quantity and Î”Ct values.
3449 28 Jul 15 olle 475         </td>
3449 28 Jul 15 olle 476       </tr>
3449 28 Jul 15 olle 477       </table>
3449 28 Jul 15 olle 478
3449 28 Jul 15 olle 479       <tbl:toolbar subclass="bottomborder topborder">
3449 28 Jul 15 olle 480         <tbl:button 
3449 28 Jul 15 olle 481           id="btnLoadFromFile"
3449 28 Jul 15 olle 482           title="Load from file&hellip;" 
3449 28 Jul 15 olle 483           image="<%=home+"/images/file.png"%>" 
3449 28 Jul 15 olle 484           tooltip="Load plate design from file"
3449 28 Jul 15 olle 485         />
3449 28 Jul 15 olle 486         
3449 28 Jul 15 olle 487         <tbl:button 
3449 28 Jul 15 olle 488           id="btnAutoSelect"
3449 28 Jul 15 olle 489           title="Auto-select&hellip;" 
3449 28 Jul 15 olle 490           image="<%=home+"/images/wizard.png"%>" 
3449 28 Jul 15 olle 491           tooltip="Let the wizard auto-select DNA"
3449 28 Jul 15 olle 492         />
3449 28 Jul 15 olle 493         <tbl:button 
3449 28 Jul 15 olle 494           id="btnManualSelect"
3449 28 Jul 15 olle 495           title="Manual select&hellip;" 
3449 28 Jul 15 olle 496           image="<%=home+"/images/manual_dna.png"%>" 
3449 28 Jul 15 olle 497           tooltip="Manually select DNA items" 
3449 28 Jul 15 olle 498         />
3449 28 Jul 15 olle 499         <tbl:button 
3449 28 Jul 15 olle 500           id="btnStratagene"
3449 28 Jul 15 olle 501           title="Stratagene" 
3449 28 Jul 15 olle 502           image="<%=home+"/images/stratagene.png"%>" 
3449 28 Jul 15 olle 503           tooltip="Place stratagene in the selected wells" 
3449 28 Jul 15 olle 504         />
3449 28 Jul 15 olle 505         <tbl:button 
3449 28 Jul 15 olle 506           id="btnExternal"
3449 28 Jul 15 olle 507           title="External" 
3449 28 Jul 15 olle 508           image="<%=home+"/images/external.png"%>" 
3449 28 Jul 15 olle 509           tooltip="Mark selected wells as used by external DNA" 
3449 28 Jul 15 olle 510         />
3449 28 Jul 15 olle 511         <tbl:button 
3449 28 Jul 15 olle 512           id="btnToggleQc"
3449 28 Jul 15 olle 513           title="Toggle QC" 
3449 28 Jul 15 olle 514           image="<%=home+"/images/dnaqc.png"%>" 
3449 28 Jul 15 olle 515           tooltip="Select/deselect DNA for QC" 
3449 28 Jul 15 olle 516         />
3449 28 Jul 15 olle 517         <tbl:button 
3449 28 Jul 15 olle 518           id="btnComment"
3449 28 Jul 15 olle 519           title="Comments&hellip;" 
3449 28 Jul 15 olle 520           image="<%=home+"/images/comment.png"%>" 
3449 28 Jul 15 olle 521           tooltip="Add a comment to the selected wells" 
3449 28 Jul 15 olle 522         />
3449 28 Jul 15 olle 523         <tbl:button 
3449 28 Jul 15 olle 524           id="btnCutSelected"
3449 28 Jul 15 olle 525           title="Cut&hellip;" 
3449 28 Jul 15 olle 526           image="<%=home+"/images/cut.png"%>" 
3449 28 Jul 15 olle 527           tooltip="Clear the selected wells" 
3449 28 Jul 15 olle 528         />
3449 28 Jul 15 olle 529         <tbl:button 
3449 28 Jul 15 olle 530           id="btnCopySelected"
3449 28 Jul 15 olle 531           title="Copy" 
3449 28 Jul 15 olle 532           image="<%=home+"/images/copy.png"%>" 
3449 28 Jul 15 olle 533           tooltip="Make a copy of the selected DNA" 
3449 28 Jul 15 olle 534         />
3449 28 Jul 15 olle 535         <tbl:button 
3449 28 Jul 15 olle 536           id="btnPasteToSelected"
3449 28 Jul 15 olle 537           title="Paste" 
3449 28 Jul 15 olle 538           image="<%=home+"/images/paste.png"%>" 
3449 28 Jul 15 olle 539           tooltip="Paste DNA into selected wells" 
3449 28 Jul 15 olle 540         />
3449 28 Jul 15 olle 541         <tbl:button 
3449 28 Jul 15 olle 542           id="btnSwitch"
3449 28 Jul 15 olle 543           title="Switch" 
3449 28 Jul 15 olle 544           image="<%=home+"/images/switch.png"%>" 
3449 28 Jul 15 olle 545           tooltip="Switch the selected wells (if exactly two)" 
3449 28 Jul 15 olle 546         />
3449 28 Jul 15 olle 547       </tbl:toolbar>
3449 28 Jul 15 olle 548         <div id="flaggedDna" style="margin: 0.5em; display: none; text-align: center;" class="link">
3449 28 Jul 15 olle 549           Flagged DNA items.
3449 28 Jul 15 olle 550         </div>
3449 28 Jul 15 olle 551
3449 28 Jul 15 olle 552         <table id="plate" class="plate <%=isNeoPrep ? "neoprep": "" %> hide-volumes hide-qubitconc hide-quality-score hide-qiacube-date" 
3449 28 Jul 15 olle 553           style="margin: 1em auto 0 auto;">
3449 28 Jul 15 olle 554         <%
3449 28 Jul 15 olle 555         int columns = isNeoPrep ? 2 : 12;
3449 28 Jul 15 olle 556         int rows = 8;
3449 28 Jul 15 olle 557         WellCoordinateFormatter rowF = new WellCoordinateFormatter(true);
3449 28 Jul 15 olle 558         WellCoordinateFormatter colF = new WellCoordinateFormatter(false);
3449 28 Jul 15 olle 559         %>
3449 28 Jul 15 olle 560         <tr class="header">
3449 28 Jul 15 olle 561           <%
3449 28 Jul 15 olle 562           if (isNeoPrep) 
3449 28 Jul 15 olle 563           {
3449 28 Jul 15 olle 564             %>
3449 28 Jul 15 olle 565             <td class="barcode-fill barcode-left"></td>
3449 28 Jul 15 olle 566             <%
3449 28 Jul 15 olle 567           }
3449 28 Jul 15 olle 568           %>
3449 28 Jul 15 olle 569           <th>
3449 28 Jul 15 olle 570             <base:icon image="<%=home+"/images/select_all.png"%>" 
3449 28 Jul 15 olle 571               id="iconSpecialSelect"
3449 28 Jul 15 olle 572               tooltip="Select/deselect wells on the plate with specific condition" 
3449 28 Jul 15 olle 573             ></base:icon>
3449 28 Jul 15 olle 574           </th>
3449 28 Jul 15 olle 575           <%
3449 28 Jul 15 olle 576           for (int c = 0; c < columns; ++c)
3449 28 Jul 15 olle 577           {
3449 28 Jul 15 olle 578             %>
3449 28 Jul 15 olle 579             <th class="link auto-init" id="col.<%=c%>"
3449 28 Jul 15 olle 580               data-auto-init="plate-col" data-col="<%=c%>"
3449 28 Jul 15 olle 581               title="Select/deselect all wells in this column"><%=colF.format(c)%></th>
3449 28 Jul 15 olle 582             <%
3449 28 Jul 15 olle 583           }
3449 28 Jul 15 olle 584           if (isNeoPrep) 
3449 28 Jul 15 olle 585           {
3449 28 Jul 15 olle 586             %>
3449 28 Jul 15 olle 587             <th style="border-bottom: 0;"></th>
3449 28 Jul 15 olle 588             <td class="barcode-fill barcode-right"></td>
3449 28 Jul 15 olle 589             <%
3449 28 Jul 15 olle 590           }
3449 28 Jul 15 olle 591           %>
3449 28 Jul 15 olle 592         </tr>
3449 28 Jul 15 olle 593         <tbody>
3449 28 Jul 15 olle 594         <%
3449 28 Jul 15 olle 595         for (int r = 0; r < rows; ++r)
3449 28 Jul 15 olle 596         {
3449 28 Jul 15 olle 597           String row = rowF.format(r);
3449 28 Jul 15 olle 598           %>
3449 28 Jul 15 olle 599           <tr class="row-<%=r%>">
3449 28 Jul 15 olle 600             <%
3449 28 Jul 15 olle 601             if (isNeoPrep)
3449 28 Jul 15 olle 602             {
3449 28 Jul 15 olle 603               row += "<br><span style=\"border-top: 1px solid #A0A0A0;\">"+(r+1)+"</span>";
3449 28 Jul 15 olle 604               %>
3449 28 Jul 15 olle 605               <td class="barcode-well barcode-left" id="barcode.<%=r%>.0" data-col="0" data-row="<%=r%>"></td>
3449 28 Jul 15 olle 606               <%
3449 28 Jul 15 olle 607             }
3449 28 Jul 15 olle 608             %>
3449 28 Jul 15 olle 609             <th class="link auto-init" id="row.<%=r%>"
3449 28 Jul 15 olle 610               data-auto-init="plate-row" data-row="<%=r%>"
3449 28 Jul 15 olle 611               title="Select/deselect all wells in this row"><%=row%></th>
3449 28 Jul 15 olle 612             <%
3449 28 Jul 15 olle 613             for (int c = 0; c < columns; ++c)
3449 28 Jul 15 olle 614             {
3449 28 Jul 15 olle 615               %>
3449 28 Jul 15 olle 616               <td id="well.<%=r%>.<%=c%>" class="well empty primary auto-init"
3449 28 Jul 15 olle 617                 data-auto-init="plate-well" data-col="<%=c%>" data-row="<%=r%>"
3449 28 Jul 15 olle 618                 title="Select/deselect this well">empty</td>
3449 28 Jul 15 olle 619               <%
3449 28 Jul 15 olle 620             }
3449 28 Jul 15 olle 621             if (isNeoPrep)
3449 28 Jul 15 olle 622             {
3449 28 Jul 15 olle 623               %>
3449 28 Jul 15 olle 624               <th><%=rowF.format(r+8)%><br><span style="border-top: 1px solid #A0A0A0;"><%=(r+9)%></span></th>
3449 28 Jul 15 olle 625               <td class="barcode-well barcode-right" id="barcode.<%=r%>.1" data-col="1" data-row="<%=r%>"></td>
3449 28 Jul 15 olle 626               <%
3449 28 Jul 15 olle 627             }
3449 28 Jul 15 olle 628             %>
3449 28 Jul 15 olle 629           </tr>
3449 28 Jul 15 olle 630           <%
3449 28 Jul 15 olle 631         }
3449 28 Jul 15 olle 632         %>
3449 28 Jul 15 olle 633         </tbody>
3449 28 Jul 15 olle 634         <tr id="pool-row">
3449 28 Jul 15 olle 635           <%
3449 28 Jul 15 olle 636           if (isNeoPrep) 
3449 28 Jul 15 olle 637           {
3449 28 Jul 15 olle 638             %>
3449 28 Jul 15 olle 639             <td class="barcode-fill barcode-left"></td>
3449 28 Jul 15 olle 640             <%
3449 28 Jul 15 olle 641           }
3449 28 Jul 15 olle 642           %>
3449 28 Jul 15 olle 643           <th colspan="<%=columns+1%>">&nbsp;</th>
3449 28 Jul 15 olle 644           <%
3449 28 Jul 15 olle 645           if (isNeoPrep) 
3449 28 Jul 15 olle 646           {
3449 28 Jul 15 olle 647             %>
3449 28 Jul 15 olle 648             <td class="barcode-fill barcode-right"></td>
3449 28 Jul 15 olle 649             <%
3449 28 Jul 15 olle 650           }
3449 28 Jul 15 olle 651           %>
3449 28 Jul 15 olle 652         </tr>
3449 28 Jul 15 olle 653         </table>
3449 28 Jul 15 olle 654         <div style="margin: 0.5em; text-align: center;">
3449 28 Jul 15 olle 655           <base:icon image="<%=home+"/images/mrnaqc.png"%>" />=Selected for QC
3449 28 Jul 15 olle 656           <base:icon image="<%=home+"/images/copy.png"%>" style="padding-left: 1em;" />=Replicated DNA
3449 28 Jul 15 olle 657           <base:icon image="<%=home+"/images/error.png"%>" style="padding-left: 1em;" />=Error that prevent plate creation
3449 28 Jul 15 olle 658           <base:icon image="<%=home+"/images/warning.png"%>" style="padding-left: 1em;" />=Warning but plate can be created
3449 28 Jul 15 olle 659         </div>
3449 28 Jul 15 olle 660     </div>
3449 28 Jul 15 olle 661   </div>
3449 28 Jul 15 olle 662
3449 28 Jul 15 olle 663
3449 28 Jul 15 olle 664   <div id="wizard-status"></div>
3449 28 Jul 15 olle 665   
3449 28 Jul 15 olle 666   <table class="navigation" id="navigation">
3449 28 Jul 15 olle 667   <tr>
3449 28 Jul 15 olle 668     <td><base:button id="gocancel" title="Cancel" /></td>
3449 28 Jul 15 olle 669     <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" /></td>
3449 28 Jul 15 olle 670     <td><base:button id="goregister" title="Register" image="<%=home+"/images/import.png"%>"  /></td>
3449 28 Jul 15 olle 671     <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" /></td>
3449 28 Jul 15 olle 672     <td id="gonext-message" class="message"></td>
3449 28 Jul 15 olle 673   </tr>
3449 28 Jul 15 olle 674   </table>
3449 28 Jul 15 olle 675
3449 28 Jul 15 olle 676   </form>
3449 28 Jul 15 olle 677   </div>
3449 28 Jul 15 olle 678   </div>
3449 28 Jul 15 olle 679 </base:body>
3449 28 Jul 15 olle 680 </base:page>
3449 28 Jul 15 olle 681 <%
3449 28 Jul 15 olle 682 }
3449 28 Jul 15 olle 683 finally
3449 28 Jul 15 olle 684 {
3449 28 Jul 15 olle 685   if (dc != null) dc.close();
3449 28 Jul 15 olle 686 }
3449 28 Jul 15 olle 687 %>

Generated on Tue Nov 21 03:26:03 2023 (UTC) by svndigest 0.11.2pre (dev build 1672)