Changeset 5540

Timestamp:

Jan 13, 2011, 11:55:14 AM (11 years ago)

Author:

Nicklas Nordborg

Message:

References #1559: Place biomaterial on plates

Same interface changes as made for #1564 in [5539].

File:

• trunk/www/biomaterials/wizards/place_on_plate.jsp (modified) (8 diffs)

trunk/www/biomaterials/wizards/place_on_plate.jsp

@@ -293 +293 @@
     function clearMapping()
     {
+      if (!plate)
+      {
+        alert('No destination plate has been selected');
+        return;
+      }
       if (!confirm('This will remove all placed biomaterial. Continue?')) return;
       itemList.unmapAll();
@@ -303 +308 @@
     function placeByRow()
     {
+      if (!plate)
+      {
+        alert('No destination plate has been selected');
+        return;
+      }
       var index = 0;
       var numItems = itemList.items.length;
@@ -334 +344 @@
     function placeByColumn()
     {
+      if (!plate)
+      {
+        alert('No destination plate has been selected');
+        return;
+      }
       var index = 0;
       var numItems = itemList.items.length;
@@ -409 +424 @@
       
       // Create html table representing the bioplate
-      var html = '<table class="'+plateClass+'" style="border-top: 0px;" cellspacing="0" cellpadding="0" onmouseout="event.cancelBubble=true">';
+      var html = '<table class="'+plateClass+'" cellspacing="0" cellpadding="0" onmouseout="event.cancelBubble=true">';
       html += '<tr><td></td>';
       for (var c = 0; c < plate.columns; c++)
@@ -555 +570 @@
     <div id="canvas"></div>
     <h3>Place biomaterial on plate</h3>
-    <div class="boxedbottom" style="height: <%=(int)(scale*480)%>px; overflow: auto:">
+    <div class="boxedbottom" style="height: <%=(int)(scale*500)%>px; padding: 0px;">
       <form name="main" action="index.jsp" method="post">
       <input type="hidden" name="ID" value="<%=ID%>">
@@ -577 +592 @@
     {
       %>
-      
-      <table cellspacing="0" border="0" width="100%">
+      <table cellspacing="0" border="0" width="100%" style="background: #e0e0e0; padding-bottom: 6px;">
       <tr valign="top">
         <td style="width: 50%;">
@@ -649 +663 @@
       </table>
       
-      <table cellspacing="0" border="0">
-      <tr>
-        <td><b>Items to place</b></td>
-        <td><b>Destination plate</b> (<span id="plate.name">no plate selected</span>) <a href="javascript:selectBioPlateOnClick()">Select plate...</a></td>
-      </tr>
+      <tbl:toolbar id="toolbar.mappings" style="border-left: 0px; border-right: 0px;">
+        <tbl:button title="Select plate&hellip;" 
+          onclick="javascript:selectBioPlateOnClick()" 
+          image="place_on_plate.png" 
+          tooltip="Select the destination plate"
+        />
+        <tbl:button title="Clear" 
+          onclick="clearMapping()" 
+          image="cancel.gif" 
+          tooltip="Clear all mapped wells"
+        />
+        <tbl:button title="Place by row" 
+          onclick="placeByRow()" 
+          image="place_by_row.png" 
+          tooltip="Place remaining items; start with rows"
+        />
+        <tbl:button title="Place by column" 
+          onclick="placeByColumn()" 
+          image="place_by_column.png" 
+          tooltip="Place remaining items; start with columns"
+        />
+      </tbl:toolbar>
+      
+      <table cellspacing="0" cellpadding="0" border="0" width="100%" style="padding: 4px;">
       <tr valign="top">
         <td style="width: 280px;">
-        <div id="itemlist" class="biomateriallist" style="height: <%=(int)(scale*300)%>px; width:270px;" onscroll="onItemListScroll()">
+          <b>Items to place</b>
+          <div id="itemlist" class="biomateriallist" style="height: <%=(int)(scale*320)%>px; width:270px;" onscroll="onItemListScroll()">
           <table border="0" cellspacing="0" cellpadding="0" width="100%">
           <%
@@ -674 +708 @@
           %>
           </table>
-        </div>
-        <input type="checkbox" name="autoSelectUnmappedItem" 
-          <%=autoSelectUnmappedItem ? "checked" : ""%> value="1">Auto-select next unmapped item
+          </div>
+          <input type="checkbox" name="autoSelectUnmappedItem" 
+            <%=autoSelectUnmappedItem ? "checked" : ""%> value="1">Auto-select next unmapped item
         </td>
         <td>
-          <tbl:toolbar id="toolbar.mappings" style="display: none;">
-            <tbl:button title="Clear" 
-              onclick="clearMapping()" 
-              image="cancel.gif" 
-              tooltip="Clear all mapped wells"
-            />
-            <tbl:button title="Place by row" 
-              onclick="placeByRow()" 
-              image="place_by_row.png" 
-              tooltip="Place remaining items; start with rows"
-            />
-            <tbl:button title="Place by column" 
-              onclick="placeByColumn()" 
-              image="place_by_column.png" 
-              tooltip="Place remaining items; start with columns"
-            />
-          </tbl:toolbar>
-          <div id="plate"></div>
+          <div style="max-height: <%=(int)(scale*350)%>px; overflow: auto;">
+            <b>Destination plate:</b> <span id="plate.name"><i>no plate selected</i></span>
+            <div id="plate"></div>
           </div>
         </td>