extensions/net.sf.basedb.meludi/trunk/resources/libprep/assign_barcode.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.User"
3449 28 Jul 15 olle 5   import="net.sf.basedb.core.DbControl"
3449 28 Jul 15 olle 6   import="net.sf.basedb.core.SessionControl"
3449 28 Jul 15 olle 7   import="net.sf.basedb.core.Application"
3449 28 Jul 15 olle 8   import="net.sf.basedb.util.formatter.WellCoordinateFormatter"
3449 28 Jul 15 olle 9   import="net.sf.basedb.clients.web.Base"  
3449 28 Jul 15 olle 10   import="net.sf.basedb.clients.web.util.HTML"  
3449 28 Jul 15 olle 11   import="net.sf.basedb.clients.web.extensions.ExtensionsControl"
3449 28 Jul 15 olle 12 %>
3449 28 Jul 15 olle 13 <%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
3449 28 Jul 15 olle 14 <%@ taglib prefix="p" uri="/WEB-INF/path.tld" %>
3449 28 Jul 15 olle 15 <%
3449 28 Jul 15 olle 16 final SessionControl sc = Base.getExistingSessionControl(request, true);
3449 28 Jul 15 olle 17 final String ID = sc.getId();
3449 28 Jul 15 olle 18 final float scale = Base.getScale(sc);
3449 28 Jul 15 olle 19 final String home = ExtensionsControl.getHomeUrl("net.sf.basedb.meludi");
3449 28 Jul 15 olle 20 DbControl dc = null;
3449 28 Jul 15 olle 21 try
3449 28 Jul 15 olle 22 {
3449 28 Jul 15 olle 23   dc = sc.newDbControl();
3449 28 Jul 15 olle 24   final User user = User.getById(dc, sc.getLoggedInUserId());
3449 28 Jul 15 olle 25 %>
3449 28 Jul 15 olle 26 <base:page type="default" >
3449 28 Jul 15 olle 27 <base:head 
3449 28 Jul 15 olle 28   scripts="~../meludi-2.js,~assign_barcode.js,~pools.js,~plate.js" 
3449 28 Jul 15 olle 29   styles="path.css,~../css/meludi-2.css,~../css/plate.css">
3449 28 Jul 15 olle 30 <style>
3449 28 Jul 15 olle 31 #select-barcode-all
3449 28 Jul 15 olle 32 {
3449 28 Jul 15 olle 33   max-height: 20em;
3449 28 Jul 15 olle 34   overflow: auto;
3449 28 Jul 15 olle 35 }
3449 28 Jul 15 olle 36
3449 28 Jul 15 olle 37 #select-barcode .menuitem
3449 28 Jul 15 olle 38 {
3449 28 Jul 15 olle 39   padding-left: 16px;
3449 28 Jul 15 olle 40 }
3449 28 Jul 15 olle 41
3449 28 Jul 15 olle 42 #select-barcode div.current
3449 28 Jul 15 olle 43 {
3449 28 Jul 15 olle 44   font-weight: bold;
3449 28 Jul 15 olle 45   background-image: url('../images/selected.gif');
3449 28 Jul 15 olle 46   background-position: 2px 50%;
3449 28 Jul 15 olle 47   background-repeat: no-repeat;
3449 28 Jul 15 olle 48 }
3449 28 Jul 15 olle 49
3449 28 Jul 15 olle 50 #select-barcode .menuitem:hover
3449 28 Jul 15 olle 51 {
3449 28 Jul 15 olle 52   padding-left: 14px;
3449 28 Jul 15 olle 53   background-position: 0px 50%;
3449 28 Jul 15 olle 54 }
3449 28 Jul 15 olle 55
3449 28 Jul 15 olle 56 .menuseparator
3449 28 Jul 15 olle 57 {
3449 28 Jul 15 olle 58   width: auto !important;
3449 28 Jul 15 olle 59 }
3449 28 Jul 15 olle 60
3449 28 Jul 15 olle 61 .well.primary.empty
3449 28 Jul 15 olle 62 {
3449 28 Jul 15 olle 63   background-color: #F0F0F0;
3449 28 Jul 15 olle 64 }
3449 28 Jul 15 olle 65 </style>
3449 28 Jul 15 olle 66 </base:head>
3449 28 Jul 15 olle 67 <base:body>
3449 28 Jul 15 olle 68
3449 28 Jul 15 olle 69   <p:path><p:pathelement 
3449 28 Jul 15 olle 70     title="MeLuDi" href="<%="../index.jsp?ID="+ID%>" 
3449 28 Jul 15 olle 71     /><p:pathelement title="Assign barcodes to start DNA plates" 
3449 28 Jul 15 olle 72     /></p:path>
3449 28 Jul 15 olle 73
3449 28 Jul 15 olle 74   <div class="content">
3449 28 Jul 15 olle 75
3449 28 Jul 15 olle 76   <form name="meludi" id="wizard" class="wizard">
3449 28 Jul 15 olle 77
3449 28 Jul 15 olle 78   <div id="select-barcode" class="menu vertical bg-filled-100" style="width: 15em; z-index: 2; display: none;">
3449 28 Jul 15 olle 79     <div class="menuitem interactable enabled" id="select-barcode-default">Default</div>
3449 28 Jul 15 olle 80     <div class="menuseparator" id="select-barcode-default-separator"></div>
3449 28 Jul 15 olle 81     <div id="select-barcode-all"></div>
3449 28 Jul 15 olle 82   </div>
3449 28 Jul 15 olle 83   
3449 28 Jul 15 olle 84   <div class="step auto-hide" id="step-1">
3449 28 Jul 15 olle 85     <div class="step-no">1</div>
3449 28 Jul 15 olle 86     <div class="step-title">Select DNA bioplate</div>
3449 28 Jul 15 olle 87     <div class="step-content">
3449 28 Jul 15 olle 88
3449 28 Jul 15 olle 89       <table class="step-form">
3449 28 Jul 15 olle 90       <tr>
3449 28 Jul 15 olle 91         <td class="prompt">DNA bioplate</td>
3449 28 Jul 15 olle 92         <td class="input">
3449 28 Jul 15 olle 93           <select class="required" name="bioplate" id="bioplate"></select>          
3449 28 Jul 15 olle 94         </td>
3449 28 Jul 15 olle 95         <td class="status" id="bioplate.status"></td>
3449 28 Jul 15 olle 96         <td class="help">
3449 28 Jul 15 olle 97           <span id="bioplate.message" class="message"></span>
3449 28 Jul 15 olle 98           Select an existing DNA bioplate. The list contain all DNA bioplates that
3449 28 Jul 15 olle 99           has not yet been assigned barcodes (determined by the absence of 'BarcodeVariant' 
3449 28 Jul 15 olle 100           annotation).
3449 28 Jul 15 olle 101         </td>
3449 28 Jul 15 olle 102       </tr>
3449 28 Jul 15 olle 103       <tbody class="info-section">
3449 28 Jul 15 olle 104       <tr>
3449 28 Jul 15 olle 105         <td class="prompt">Comments</td>
3449 28 Jul 15 olle 106         <td class="info" id="dnaComments" colspan="2"></td>
3449 28 Jul 15 olle 107         <td class="help"></td>
3449 28 Jul 15 olle 108       </tr>
3449 28 Jul 15 olle 109       </tbody>
3449 28 Jul 15 olle 110       </table>
3449 28 Jul 15 olle 111     </div>
3449 28 Jul 15 olle 112   </div>
3449 28 Jul 15 olle 113   
3449 28 Jul 15 olle 114   <div class="step" id="step-2">
3449 28 Jul 15 olle 115     <div class="step-no">2</div>
3449 28 Jul 15 olle 116     <div class="step-title">Select barcodes</div>
3449 28 Jul 15 olle 117     <div class="step-content">
3449 28 Jul 15 olle 118     
3449 28 Jul 15 olle 119       <table class="step-form bottomborder">
3449 28 Jul 15 olle 120       <tr>
3449 28 Jul 15 olle 121         <td class="prompt">Pool layout</td>
3449 28 Jul 15 olle 122         <td class="input">
3449 28 Jul 15 olle 123           <select name="pool_schema" id="pool_schema" class="required"></select>
3449 28 Jul 15 olle 124         </td>
3449 28 Jul 15 olle 125         <td class="help"></td>
3449 28 Jul 15 olle 126       </tr>
3449 28 Jul 15 olle 127       <tr>
3449 28 Jul 15 olle 128         <td class="prompt">Barcode variants</td>
3449 28 Jul 15 olle 129         <td class="input">
3449 28 Jul 15 olle 130           <select name="barcode_variant" id="barcode_variant" class="required"></select>
3449 28 Jul 15 olle 131         </td>
3449 28 Jul 15 olle 132         <td class="help"></td>
3449 28 Jul 15 olle 133       </tr>
3449 28 Jul 15 olle 134       <tr class="align-top">
3449 28 Jul 15 olle 135         <td class="prompt">Comments</td>
3449 28 Jul 15 olle 136         <td class="input">
3449 28 Jul 15 olle 137           <textarea rows="2" name="comments" id="comments"></textarea>
3449 28 Jul 15 olle 138         </td>
3449 28 Jul 15 olle 139         <td class="help">Comments for the library preparation.</td>
3449 28 Jul 15 olle 140       </tr>
3449 28 Jul 15 olle 141       </table>
3449 28 Jul 15 olle 142       
3449 28 Jul 15 olle 143       <table class="plate" style="margin: 1em auto 1em auto;" id="plate">
3449 28 Jul 15 olle 144       <%
3449 28 Jul 15 olle 145       int columns = 12;
3449 28 Jul 15 olle 146       int rows = 8;
3449 28 Jul 15 olle 147       WellCoordinateFormatter rowF = new WellCoordinateFormatter(true);
3449 28 Jul 15 olle 148       WellCoordinateFormatter colF = new WellCoordinateFormatter(false);
3449 28 Jul 15 olle 149       %>
3449 28 Jul 15 olle 150       <tr class="header">
3449 28 Jul 15 olle 151         <th></th>
3449 28 Jul 15 olle 152         <%
3449 28 Jul 15 olle 153         for (int c = 0; c < columns; ++c)
3449 28 Jul 15 olle 154         {
3449 28 Jul 15 olle 155           %>
3449 28 Jul 15 olle 156           <th id="col.<%=c%>"><%=colF.format(c)%></th>
3449 28 Jul 15 olle 157           <%
3449 28 Jul 15 olle 158         }
3449 28 Jul 15 olle 159         %>
3449 28 Jul 15 olle 160       </tr>
3449 28 Jul 15 olle 161       <tbody>
3449 28 Jul 15 olle 162       <%
3449 28 Jul 15 olle 163       for (int r = 0; r < rows; ++r)
3449 28 Jul 15 olle 164       {
3449 28 Jul 15 olle 165         String row = rowF.format(r);
3449 28 Jul 15 olle 166         %>
3449 28 Jul 15 olle 167         <tr class="row-<%=r%>">
3449 28 Jul 15 olle 168           <th id="row.<%=r%>" class="rowheader"><%=row%></th>
3449 28 Jul 15 olle 169           <%
3449 28 Jul 15 olle 170           for (int c = 0; c < columns; ++c)
3449 28 Jul 15 olle 171           {
3449 28 Jul 15 olle 172             %>
3449 28 Jul 15 olle 173             <td class="well col-<%=c%>" id="well.<%=r%>.<%=c%>"
3449 28 Jul 15 olle 174               data-row="<%=r%>" data-col="<%=c%>"
3449 28 Jul 15 olle 175               title="Click to select barcode for this well"
3449 28 Jul 15 olle 176               ></td>
3449 28 Jul 15 olle 177             <%
3449 28 Jul 15 olle 178           }
3449 28 Jul 15 olle 179           %>
3449 28 Jul 15 olle 180         </tr>
3449 28 Jul 15 olle 181         <%
3449 28 Jul 15 olle 182       }
3449 28 Jul 15 olle 183       %>
3449 28 Jul 15 olle 184       </tbody>
3449 28 Jul 15 olle 185       <tr id="pool-row">
3449 28 Jul 15 olle 186         <th colspan="13">&nbsp;</th>
3449 28 Jul 15 olle 187       </tr>
3449 28 Jul 15 olle 188       </table>
3449 28 Jul 15 olle 189     </div>
3449 28 Jul 15 olle 190   </div>
3449 28 Jul 15 olle 191   
3449 28 Jul 15 olle 192   <div id="wizard-status"></div>
3449 28 Jul 15 olle 193   
3449 28 Jul 15 olle 194   <table class="navigation" id="navigation">
3449 28 Jul 15 olle 195   <tr>
3449 28 Jul 15 olle 196     <td><base:button id="gocancel" title="Cancel" /></td>
3449 28 Jul 15 olle 197     <td><base:button id="gonext" title="Next" image="<%=home+"/images/gonext.png"%>" /></td>
3449 28 Jul 15 olle 198     <td><base:button id="goregister" title="Register" image="<%=home+"/images/import.png"%>"  /></td>
3449 28 Jul 15 olle 199     <td><base:button id="gorestart" title="Restart" image="<%=home+"/images/goback.png"%>" /></td>
3449 28 Jul 15 olle 200     <td id="gonext-message" class="message"></td>
3449 28 Jul 15 olle 201   </tr>
3449 28 Jul 15 olle 202   </table>
3449 28 Jul 15 olle 203   
3449 28 Jul 15 olle 204   </form>
3449 28 Jul 15 olle 205   </div>
3449 28 Jul 15 olle 206   
3449 28 Jul 15 olle 207 </base:body>
3449 28 Jul 15 olle 208 </base:page>
3449 28 Jul 15 olle 209 <%
3449 28 Jul 15 olle 210 }
3449 28 Jul 15 olle 211 finally
3449 28 Jul 15 olle 212 {
3449 28 Jul 15 olle 213   if (dc != null) dc.close();
3449 28 Jul 15 olle 214 }
3449 28 Jul 15 olle 215 %>

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