Changeset 6312

Timestamp:

Aug 28, 2013, 1:48:06 PM (9 years ago)

Author:

Nicklas Nordborg

Message:

References #1729 and #1730. Edit dialogs for the Biomaterial and Array LIMS.

Location:

trunk/www

Files:

• biomaterials/extracts/edit_extract.jsp (modified) (18 diffs)
• biomaterials/extracts/extracts.js (modified) (2 diffs)
• biomaterials/extracts/index.jsp (modified) (2 diffs)
• biomaterials/samples/edit_sample.jsp (modified) (12 diffs)
• biomaterials/samples/index.jsp (modified) (2 diffs)
• biomaterials/samples/samples.js (modified) (8 diffs)
• lims/arraybatches/batches.js (modified) (2 diffs)
• lims/arraybatches/edit_batch.jsp (modified) (9 diffs)
• lims/arraydesigns/designs.js (modified) (2 diffs)
• lims/arraydesigns/edit_design.jsp (modified) (11 diffs)
• lims/arraydesigns/index.jsp (modified) (2 diffs)
• lims/arraydesigns/manage_plates.jsp (modified) (7 diffs)
• lims/arrayslides/create_wizard.jsp (modified) (12 diffs)
• lims/arrayslides/edit_slide.jsp (modified) (8 diffs)
• lims/arrayslides/paste_multiple.jsp (modified) (3 diffs)
• lims/arrayslides/slides.js (modified) (2 diffs)
• lims/arrayslides/wizard.js (added)
• lims/platemappings/edit_mapping.jsp (modified) (7 diffs)
• lims/platemappings/mappings.js (modified) (2 diffs)
• lims/plates/edit_plate.jsp (modified) (9 diffs)
• lims/plates/events/edit_event.jsp (modified) (8 diffs)
• lims/plates/events/events.js (modified) (2 diffs)
• lims/plates/index.jsp (modified) (1 diff)
• lims/plates/merge_plates.js (added)
• lims/plates/merge_plates.jsp (modified) (5 diffs)
• lims/plates/merge_plates_2.jsp (modified) (5 diffs)
• lims/plates/plates.js (modified) (2 diffs)
• lims/plates/wells/edit_well.jsp (modified) (7 diffs)
• lims/plates/wells/wells.js (modified) (2 diffs)
• lims/platetypes/eventtypes/eventtypes.js (modified) (2 diffs)

trunk/www/biomaterials/extracts/edit_extract.jsp

@@ -64 +64 @@
   import="net.sf.basedb.clients.web.extensions.edit.EditUtil"
   import="net.sf.basedb.util.extensions.ExtensionsInvoker"
+  import="net.sf.basedb.util.json.JsonUtil"
+  import="net.sf.basedb.util.json.JsonConverter"
+  import="net.sf.basedb.util.json.NameableConverter"
+  import="org.json.simple.JSONObject"
+  import="org.json.simple.JSONArray"
   import="java.util.List"
   import="java.util.Set"
@@ -276 +281 @@
   subtypesQuery.include(Include.ALL);
 
-  
+  JSONObject jsonBioWell = null;
+  if (currentBioWell != null)
+  {
+    jsonBioWell = new JSONObject();
+    jsonBioWell.put("id", currentBioWell.getId());
+    jsonBioWell.put("location", currentBioWell.getCoordinate());
+  }
+
+  JSONObject jsonExtracts = new JSONObject();
+  jsonExtracts.put("itemType", "EXTRACTS");
+  if (extractsQuery != null)
+  {
+    final BioMaterialEvent event = creationEvent;
+    jsonExtracts.put("items", JsonUtil.toArray(extractsQuery.iterate(dc), new NameableConverter<Extract>()
+    {
+      protected void setMore(JSONObject json, Extract e)
+      {
+        Float usedQuantity = event == null ? null : event.getUsedQuantity(e);
+        json.put("name", e.getName() + (usedQuantity == null ? " [-]" : " [" +  usedQuantity + " µg]"));
+        json.put("value", usedQuantity);
+      }
+    }));
+  }
   
   Formatter<Date> dateFormatter = FormatterFactory.getDateFormatter(sc);
@@ -285 +312 @@
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js,linkitems.js,subtypes.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,linkitems-2.js,subtypes.js,~extracts.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "Extract" tab
-    function validateExtract()
-    {
-      var frm = document.forms['extract'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (Main.trimString(frm.bioplate_id.value) != 0 && Main.trimString(frm.biowell_id.value) == 0)
-      {
-        Forms.showNotification('biowell_id.select', 'You must choose a biowell from the bioplate');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['extract'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        frm.modifiedExtracts.value = Link.exportModified(frm, 'E', true).join(',');
-        frm.removedExtracts.value = Link.getActionIds(-1, 'E').join(',');
-        frm.submit();
-      }
-    }
-  
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame(getProtocolId(), ItemSubtype.getSubtypeId('subtype_id'));
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame(getParents());
-    }
-    
-    function getProtocolId()
-    {
-      var frm = document.forms['extract'];
-      var protocolId = 0;
-      if (frm.protocol_id.length > 0 && !frm.protocol_id.disabled) 
-      {
-        protocolId = Math.abs(parseInt(frm.protocol_id[frm.protocol_id.selectedIndex].value));        
-      }
-      return protocolId;
-    }
-
-    function getParents()
-    {
-      var frm = document.forms['extract'];
-      var parents = new Array();
-      if (frm.parentType[0].checked)
-      {
-        var sampleId = Math.abs(parseInt(frm.sample_id[frm.sample_id.selectedIndex].value));
-        if (sampleId > 0) parents[parents.length] = 'SAMPLE:'+sampleId;
-      }
-      else
-      {
-        var ids = Link.getListIds(frm.extracts, 'E');
-        if (ids.length > 0)
-        {
-          parents[parents.length] = 'EXTRACT:'+ids.join(':');
-        }
-      }
-      return parents;
-    }
-    
-    function subtypeOnChange()
-    {
-      var frm = document.forms['extract'];
-      var subtypeId = ItemSubtype.getSubtypeId('subtype_id');
-      var recentInfo = ItemSubtype.getRelatedProjectDefaultAndRecentItems('EXTRACT', subtypeId, ['PROTOCOL', 'BIOPLATE', 'TAG', 'SAMPLE', 'EXTRACT']);
-      ItemSubtype.updateSelectionList(frm.protocol_id, recentInfo.PROTOCOL['recent'], recentInfo.PROTOCOL['default']);
-      ItemSubtype.updateSelectionList(frm.tag_id, recentInfo.TAG['recent']);
-      ItemSubtype.updateSelectionList(frm.bioplate_id, recentInfo.BIOPLATE['recent']);
-    }
-    
-    function selectProtocolOnClick()
-    {
-      var frm = document.forms['extract'];
-      var url = '../../admin/protocols/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone';
-      url += '&callback=setProtocolCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'PROTOCOL', <%=SystemItems.getId(Protocol.EXTRACTION)%>);
-      if (frm.protocol_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.protocol_id[1].value));        
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectProtocol', 1050, 700);
-    }
-    function setProtocolCallback(id, name)
-    {
-      var frm = document.forms['extract'];
-      var list = frm.protocol_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    function selectTagOnClick()
-    {
-      var frm = document.forms['extract'];
-      var url = '../tags/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone';
-      url += '&callback=setTagCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'TAG');
-      if (frm.tag_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.tag_id[1].value));       
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectTag', 1050, 700);
-    }
-    function setTagCallback(id, name)
-    {
-      var frm = document.forms['extract'];
-      var list = frm.tag_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    function selectBioPlateOnClick()
-    {
-      var frm = document.forms['extract'];
-      var url = '../bioplates/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setBioPlateCallback';
-      if (frm.bioplate_id.length > 1)
-      {
-        var id = Math.abs(parseInt(frm.bioplate_id[1].value));        
-        url += '&item_id='+id;
-      }
-      url += '&resetTemporary=1&tmpfilter:INT:bioPlateType.lockMode=<><%=BioWell.LockMode.LOCKED_AFTER_CREATE.getValue()%>';
-      // Restrict to plates that can holds extracts
-      url += '&tmpfilter:INT:bioPlateType.bioMaterialType=|<%=itemType.getValue()%>';
-      var subtypeId = ItemSubtype.getSubtypeId('subtype_id');
-      // Restrict to plates with the given subtype
-      url += '&tmpfilter:INT:bioPlateType.itemSubtype='+(subtypeId ? '|' + subtypeId : '=');
-      url += '&tmpfilter:BOOLEAN:destroyed=false';
-      Main.openPopup(url, 'SelectBioplate', 1050, 700);
-    } 
-    function setBioPlateCallback(id, name)
-    {
-      var frm = document.forms['extract'];
-      var list = frm.bioplate_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-      frm.biowell_id.remove(1);
-      frm.biowell_id.disabled = false;
-    }
-    function bioPlateOnChange()
-    {
-      var frm = document.forms['extract'];
-      var list = frm.bioplate_id;
-      frm.biowell_id.selectedIndex=0;
-      frm.biowell_id.remove(1);     
-    }
-
-    function initBioWell()
-    {
-      var frm = document.forms['extract'];
-      <%
-      if (currentBioWell != null)
-      {
-        %>
-        var list = frm.biowell_id;
-        var wellId = <%=currentBioWell.getId()%>;
-        Forms.addListOption(list, 1, new Option());
-        list[1].value = '<%=currentBioWell.getId()*(extract == null ? 1 : -1)%>';
-        list[1].text = '<%=rowFormatter.format(currentBioWell.getRow())%><%=columnFormatter.format(currentBioWell.getColumn())%>';
-        list.selectedIndex = 1;
-      <%
-      }
-      %>
-    }         
-    function selectBioWellOnClick()
-    {
-      var frm = document.forms['extract'];
-      var bioplate_list = frm.bioplate_id;      
-      var bioplateId = Math.abs(parseInt(bioplate_list[bioplate_list.selectedIndex].value))
-      if (Main.trimString(frm.bioplate_id.value) == 0)
-      {
-        Forms.showNotification('bioplate_id.select', 'You must first select a bioplate', null, 'pointer-below');
-        return;
-      }     
-        
-      var url = '../bioplates/wells/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setBioWellCallback';
-      if (frm.biowell_id.length > 1)
-      {
-        var id = Math.abs(parseInt(frm.biowell_id[1].value));       
-        url += '&item_id='+id;
-      }
-      url += '&bioplate_id='+bioplateId;
-      url += '&resetTemporary=1&tmpfilter:STRING:$mbm.name='+escape('=');
-      url += '&tmpfilter:STRING:originalBioMaterial.name='+escape('=');
-      url += '&columns=row,column';
-      Main.openPopup(url, 'SelectBiowell', 750, 500);
-    }
-    function setBioWellCallback(id, name)
-    {
-      var frm = document.forms['extract'];
-      var list = frm.biowell_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    
-    function parentTypeOnClick()
-    {
-      var frm = document.forms['extract'];
-      var useExtracts = frm.parentType[1].checked;
-      frm.sample_id.disabled = useExtracts;
-      frm.used_from_sample.disabled = useExtracts;
-      frm.extracts.disabled = !useExtracts;
-      frm.used_quantity.disabled = !useExtracts;
-    }
-    
-    function selectSampleOnClick()
-    {
-      var frm = document.forms['extract'];
-      var url = '../samples/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone';
-      url += '&callback=setSampleCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'SAMPLE');
-      if (frm.sample_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.sample_id[1].value));        
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectSample', 1050, 700);
-    }
-    function setSampleCallback(id, name)
-    {
-      var frm = document.forms['extract'];
-      var list = frm.sample_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-      frm.parentType[0].checked = true;
-      frm.parentType[1].checked = false;
-      parentTypeOnClick();
-    }
-    
-    function addExtractsOnClick()
-    {
-      var frm = document.forms['extract'];
-      var url = 'index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectmultiple';
-      url += '&callback=addExtractCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'EXTRACT');
-      Main.openPopup(url, 'AddExtracts', 1050, 700);
-    }
-    
-    function addExtractCallback(extractId, name)
-    {
-      var frm = document.forms['extract'];
-      var item = Link.getItem('E', extractId);
-      if (!item) item = new Item('E', extractId, name+' [-]', '', '');
-      Link.addItem(frm.extracts, item);
-      frm.parentType[0].checked = false;
-      frm.parentType[1].checked = true;
-      parentTypeOnClick();
-    }
-    function extractsOnChange()
-    {
-      var frm = document.forms['extract'];
-      var item = frm.extracts[frm.extracts.selectedIndex].item;
-      if (item && item.id)
-      {
-        frm.used_quantity.value = item.value;
-        frm.used_quantity.focus();
-      }
-      else
-      {
-        frm.used_quantity.value = '';
-      }
-    }
-    function usedQuantityOnBlur()
-    {
-      var frm = document.forms['extract'];
-      var usedQuantity = frm.used_quantity.value;
-      var displayQuantity = usedQuantity == '' ? '-' : usedQuantity+' µg';
-      for (var i = 0; i < frm.extracts.length; i++) // >
-      {
-        var option = frm.extracts[i];
-        if (option.selected && option.item.id)
-        {
-          option.item.value = usedQuantity;
-          var text = option.text.replace(/\[.*\]/, '['+displayQuantity+']');
-          option.text = text; 
-        }
-      }
-    }
-    function usedFromSampleOnBlur()
-    {
-      var frm = document.forms['extract'];
-      
-      var sampleId = parseInt(frm.sample_id[frm.sample_id.selectedIndex].value);
-      if (sampleId < 0)
-      {
-        frm.sample_id[frm.sample_id.selectedIndex].value = -sampleId;
-      }
-    }
-    
-
-    function removeOnClick()
-    {
-      Link.removeSelected(document.forms['extract'].extracts);
-    }
-
-    function init()
-    {
-      <%
-      if (extract == null)
-      {
-        %>
-        var frm = document.forms['extract'];
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-      initBioWell();      
-      initExtracts();
-      parentTypeOnClick();
-    }
-    function initExtracts()
-    {
-      var extracts = document.forms['extract'].extracts;
-      <%
-      if (extractsQuery != null)
-      {
-        extractsQuery.include(Include.ALL);
-        extractsQuery.order(Orders.asc(Hql.property("name")));
-        ItemResultList<Extract> extracts = extractsQuery.list(dc);
-        for (Extract e : extracts)
-        {
-          if (extract != null)
-          {
-            String usedQuantity = Values.formatNumber(creationEvent.getUsedQuantity(e), -1);
-            %>
-            Link.addNewItem(extracts, new Item('E', <%=e.getId()%>, '<%=HTML.javaScriptEncode(e.getName())%> [<%=usedQuantity%> µg]', '<%=usedQuantity%>'));
-            <%
-          }
-          else
-          {
-            %>
-            Link.addItem(extracts, new Item('E', <%=e.getId()%>, '<%=HTML.javaScriptEncode(e.getName())%> [-]', '', ''));
-            <%
-            
-          }
-        }
-      }
-      %>
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="extract">
     <input type="hidden" name="cmd" value="UpdateItem">
 
+    <div id="page-data" class="datacontainer"
+      data-extraction-protocoltype-id="<%=SystemItems.getId(Protocol.EXTRACTION)%>"
+      data-sample-type="<%=Item.EXTRACT.getValue()%>"
+      <%
+      if (jsonBioWell != null)
+      {
+        %>
+        data-biowell="<%=HTML.encodeTags(jsonBioWell.toJSONString()) %>"
+        <%
+      }
+      %>
+    ></div>
+
     <t:tabcontrol id="settings"
       subclass="content dialogtabcontrol" 
-      position="bottom"  remember="<%=extract != null%>" 
+      position="bottom" remember="<%=extract != null%>" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Extract" validate="validateExtract()" helpid="extract.edit">
+    <t:tab id="info" title="Extract" helpid="extract.edit">
       <table class="fullform input100">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" 
+          data-auto-init="<%=extract == null ? "focus-select" : "focus" %>" type="text" name="name" 
           value="<%=HTML.encodeTags(name)%>" 
           maxlength="<%=Extract.MAX_NAME_LENGTH%>"></td>
@@ -689 +353 @@
         <td>
           <select name="subtype_id" id="subtype_id"
-            <%=!readCurrentSubtype ? "disabled readonly class=\"disabled selectionlist\"" : "class=\"selectionlist\""%>
-            onchange="subtypeOnChange()"
-            >
+            <%=!readCurrentSubtype ? "disabled readonly class=\"disabled selectionlist\"" : "class=\"selectionlist\""%>>
           <%
           if (!readCurrentSubtype)
@@ -733 +395 @@
             recent="<%=recentTags%>"
             newitem="<%=extract == null%>"
-            onselect="selectTagOnClick()"
           />
         </td>
@@ -747 +408 @@
       <tr>
         <th>Original quantity</th>
-        <td><input class="text" type="text" name="original_quantity" style="width: 15em;"
+        <td><input class="text" type="text" name="original_quantity" id="original_quantity" style="width: 15em;"
           value="<%=Values.formatNumber(extract == null ? Values.getFloat(cc.getPropertyValue("originalQuantity"), null): extract.getOriginalQuantity(), -1)%>"
-          maxlength="10" onkeypress="return Numbers.numberOnly(event)"> (µg)</td>
+          maxlength="10"> (µg)</td>
         <td></td>
       </tr>
@@ -790 +451 @@
             defaultitems="<%=defaultProtocols%>"
             newitem="<%=extract == null%>"
-            onselect="selectProtocolOnClick()"
             disabled="<%=lockEventProperties%>"
           />
@@ -807 +467 @@
             recent="<%=recentBioPlates%>"
             newitem="<%=extract == null%>"
-            onselect="selectBioPlateOnClick()"
-            onchange="bioPlateOnChange()"
             disabled="<%=lockedWell%>"
           />
@@ -824 +482 @@
             denied="<%=!readCurrentBioWell%>"
             newitem="<%=extract == null%>"
-            onselect="selectBioWellOnClick()"
-            onchange="bioWellOnChange()"
             disabled="<%=lockedWell%>"
           />
@@ -850 +506 @@
         <td>
           <input type="radio" name="parentType" id="parentType.sample" 
-            value="SAMPLE" onclick="parentTypeOnClick()"
-            <%=parentType != Item.EXTRACT ? "checked" : ""%>
+            value="SAMPLE" <%=parentType != Item.EXTRACT ? "checked" : ""%>
             ><label for="parentType.sample">Sample</label>
           <input type="radio" name="parentType" id="parentType.extract" 
-            value="EXTRACT" onclick="parentTypeOnClick()"
-            <%=parentType == Item.EXTRACT ? "checked" : ""%>
+            value="EXTRACT" <%=parentType == Item.EXTRACT ? "checked" : ""%>
             ><label for="parentType.extract">Extract</label>
         </td>
@@ -875 +529 @@
             selectrecent="false"
             newitem="<%=extract == null%>"
-            onselect="selectSampleOnClick()"
           />
         </td>
@@ -882 +535 @@
         <th class="subprompt">used quantity</th>
         <td>
-          <input class="text" style="width: 15em;" type="text" name="used_from_sample" 
+          <input class="text" style="width: 15em;" type="text" name="used_from_sample"
+            id="used_from_sample" 
             value="<%=Values.formatNumber(usedFromSample, -1)%>"
-            maxlength="10" onkeypress="return Numbers.numberOnly(event)"
-            onblur="usedFromSampleOnBlur()"> (µg)
+            maxlength="10"> (µg)
         </td>
       </tr>
@@ -895 +548 @@
           <tr>
           <td>
-            <select name="extracts" size="12" multiple onchange="extractsOnChange()">
+            <select name="extracts" id="extracts"
+              class="auto-init"
+              data-auto-init="link-container"
+              data-initial-items="[<%=HTML.encodeTags(jsonExtracts.toJSONString()) %>]"
+              data-initial-action="<%=extract == null ? 1 : 0 %>"
+              size="15" multiple>
             </select>
           </td>
@@ -902 +560 @@
             <base:buttongroup vertical="true">
               <base:button 
+                id="btnAddExtracts"
                 subclass="leftaligned"
                 style="width: 12em;"
-                onclick="addExtractsOnClick()" 
                 title="Add&nbsp;extracts&hellip;" 
                 tooltip="Add extracts"
               />
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="remove-link"
+                data-list-id="extracts"
                 style="width: 12em;"
-                onclick="removeOnClick()" 
                 title="Remove" 
                 tooltip="Remove the selected extracts"
               />
             </base:buttongroup>
-            <input type="hidden" name="modifiedExtracts" value="">
-            <input type="hidden" name="removedExtracts" value="">
           </td>
           </tr>
@@ -928 +585 @@
         <td>
           <input class="text" style="width: 15em;" type="text" name="used_quantity" 
-              value=""
-              maxlength="10" onkeypress="return Numbers.numberOnly(event)"
-              onkeyup="usedQuantityOnBlur();"
-            > (µg)
+            id="used_quantity" value="" maxlength="10" > (µg)
         </td>
       </tr>         
@@ -941 +595 @@
     </t:tab>
 
-    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit">
       <jsp:include page="../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -950 +604 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -965 +619 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/biomaterials/extracts/extracts.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', extracts.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', extracts.loadAnnotationsFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', extracts.loadInheritedAnnotationsFrame);
+      TabControl.addTabValidator('settings.info', extracts.validateExtract);
+
+      // Quantity
+      Events.addEventHandler('original_quantity', 'keypress', Events.numberOnly);
+
+      // Tag
+      Buttons.addClickHandler('tag_id.select', extracts.selectTag);
+      Events.addEventHandler('tag_id', 'base-selected', extracts.setTagCallback);
+
+      // Protocol
+      Buttons.addClickHandler('protocol_id.select', extracts.selectProtocol);
+      Events.addEventHandler('protocol_id', 'base-selected', extracts.setProtocolCallback);
+      // Subtype
+      Events.addEventHandler('subtype_id', 'change', extracts.subtypeOnChange);
+
+      // Bioplate and biowell
+      Buttons.addClickHandler('bioplate_id.select', extracts.selectBioPlate);
+      Events.addEventHandler('bioplate_id', 'base-selected', extracts.setBioPlateCallback);
+      Events.addEventHandler('bioplate_id', 'change', extracts.bioPlateOnChange);
+      Buttons.addClickHandler('biowell_id.select', extracts.selectBioWell);
+      Events.addEventHandler('biowell_id', 'base-selected', extracts.setBioWellCallback);
+      extracts.initBioWell();
+
+      // Parent items
+      Events.addEventHandler('parentType.sample', 'click', extracts.parentTypeOnClick);
+      Events.addEventHandler('parentType.extract', 'click', extracts.parentTypeOnClick);
+      Buttons.addClickHandler('sample_id.select', extracts.selectSample);
+      Events.addEventHandler('sample_id', 'base-selected', extracts.setSampleCallback);
+      Events.addEventHandler('used_from_sample', 'keypress', Events.numberOnly);
+      Events.addEventHandler('used_from_sample', 'blur', extracts.usedFromSampleOnBlur);
+
+      Events.addEventHandler('extracts', 'change', extracts.extractsOnChange);
+      Buttons.addClickHandler('btnAddExtracts', extracts.addExtractsOnClick);
+      Events.addEventHandler('btnAddExtracts', 'base-selected', extracts.addExtractCallback);
+      
+      Events.addEventHandler('used_quantity', 'keypress', Events.numberOnly);
+      Events.addEventHandler('used_quantity', 'keyup', extracts.usedQuantityOnChange);
+
+      extracts.parentTypeOnClick();
+
     }
     else if (pageId == 'view-page')
@@ -162 +208 @@
     location.replace(url);
   }
+  
+  extracts.validateExtract = function()
+  {
+    var frm = document.forms['extract'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    if (Main.trimString(frm.bioplate_id.value) != 0 && Main.trimString(frm.biowell_id.value) == 0)
+    {
+      Forms.showNotification('biowell_id.select', 'You must choose a biowell from the bioplate');
+      return false;
+    }
+    return true;
+  }
+
+  extracts.save = function()
+  {
+    var frm = document.forms['extract'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      Link.exportActions('extracts');
+      frm.submit();
+    }
+  }
+
+
+  extracts.loadAnnotationsFrame = function()
+  {
+    var frm = document.forms['extract'];
+    var protocolId = 0;
+    if (frm.protocol_id.length > 0 && !frm.protocol_id.disabled) 
+    {
+      protocolId = Math.abs(parseInt(frm.protocol_id.value));       
+    }
+    Annotations.autoLoadEditFrame(protocolId, ItemSubtype.getSubtypeId('subtype_id'));
+  }
+
+  extracts.loadInheritedAnnotationsFrame = function()
+  {
+    Annotations.autoLoadInheritFrame(extracts.getParents());
+  }
+
+  
+  extracts.getParents = function()
+  {
+    var frm = document.forms['extract'];
+    var parents = [];
+    if (frm.parentType[0].checked)
+    {
+      var sampleId = Math.abs(parseInt(frm.sample_id.value));
+      if (sampleId > 0) parents[parents.length] = 'SAMPLE:'+sampleId;
+    }
+    else
+    {
+      var ids = Link.getIdsInList(frm.extracts, 'EXTRACT');
+      if (ids.length > 0)
+      {
+        parents[parents.length] = 'EXTRACT:'+ids.join(':');
+      }
+    }
+    return parents;
+  }
+
+  extracts.subtypeOnChange = function()
+  {
+    var frm = document.forms['extract'];
+    var subtypeId = ItemSubtype.getSubtypeId('subtype_id');
+    var recentInfo = ItemSubtype.getRelatedProjectDefaultAndRecentItems('EXTRACT', subtypeId, ['PROTOCOL', 'BIOPLATE', 'TAG', 'SAMPLE', 'EXTRACT']);
+    ItemSubtype.updateSelectionList(frm.protocol_id, recentInfo.PROTOCOL['recent'], recentInfo.PROTOCOL['default']);
+    ItemSubtype.updateSelectionList(frm.tag_id, recentInfo.TAG['recent']);
+    ItemSubtype.updateSelectionList(frm.bioplate_id, recentInfo.BIOPLATE['recent']);
+  }
+  
+  extracts.selectTag = function()
+  {
+    var frm = document.forms['extract'];
+    var url = '../tags/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone';
+    var url = '&resetTemporary=1';
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'TAG');
+    if (frm.tag_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.tag_id[1].value));       
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('TAG', 'tag_id', 0, url);
+  }
+  
+  extracts.setTagCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    var list = frm.tag_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+
+  
+  extracts.selectProtocol = function()
+  {
+    var frm = document.forms['extract'];
+    var url = '&resetTemporary=1';
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'PROTOCOL', Data.int('page-data', 'extraction-protocoltype-id'));
+    if (frm.protocol_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.protocol_id[1].value));        
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('PROTOCOL', 'protocol_id', 0, url);
+  }
+  
+  extracts.setProtocolCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    var list = frm.protocol_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+
+  extracts.selectBioPlate = function()
+  {
+    var frm = document.forms['extract'];
+    var url = '&resetTemporary=1';
+    url += '&tmpfilter:INT:bioPlateType.bioMaterialType=|'+Data.get('page-data', 'extract-type');
+    var subtypeId = ItemSubtype.getSubtypeId('subtype_id');
+    // Restrict to plates with the given subtype
+    url += '&tmpfilter:INT:bioPlateType.itemSubtype='+(subtypeId ? '|' + subtypeId : '=');
+    url += '&tmpfilter:BOOLEAN:destroyed=false';
+    Dialogs.selectItem('BIOPLATE', 'bioplate_id', 0, url);
+  }
+  
+  extracts.setBioPlateCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    var list = frm.bioplate_id;
+    if (list.length < 2 || list[1].value == '0') 
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+    extracts.bioPlateOnChange();
+  }
+
+  extracts.bioPlateOnChange = function()
+  {
+    var frm = document.forms['extract'];
+    var list = frm.bioplate_id;
+    frm.biowell_id.selectedIndex=0;
+    frm.biowell_id.remove(1);     
+  }
+  
+  extracts.initBioWell = function()
+  {
+    var biowell = JSON.parse(Data.get('page-data', 'biowell'));
+    if (biowell)
+    {
+      var frm = document.forms['extract'];
+      var option = new Option(biowell.location, -biowell.id, true);
+      frm.biowell_id[1] = option;
+    }
+  }
+  
+  extracts.selectBioWell = function()
+  {
+    var frm = document.forms['extract'];
+    var bioplateId = Math.abs(parseInt(frm.bioplate_id.value))
+    if (bioplateId == 0)
+    {
+      Forms.showNotification('bioplate_id.select', 'You must first select a bioplate', null, 'pointer-below');
+      return;
+    }
+    
+    var url = '&bioplate_id='+bioplateId;
+    url += '&resetTemporary=1&tmpfilter:STRING:$mbm.name='+escape('=');
+    url += '&tmpfilter:STRING:originalBioMaterial.name='+escape('=');
+    url += '&columns=row,column';
+
+    Dialogs.selectItem('BIOWELL', 'biowell_id', 0, url);
+  }
+  
+  extracts.setBioWellCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    var list = frm.biowell_id;
+    if (list.length < 2 || list[1].value == '0') 
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+
+  extracts.parentTypeOnClick = function()
+  {
+    var frm = document.forms['extract'];
+    var useExtracts = frm.parentType[1].checked;
+    frm.sample_id.disabled = useExtracts;
+    frm.used_from_sample.disabled = useExtracts;
+    frm.extracts.disabled = !useExtracts;
+    frm.used_quantity.disabled = !useExtracts;
+  }
+
+  extracts.selectSample = function()
+  {
+    var frm = document.forms['extract'];
+    var url = '&resetTemporary=1';
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'SAMPLE');
+    if (frm.sample_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.sample_id[1].value));        
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('SAMPLE', 'sample_id', 0, url);
+  }
+  
+  extracts.setSampleCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    var list = frm.sample_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+
+    frm.parentType[0].checked = true;
+    frm.parentType[1].checked = false;
+    extracts.parentTypeOnClick();
+  }
+
+  extracts.usedFromSampleOnBlur = function()
+  {
+    var frm = document.forms['extract'];
+    var sampleId = parseInt(frm.sample_id.value);
+    if (sampleId < 0)
+    {
+      frm.sample_id[frm.sample_id.selectedIndex].value = -sampleId;
+    }
+  }
+  
+  extracts.addExtractsOnClick = function(event)
+  {
+    var frm = document.forms['extract'];
+    var currentExtracts = Link.getIdsInList(frm.extracts, 'EXTRACT');
+    var url = '&resetTemporary=1&exclude='+currentExtracts.join(',');
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'EXTRACT');
+    Dialogs.selectItem('EXTRACT', event.currentTarget.id, 1, url);
+  }
+
+  extracts.addExtractCallback = function(event)
+  {
+    var frm = document.forms['extract'];
+    event.detail.name += ' [-]';
+    Link.addItem('extracts', 'EXTRACT', event.detail);
+    frm.parentType[0].checked = false;
+    frm.parentType[1].checked = true;
+    extracts.parentTypeOnClick();
+  }
+
+  extracts.usedQuantityOnChange = function()
+  {
+    var frm = document.forms['extract'];
+    var usedQuantity = frm.used_quantity.value;
+    var displayQuantity = usedQuantity == '' ? '-' : usedQuantity+' µg';
+    for (var i = 0; i < frm.extracts.length; i++)
+    {
+      var option = frm.extracts[i];
+      if (option.selected && option.item.id)
+      {
+        option.item.value = usedQuantity;
+        var text = option.text.replace(/\[.*\]/, '['+displayQuantity+']');
+        option.text = text; 
+      }
+    }
+  }
+  
+  extracts.extractsOnChange = function()
+  {
+    var frm = document.forms['extract'];
+    var item = frm.extracts[frm.extracts.selectedIndex].item;
+    if (item && item.id && item.value != undefined)
+    {
+      frm.used_quantity.value = item.value;
+    }
+    else
+    {
+      frm.used_quantity.value = '';
+    }
+    frm.used_quantity.focus();
+  }
 
   return extracts;

trunk/www/biomaterials/extracts/index.jsp

@@ -307 +307 @@
           creationEvent.clearSources();
         }
-        String[] modifiedExtracts = Values.getString(request.getParameter("modifiedExtracts")).split(",");
+        String[] modifiedExtracts = Values.getString(request.getParameter("+EXTRACT")).split(",");
         for (int i = 0; i < modifiedExtracts.length; ++i)
         {
@@ -314 +314 @@
           {
             Extract e = Extract.getById(dc, eId);
-            creationEvent.addSource(e).setUsedQuantity(Values.getFloat(request.getParameter("E"+eId), null));
+            creationEvent.addSource(e).setUsedQuantity(Values.getFloat(request.getParameter("EXTRACT."+eId), null));
           }
         }
-        String[] removedExtracts = Values.getString(request.getParameter("removedExtracts")).split(",");
+        String[] removedExtracts = Values.getString(request.getParameter("-EXTRACT")).split(",");
         for (int i = 0; i < removedExtracts.length; ++i)
         {

trunk/www/biomaterials/samples/edit_sample.jsp

@@ -63 +63 @@
   import="net.sf.basedb.clients.web.extensions.edit.EditUtil"
   import="net.sf.basedb.util.extensions.ExtensionsInvoker"
+  import="net.sf.basedb.util.json.JsonUtil"
+  import="net.sf.basedb.util.json.JsonConverter"
+  import="net.sf.basedb.util.json.NameableConverter"
+  import="org.json.simple.JSONObject"
+  import="org.json.simple.JSONArray"
   import="java.util.List"
   import="java.util.Set"
@@ -254 +259 @@
   subtypesQuery.include(Include.ALL);
   
-  
+  JSONObject jsonBioWell = null;
+  if (currentBioWell != null)
+  {
+    jsonBioWell = new JSONObject();
+    jsonBioWell.put("id", currentBioWell.getId());
+    jsonBioWell.put("location", currentBioWell.getCoordinate());
+  }
+  
+  JSONObject jsonSamples = new JSONObject();
+  jsonSamples.put("itemType", "SAMPLE");
+  if (samplesQuery != null)
+  {
+    final BioMaterialEvent event = creationEvent;
+    jsonSamples.put("items", JsonUtil.toArray(samplesQuery.iterate(dc), new NameableConverter<Sample>()
+    {
+      protected void setMore(JSONObject json, Sample s)
+      {
+        Float usedQuantity = event == null ? null : event.getUsedQuantity(s);
+        json.put("name", s.getName() + (usedQuantity == null ? " [-]" : " [" +  usedQuantity + " µg]"));
+        json.put("value", usedQuantity);
+      }
+    }));
+  }
+
   
   Formatter<Date> dateFormatter = FormatterFactory.getDateFormatter(sc);
@@ -264 +292 @@
   %>
   <base:page type="popup" title="<%=title%>" id="edit-page">
-  <base:head scripts="tabcontrol-2.js,linkitems.js,subtypes.js,~samples.js" styles="tabcontrol.css">
+  <base:head scripts="tabcontrol-2.js,linkitems-2.js,subtypes.js,~samples.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    
-    
-    function getParents()
-    {
-      var frm = document.forms['sample'];
-      var parents = new Array();
-      if (frm.parentType[0].checked)
-      {
-        var bioSourceId = Math.abs(parseInt(frm.biosource_id[frm.biosource_id.selectedIndex].value));
-        if (bioSourceId > 0) parents[parents.length] = 'BIOSOURCE:'+bioSourceId;
-      }
-      else
-      {
-        var ids = Link.getListIds(frm.samples, 'S');
-        if (ids.length > 0)
-        {
-          parents[parents.length] = 'SAMPLE:'+ids.join(':');
-        }
-      }
-      return parents;
-    }
-    
-
-    function bioPlateOnChange()
-    {
-      var frm = document.forms['sample'];
-      var list = frm.bioplate_id;
-      frm.biowell_id.selectedIndex=0;
-      frm.biowell_id.remove(1);     
-    }
-
-    function initBioWell()
-    {
-      var frm = document.forms['sample'];
-      <%
-      if (currentBioWell != null)
-      {
-        %>
-        var list = frm.biowell_id;
-        var wellId = <%=currentBioWell.getId()%>;
-        Forms.addListOption(list, 1, new Option());
-        list[1].value = '<%=currentBioWell.getId()*(sample == null ? 1 : -1)%>';
-        list[1].text = '<%=rowFormatter.format(currentBioWell.getRow())%><%=columnFormatter.format(currentBioWell.getColumn())%>';
-        list.selectedIndex = 1;
-      <%
-      }
-      %>
-    }         
-    function selectBioWellOnClick()
-    {
-      var frm = document.forms['sample'];
-      var bioplate_list = frm.bioplate_id;      
-      var bioplateId = Math.abs(parseInt(bioplate_list[bioplate_list.selectedIndex].value))
-      if (Main.trimString(frm.bioplate_id.value) == 0)
-      {
-        Forms.showNotification('bioplate_id.select', 'You must first select a bioplate', null, 'pointer-below');
-        return;
-      }     
-        
-      var url = '../bioplates/wells/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setBioWellCallback';
-      if (frm.biowell_id.length > 1)
-      {
-        var id = Math.abs(parseInt(frm.biowell_id[1].value));       
-        url += '&item_id='+id;
-      }
-      url += '&bioplate_id='+bioplateId;
-      url += '&resetTemporary=1&tmpfilter:STRING:$mbm.name='+escape('=');
-      url += '&tmpfilter:STRING:originalBioMaterial.name='+escape('=');
-      url += '&columns=row,column';
-      Main.openPopup(url, 'SelectBiowell', 750, 500);
-    }
-    function setBioWellCallback(id, name)
-    {
-      var frm = document.forms['sample'];
-      var list = frm.biowell_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    
-    function parentTypeOnClick()
-    {
-      var frm = document.forms['sample'];
-      var useSamples = frm.parentType[1].checked;
-      frm.biosource_id.disabled = useSamples;
-      frm.samples.disabled = !useSamples;
-      frm.used_quantity.disabled = !useSamples;
-    }
-    function selectBioSourceOnClick()
-    {
-      var frm = document.forms['sample'];
-      var url = '../biosources/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone';
-      url += '&callback=setBioSourceCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'BIOSOURCE');
-      if (frm.biosource_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.biosource_id[1].value));       
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectBioSource', 1050, 700);
-    }
-    function setBioSourceCallback(id, name)
-    {
-      var frm = document.forms['sample'];
-      var list = frm.biosource_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-
-      frm.parentType[0].checked = true;
-      frm.parentType[1].checked = false;
-      parentTypeOnClick();
-    }
-    
-    function addSamplesOnClick()
-    {
-      var frm = document.forms['sample'];
-      var url = 'index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectmultiple';
-      url += '&callback=addSampleCallback&resetTemporary=1';
-      url += ItemSubtype.createRelatedFilter('subtype_id', 'SAMPLE');
-      Main.openPopup(url, 'AddSamples', 1050, 700);
-    }
-    function addSampleCallback(sampleId, name)
-    {
-      var frm = document.forms['sample'];
-      var item = Link.getItem('S', sampleId);
-      if (!item) item = new Item('S', sampleId, name+' [-]', '', '');
-      Link.addItem(frm.samples, item);
-      frm.parentType[0].checked = false;
-      frm.parentType[1].checked = true;
-      parentTypeOnClick();
-    }
-    function samplesOnChange()
-    {
-      var frm = document.forms['sample'];
-      var item = frm.samples[frm.samples.selectedIndex].item;
-      if (item && item.id)
-      {
-        frm.used_quantity.value = item.value;
-        frm.used_quantity.focus();
-      }
-      else
-      {
-        frm.used_quantity.value = '';
-      }
-    }
-    function usedQuantityOnBlur()
-    {
-      var frm = document.forms['sample'];
-      var usedQuantity = frm.used_quantity.value;
-      var displayQuantity = usedQuantity == '' ? '-' : usedQuantity+' µg';
-      for (var i = 0; i < frm.samples.length; i++)  // >
-      {
-        var option = frm.samples[i];
-        if (option.selected && option.item.id)
-        {
-          option.item.value = usedQuantity;
-          var text = option.text.replace(/\[.*\]/, '['+displayQuantity+']');
-          option.text = text; 
-        }
-      }
-    }
-
-    function removeOnClick()
-    {
-      Link.removeSelected(document.forms['sample'].samples);
-    }
-
-    function init()
-    {
-      <%
-      if (sample == null)
-      {
-        %>
-        var frm = document.forms['sample'];
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-      initBioWell();
-      initSamples();
-      parentTypeOnClick();    
-    }
-    function initSamples()
-    {
-      var samples = document.forms['sample'].samples;
-      <%
-      if (samplesQuery != null)
-      {
-        samplesQuery.include(Include.ALL);
-        samplesQuery.order(Orders.asc(Hql.property("name")));
-        ItemResultList<Sample> samples = samplesQuery.list(dc);
-        for (Sample s : samples)
-        {
-          if (sample != null)
-          {
-            String usedQuantity = Values.formatNumber(creationEvent.getUsedQuantity(s), -1);
-            %>
-            Link.addNewItem(samples, new Item('S', <%=s.getId()%>, '<%=HTML.javaScriptEncode(s.getName())%> [<%=usedQuantity%> µg]', '<%=usedQuantity%>'));
-            <%
-          }
-          else
-          {
-            %>
-            Link.addItem(samples, new Item('S', <%=s.getId()%>, '<%=HTML.javaScriptEncode(s.getName())%> [-]', '', ''));
-            <%
-          }
-        }
-      }
-      %>
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="sample">
@@ -497 +303 @@
     <div id="page-data" class="datacontainer"
       data-sampling-protocoltype-id="<%=SystemItems.getId(Protocol.SAMPLING)%>"
+      data-sample-type="<%=Item.SAMPLE.getValue()%>"
+      <%
+      if (jsonBioWell != null)
+      {
+        %>
+        data-biowell="<%=HTML.encodeTags(jsonBioWell.toJSONString()) %>"
+        <%
+      }
+      %>
     ></div>
 
     <t:tabcontrol id="settings"
       subclass="content dialogtabcontrol" 
-      position="bottom"  remember="<%=sample != null%>" 
+      position="bottom" remember="<%=sample != null%>" 
       extensions="<%=invoker%>">
     <t:tab id="info" title="Sample" helpid="sample.edit">
@@ -558 +373 @@
       <tr>
         <th>Original quantity</th>
-        <td><input class="text" type="text" name="original_quantity" style="width: 15em;"
+        <td><input class="text" type="text" name="original_quantity" id="original_quantity" style="width: 15em;"
           value="<%=Values.formatNumber(sample == null ? Values.getFloat(cc.getPropertyValue("originalQuantity"), null): sample.getOriginalQuantity(), -1)%>" size="12" 
-          maxlength="10" onkeypress="return Numbers.numberOnly(event)"> (µg)</td>
+          maxlength="10"> (µg)</td>
         <td></td>
       </tr>
@@ -617 +432 @@
             recent="<%=recentBioPlates%>"
             newitem="<%=sample == null%>"
-            onchange="bioPlateOnChange()"
             disabled="<%=lockedWell%>"
           />
@@ -633 +447 @@
             denied="<%=!readCurrentBioWell%>"
             newitem="<%=sample == null%>"
-            onselect="selectBioWellOnClick()"
-            onchange="bioWellOnChange()"
             disabled="<%=lockedWell%>"
           />
@@ -659 +471 @@
         <td>
           <input type="radio" name="parentType" id="parentType.biosource" 
-            value="BIOSOURCE" onclick="parentTypeOnClick()"
-            <%=parentType != Item.SAMPLE ? "checked" : ""%>
+            value="BIOSOURCE" <%=parentType != Item.SAMPLE ? "checked" : ""%>
             ><label for="parentType.biosource">Biosource</label>
           <input type="radio" name="parentType" id="parentType.sample" 
-            value="SAMPLE" onclick="parentTypeOnClick()"
-            <%=parentType == Item.SAMPLE ? "checked" : ""%>
+            value="SAMPLE" <%=parentType == Item.SAMPLE ? "checked" : ""%>
             ><label for="parentType.sample">Sample</label>
         </td>
@@ -684 +494 @@
             selectrecent="false"
             newitem="<%=sample == null%>"
-            onselect="selectBioSourceOnClick()"
           />
         </td>
@@ -695 +504 @@
           <tr>
             <td>
-            <select name="samples" size="12" multiple onchange="samplesOnChange()">
+            <select name="samples" id="samples"
+              class="auto-init"
+              data-auto-init="link-container"
+              data-initial-items="[<%=HTML.encodeTags(jsonSamples.toJSONString()) %>]"
+              data-initial-action="<%=sample == null ? 1 : 0 %>"
+              size="15" multiple>
             </select>
           </td>
@@ -701 +515 @@
             <base:buttongroup vertical="true">
               <base:button 
+                id="btnAddSamples"
                 subclass="leftaligned"
                 style="width: 12em;"
-                onclick="addSamplesOnClick()" 
                 title="Add&nbsp;samples&hellip;" 
                 tooltip="Add samples"
-                />
+              />
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="remove-link"
+                data-list-id="samples"
                 style="width: 12em;"
-                onclick="removeOnClick()" 
                 title="Remove" 
                 tooltip="Remove the selected samples"
               />
             </base:buttongroup>
-            <input type="hidden" name="modifiedSamples" value="">
-            <input type="hidden" name="removedSamples" value="">
           </td>
           </tr>
@@ -726 +539 @@
         <th class="subprompt">- used quantity</th>
         <td>
-          <input class="text" style="width: 15em;" type="text" name="used_quantity" value=""
-               maxlength="10" onkeypress="return Numbers.numberOnly(event)"
-              onkeyup="usedQuantityOnBlur();"
-            > (µg)
+          <input class="text" style="width: 15em;" type="text" 
+            name="used_quantity" id="used_quantity" value=""
+             maxlength="10"> (µg)
         </td>
       </tr>

trunk/www/biomaterials/samples/index.jsp

@@ -281 +281 @@
           creationEvent.clearSources();
         }
-        String[] modifiedSamples = Values.getString(request.getParameter("modifiedSamples")).split(",");
+        String[] modifiedSamples = Values.getString(request.getParameter("+SAMPLE")).split(",");
         for (int i = 0; i < modifiedSamples.length; ++i)
         {
@@ -288 +288 @@
           {
             Sample s = Sample.getById(dc, sId);
-            creationEvent.addSource(s).setUsedQuantity(Values.getFloat(request.getParameter("S"+sId), null));
+            creationEvent.addSource(s).setUsedQuantity(Values.getFloat(request.getParameter("SAMPLE."+sId), null));
           }
         }
-        String[] removedSamples = Values.getString(request.getParameter("removedSamples")).split(",");
+        String[] removedSamples = Values.getString(request.getParameter("-SAMPLE")).split(",");
         for (int i = 0; i < removedSamples.length; ++i)
         {

trunk/www/biomaterials/samples/samples.js

@@ -44 +44 @@
       TabControl.addTabValidator('settings.info', samples.validateSample);
 
+      // Quantity
+      Events.addEventHandler('original_quantity', 'keypress', Events.numberOnly);
+      
       // Protocol
       Buttons.addClickHandler('protocol_id.select', samples.selectProtocol);
       Events.addEventHandler('protocol_id', 'base-selected', samples.setProtocolCallback);
-      
       // Subtype
       Events.addEventHandler('subtype_id', 'change', samples.subtypeOnChange);
@@ -54 +56 @@
       Buttons.addClickHandler('bioplate_id.select', samples.selectBioPlate);
       Events.addEventHandler('bioplate_id', 'base-selected', samples.setBioPlateCallback);
+      Events.addEventHandler('bioplate_id', 'change', samples.bioPlateOnChange);
+      Buttons.addClickHandler('biowell_id.select', samples.selectBioWell);
+      Events.addEventHandler('biowell_id', 'base-selected', samples.setBioWellCallback);
+      samples.initBioWell();
+      
+      // Parent items
+      Events.addEventHandler('parentType.biosource', 'click', samples.parentTypeOnClick);
+      Events.addEventHandler('parentType.sample', 'click', samples.parentTypeOnClick);
+      Buttons.addClickHandler('biosource_id.select', samples.selectBioSource);
+      Events.addEventHandler('biosource_id', 'base-selected', samples.setBioSourceCallback);
+
+      Events.addEventHandler('samples', 'change', samples.samplesOnChange);
+      Buttons.addClickHandler('btnAddSamples', samples.addSamplesOnClick);
+      Events.addEventHandler('btnAddSamples', 'base-selected', samples.addSampleCallback);
+      
+      Events.addEventHandler('used_quantity', 'keypress', Events.numberOnly);
+      Events.addEventHandler('used_quantity', 'keyup', samples.usedQuantityOnChange);
+
+      samples.parentTypeOnClick();
+      
     }
     else if (pageId == 'view-page')
@@ -184 +206 @@
       Annotations.saveModifiedAnnotationsToForm(frm);
       Annotations.saveInheritedAnnotationsToForm(frm);
-      frm.modifiedSamples.value = Link.exportModified(frm, 'S', true).join(',');
-      frm.removedSamples.value = Link.getActionIds(-1, 'S').join(',');
+      Link.exportActions('samples');
       frm.submit();
     }
   }
   
+  samples.selectBioPlate = function()
+  {
+    var frm = document.forms['sample'];
+    var url = '&resetTemporary=1';
+    url += '&tmpfilter:INT:bioPlateType.bioMaterialType=|'+Data.get('page-data', 'sample-type');
+    var subtypeId = ItemSubtype.getSubtypeId('subtype_id');
+    // Restrict to plates with the given subtype
+    url += '&tmpfilter:INT:bioPlateType.itemSubtype='+(subtypeId ? '|' + subtypeId : '=');
+    url += '&tmpfilter:BOOLEAN:destroyed=false';
+    Dialogs.selectItem('BIOPLATE', 'bioplate_id', 0, url);
+  }
+  
+  samples.setBioPlateCallback = function(event)
+  {
+    var frm = document.forms['sample'];
+    var list = frm.bioplate_id;
+    if (list.length < 2 || list[1].value == '0') 
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+    samples.bioPlateOnChange();
+  }
+
+  samples.bioPlateOnChange = function()
+  {
+    var frm = document.forms['sample'];
+    var list = frm.bioplate_id;
+    frm.biowell_id.selectedIndex=0;
+    frm.biowell_id.remove(1);     
+  }
+  
+  samples.initBioWell = function()
+  {
+    var biowell = JSON.parse(Data.get('page-data', 'biowell'));
+    if (biowell)
+    {
+      var frm = document.forms['sample'];
+      var option = new Option(biowell.location, -biowell.id, true);
+      frm.biowell_id[1] = option;
+    }
+  }
+  
+  samples.selectBioWell = function()
+  {
+    var frm = document.forms['sample'];
+    var bioplateId = Math.abs(parseInt(frm.bioplate_id.value))
+    if (bioplateId == 0)
+    {
+      Forms.showNotification('bioplate_id.select', 'You must first select a bioplate', null, 'pointer-below');
+      return;
+    }
+    
+    var url = '&bioplate_id='+bioplateId;
+    url += '&resetTemporary=1&tmpfilter:STRING:$mbm.name='+escape('=');
+    url += '&tmpfilter:STRING:originalBioMaterial.name='+escape('=');
+    url += '&columns=row,column';
+
+    Dialogs.selectItem('BIOWELL', 'biowell_id', 0, url);
+  }
+  samples.setBioWellCallback = function(event)
+  {
+    var frm = document.forms['sample'];
+    var list = frm.biowell_id;
+    if (list.length < 2 || list[1].value == '0') 
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
   
   samples.loadAnnotationsFrame = function()
@@ -197 +292 @@
     if (frm.protocol_id.length > 0 && !frm.protocol_id.disabled) 
     {
-      protocolId = Math.abs(parseInt(frm.protocol_id[frm.protocol_id.selectedIndex].value));        
+      protocolId = Math.abs(parseInt(frm.protocol_id.value));       
     }
     Annotations.autoLoadEditFrame(protocolId, ItemSubtype.getSubtypeId('subtype_id'));
@@ -204 +299 @@
   samples.loadInheritedAnnotationsFrame = function()
   {
-    Annotations.autoLoadInheritFrame(getParents());
+    Annotations.autoLoadInheritFrame(samples.getParents());
+  }
+  
+  samples.getParents = function()
+  {
+    var frm = document.forms['sample'];
+    var parents = [];
+    if (frm.parentType[0].checked)
+    {
+      var bioSourceId = Math.abs(parseInt(frm.biosource_id.value));
+      if (bioSourceId > 0) parents[parents.length] = 'BIOSOURCE:'+bioSourceId;
+    }
+    else
+    {
+      var ids = Link.getIdsInList(frm.samples, 'SAMPLE');
+      if (ids.length > 0)
+      {
+        parents[parents.length] = 'SAMPLE:'+ids.join(':');
+      }
+    }
+    return parents;
   }
   
@@ -222 +337 @@
   samples.setProtocolCallback = function(event)
   {
-    var id = event.detail.id;
-    var name = event.detail.name;
     var frm = document.forms['sample'];
     var list = frm.protocol_id;
@@ -230 +343 @@
       Forms.addListOption(list, 1, new Option());
     }
-    list[1].value = id;
-    list[1].text = name;
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
     list.selectedIndex = 1;
   }
@@ -244 +357 @@
   }
 
+  samples.parentTypeOnClick = function()
+  {
+    var frm = document.forms['sample'];
+    var useSamples = frm.parentType[1].checked;
+    frm.biosource_id.disabled = useSamples;
+    frm.samples.disabled = !useSamples;
+    frm.used_quantity.disabled = !useSamples;
+  }
+
+  samples.selectBioSource = function()
+  {
+    var frm = document.forms['sample'];
+    var url = '&resetTemporary=1';
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'BIOSOURCE');
+    if (frm.biosource_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.biosource_id[1].value));       
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('BIOSOURCE', 'biosource_id', 0, url);
+  }
+  
+  samples.setBioSourceCallback = function(event)
+  {
+    var frm = document.forms['sample'];
+    var list = frm.biosource_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+
+    frm.parentType[0].checked = true;
+    frm.parentType[1].checked = false;
+    samples.parentTypeOnClick();
+  }
+
+  
+  samples.addSamplesOnClick = function(event)
+  {
+    var frm = document.forms['sample'];
+    var currentSamples = Link.getIdsInList(frm.samples, 'SAMPLE');
+    var url = "&resetTemporary=1&exclude="+currentSamples.join(',');
+    url += ItemSubtype.createRelatedFilter('subtype_id', 'SAMPLE');
+    Dialogs.selectItem('SAMPLE', event.currentTarget.id, 1, url);
+  }
+
+  samples.addSampleCallback = function(event)
+  {
+    var frm = document.forms['sample'];
+    event.detail.name += ' [-]';
+    Link.addItem('samples', 'SAMPLE', event.detail);
+    frm.parentType[0].checked = false;
+    frm.parentType[1].checked = true;
+    samples.parentTypeOnClick();
+  }
+
+  samples.usedQuantityOnChange = function()
+  {
+    var frm = document.forms['sample'];
+    var usedQuantity = frm.used_quantity.value;
+    var displayQuantity = usedQuantity == '' ? '-' : usedQuantity+' µg';
+    for (var i = 0; i < frm.samples.length; i++)
+    {
+      var option = frm.samples[i];
+      if (option.selected && option.item.id)
+      {
+        option.item.value = usedQuantity;
+        var text = option.text.replace(/\[.*\]/, '['+displayQuantity+']');
+        option.text = text; 
+      }
+    }
+  }
+  
+  samples.samplesOnChange = function()
+  {
+    var frm = document.forms['sample'];
+    var item = frm.samples[frm.samples.selectedIndex].item;
+    if (item && item.id && item.value != undefined)
+    {
+      frm.used_quantity.value = item.value;
+    }
+    else
+    {
+      frm.used_quantity.value = '';
+    }
+    frm.used_quantity.focus();
+  }
+  
   return samples;
 }();

trunk/www/lims/arraybatches/batches.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', arrayBatches.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', arrayBatches.loadAnnotationsFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', arrayBatches.loadInheritedAnnotationsFrame);
+      TabControl.addTabValidator('settings.info', arrayBatches.validateArrayBatch);
+
+      // Array design
+      Buttons.addClickHandler('arraydesign_id.select', arrayBatches.selectArrayDesign);
+      Events.addEventHandler('arraydesign_id', 'base-selected', arrayBatches.setArrayDesignCallback);
+
+      // Protocol
+      Buttons.addClickHandler('protocol_id.select', arrayBatches.selectProtocol);
+      Events.addEventHandler('protocol_id', 'base-selected', arrayBatches.setProtocolCallback);
+
+      // Print robot
+      Buttons.addClickHandler('printrobot_id.select', arrayBatches.selectPrintRobot);
+      Events.addEventHandler('printrobot_id', 'base-selected', arrayBatches.setPrintRobotCallback);
+
     }
     else if (pageId == 'view-page')
@@ -104 +124 @@
   }
   
+  arrayBatches.validateArrayBatch = function()
+  {
+    var frm = document.forms['batch'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    if (frm.arraydesign_id && !frm.arraydesign_id.value)
+    {
+      Forms.showNotification('arraydesign_id.select', 'You must select an array design');
+      return false;
+    }
+    return true;
+  }
+
+  // Submit the form
+  arrayBatches.save = function()
+  {
+    var frm = document.forms['batch'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      frm.submit();
+    }
+  }
+  
+  arrayBatches.loadAnnotationsFrame = function()
+  {
+    Annotations.autoLoadEditFrame(arrayBatches.getProtocolId());
+  }
+  
+  arrayBatches.loadInheritedAnnotationsFrame = function()
+  {
+    Annotations.autoLoadInheritFrame(arrayBatches.getParents());
+  }
+
+  arrayBatches.getProtocolId = function()
+  {
+    var frm = document.forms['batch'];
+    var protocolId = 0;
+    if (frm.protocol_id.length > 0 && !frm.protocol_id.disabled) 
+    {
+      protocolId = Math.abs(parseInt(frm.protocol_id.value));       
+    }
+    return protocolId;
+  }
+
+  arrayBatches.getParents = function()
+  {
+    var frm = document.forms['batch'];
+    var parents = new Array();
+    if (frm.arraydesign_id)
+    {
+      var arrayDesignId = Math.abs(parseInt(frm.arraydesign_id.value));
+      if (arrayDesignId > 0) parents[parents.length] = 'ARRAYDESIGN:'+arrayDesignId;
+    }
+    return parents;
+  }
+
+  arrayBatches.selectArrayDesign = function()
+  {
+    var frm = document.forms['batch'];
+    var url = '';
+    if (frm.arraydesign_id.length > 0) 
+    {
+      var id = Math.abs(parseInt(frm.arraydesign_id[0].value));       
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('ARRAYDESIGN', 'arraydesign_id', 0, url);
+  }
+  
+  arrayBatches.setArrayDesignCallback = function(event)
+  {
+    var frm = document.forms['batch'];
+    var list = frm.arraydesign_id;
+    if (list.length < 1 || list[0].value == '0')
+    {
+      Forms.addListOption(list, 0, new Option());
+    }
+    list[0].value = event.detail.id;
+    list[0].text = event.detail.name;
+    list.selectedIndex = 0;
+  }
+
+  arrayBatches.selectProtocol = function()
+  {
+    var frm = document.forms['batch'];
+    var url = '';
+    if (frm.protocol_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.protocol_id[1].value));        
+      url += '&item_id='+id;
+    }
+    url += '&resetTemporary=1&tmpfilter:INT:itemSubtype='+Data.get('page-data', 'printing-protocol');
+    Dialogs.selectItem('PROTOCOL', 'protocol_id', 0, url);
+  }
+  
+  arrayBatches.setProtocolCallback = function(event)
+  {
+    var frm = document.forms['batch'];
+    var list = frm.protocol_id;
+    if (list.length < 2 || list[1].value == '0') 
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+  
+  arrayBatches.selectPrintRobot = function()
+  {
+    var frm = document.forms['batch'];
+    var url = '';
+    if (frm.printrobot_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.printrobot_id[1].value));        
+      url += '&item_id='+id;
+    }
+    url += '&resetTemporary=1&tmpfilter:INT:itemSubtype='+Data.get('page-data', 'print-robot');
+    Dialogs.selectItem('HARDWARE', 'printrobot_id', 0, url);
+  }
+  
+  arrayBatches.setPrintRobotCallback = function(event)
+  {
+    var frm = document.forms['batch'];
+    var list = frm.printrobot_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+  
   return arrayBatches;
 }();

trunk/www/lims/arraybatches/edit_batch.jsp

@@ -138 +138 @@
   {
     batch = ArrayBatch.getById(dc, itemId);
+    batch.checkPermission(Permission.WRITE);
     cc.setObject("item", batch);
     title = "Edit array batch -- " + HTML.encodeTags(batch.getName());
@@ -164 +165 @@
       readCurrentProtocol = false;
     }
-  }
-  if (batch != null && !batch.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
+  } 
   
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), batch);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~batches.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "ArrayBatch" tab
-    function validateArrayBatch()
-    {
-      var frm = document.forms['batch'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (frm.arraydesign_id && !frm.arraydesign_id.value)
-      {
-        Forms.showNotification('arraydesign_id.select', 'You must select an array design');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['batch'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        frm.submit();
-      }
-    }
+  </base:head>
+  <base:body>
+    <h1><%=title%> <base:help tabcontrol="settings" /></h1>
+    <div id="page-data" class="datacontainer"
+      data-printing-protocol="<%=SystemItems.getId(Protocol.PRINTING)%>"
+      data-print-robot="<%=SystemItems.getId(Hardware.PRINT_ROBOT)%>"
+    ></div>
     
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame(getProtocolId());
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame(getParents());
-    }
-
-    function getProtocolId()
-    {
-      var frm = document.forms['batch'];
-      var protocolId = 0;
-      if (frm.protocol_id.length > 0 && !frm.protocol_id.disabled) 
-      {
-        protocolId = Math.abs(parseInt(frm.protocol_id[frm.protocol_id.selectedIndex].value));        
-      }
-      return protocolId;
-    }
-
-    function getParents()
-    {
-      var frm = document.forms['batch'];
-      var parents = new Array();
-      if (frm.arraydesign_id)
-      {
-        var arrayDesignId = Math.abs(parseInt(frm.arraydesign_id[frm.arraydesign_id.selectedIndex].value));
-        if (arrayDesignId > 0) parents[parents.length] = 'ARRAYDESIGN:'+arrayDesignId;
-      }
-      return parents;
-    }
-
-    function selectArrayDesignOnClick()
-    {
-      var frm = document.forms['batch'];
-      var url = '../../lims/arraydesigns/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setArrayDesignCallback';
-      if (frm.arraydesign_id.length > 0) 
-      {
-        var id = Math.abs(parseInt(frm.arraydesign_id[0].value));       
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectArrayDesign', 1050, 700);
-    }
-    function setArrayDesignCallback(id, name)
-    {
-      var frm = document.forms['batch'];
-      var list = frm.arraydesign_id;
-      if (list.length < 1 || list[0].value == '0') // >
-      {
-        Forms.addListOption(list, 0, new Option());
-      }
-      list[0].value = id;
-      list[0].text = name;
-      list.selectedIndex = 0;
-    }
-
-    function selectProtocolOnClick()
-    {
-      var frm = document.forms['batch'];
-      var url = '../../admin/protocols/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setProtocolCallback';
-      if (frm.protocol_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.protocol_id[1].value));        
-        url += '&item_id='+id;
-      }
-      url += '&resetTemporary=1&tmpfilter:INT:itemSubtype=<%=SystemItems.getId(Protocol.PRINTING)%>';
-      Main.openPopup(url, 'SelectProtocol', 1050, 700);
-    }
-    function setProtocolCallback(id, name)
-    {
-      var frm = document.forms['batch'];
-      var list = frm.protocol_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    function selectPrintRobotOnClick()
-    {
-      var frm = document.forms['batch'];
-      var url = '../../admin/hardware/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setPrintRobotCallback';
-      if (frm.printrobot_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.printrobot_id[1].value));        
-        url += '&item_id='+id;
-      }
-      url += '&resetTemporary=1&tmpfilter:INT:itemSubtype=<%=SystemItems.getId(Hardware.PRINT_ROBOT)%>';
-      Main.openPopup(url, 'SelectPrintRobot', 1050, 700);
-    }
-    function setPrintRobotCallback(id, name)
-    {
-      var frm = document.forms['batch'];
-      var list = frm.printrobot_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-
-    
-    function init()
-    {
-      var frm = document.forms['batch'];
-      <%
-      if (batch == null)
-      {
-        %>
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-    }
-    </script>
-  </base:head>
-  <base:body onload="init()">
-    <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="batch">
     <input type="hidden" name="cmd" value="UpdateItem">
@@ -337 +187 @@
     <t:tabcontrol id="settings" 
       subclass="content dialogtabcontrol"
-      position="bottom"  remember="<%=batch != null%>" 
+      position="bottom" remember="<%=batch != null%>" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Array batch" validate="validateArrayBatch()" helpid="arraybatch.edit">
+    <t:tab id="info" title="Array batch" helpid="arraybatch.edit">
       <table class="fullform input100">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" data-auto-init="<%=batch == null ? "focus-select" : "focus" %>"
+          type="text" name="name" 
           value="<%=HTML.encodeTags(batch == null ? Values.getString(cc.getPropertyValue("name"), "New array batch") : batch.getName())%>" 
           maxlength="<%=ArrayBatch.MAX_NAME_LENGTH%>"></td>
@@ -370 +221 @@
               defaultitems="<%=defaultArrayDesigns%>"
               newitem="true"
-              onselect="selectArrayDesignOnClick()"
             />
             <%
@@ -390 +240 @@
             defaultitems="<%=defaultPrintRobots%>"
             newitem="<%=batch == null%>"
-            onselect="selectPrintRobotOnClick()"
           />
         </td>
@@ -407 +256 @@
             defaultitems="<%=defaultProtocols%>"
             newitem="<%=batch == null%>"
-            onselect="selectProtocolOnClick()"
           />
         </td>
@@ -425 +273 @@
     </t:tab>
     
-    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit">
       <jsp:include page="../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -434 +282 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -449 +297 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arraydesigns/designs.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', arrayDesigns.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', Annotations.autoLoadEditFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', Annotations.autoLoadInheritFrame);
+      TabControl.addTabActivateListener('settings.datafiles', arrayDesigns.loadDataFilesFrame);
+      TabControl.addTabValidator('settings.info', arrayDesigns.validateArrayDesign);
+      
+      // Num arrays
+      Events.addEventHandler('numArrays', 'keypress', Events.integerOnly);
     }
     else if (pageId == 'view-page')
@@ -109 +120 @@
   }
 
+  arrayDesigns.validateArrayDesign = function()
+  {
+    var frm = document.forms['design'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    else if (!Numbers.isInteger(frm.numArrays.value))
+    {
+      Forms.showNotification(frm.numArrays, "'" + frm.numArrays.value + "' is not a valid number");
+      return false;
+    }
+    else if (parseInt(frm.numArrays.value) <= 0)
+    {
+      Forms.showNotification(frm.numArrays, "Number of arrays must be &gt;0");
+      return false;
+    }
+    return true;
+  }
+
+  arrayDesigns.save = function()
+  {
+    var frm = document.forms['design'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      DataFiles.writeFileActionsToForm(frm);
+      frm.submit();
+    }
+  }
+  
+  arrayDesigns.loadDataFilesFrame = function()
+  {
+    var frm = document.forms['design'];
+    var selected = frm.platform[frm.platform.selectedIndex];
+    var platform = Data.get(selected, 'platform');
+    var variant = Data.get(selected, 'variant');
+    DataFiles.autoLoadEditFrame(platform ? platform : 0, variant ? variant : 0, 0);
+  }
+
   
   return arrayDesigns;

trunk/www/lims/arraydesigns/edit_design.jsp

@@ -41 +41 @@
   import="net.sf.basedb.core.PermissionDeniedException"
   import="net.sf.basedb.core.BaseException"
+  import="net.sf.basedb.core.query.Restrictions"
   import="net.sf.basedb.core.query.Orders"
   import="net.sf.basedb.core.query.Hql"
@@ -122 +123 @@
   {
     design = ArrayDesign.getById(dc, itemId);
+    design.checkPermission(Permission.WRITE);
     cc.setObject("item", design);
     title = "Edit array design -- " + HTML.encodeTags(design.getName());
@@ -134 +136 @@
       deniedPlatform = true;
     }
-    design.checkPermission(Permission.WRITE);
   }
 
@@ -146 +147 @@
   variantQuery.include(Include.REMOVED, Include.NOT_REMOVED);
   variantQuery.order(Orders.asc(Hql.property("name")));
-  variantQuery.setCacheResult(true);
-  ItemResultList<PlatformVariant> variants = variantQuery.list(dc);
+  variantQuery.restrict(Restrictions.eq(Hql.property("platform"), Hql.entityParameter("platform", Item.PLATFORM)));
   
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), design);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js,platforms.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~designs.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "ArrayDesign" tab
-    function validateArrayDesign()
-    {
-      var frm = document.forms['design'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      else if (!Numbers.isInteger(frm.numArrays.value))
-      {
-        Forms.showNotification(frm.numArrays, "'" + frm.numArrays.value + "' is not a valid number");
-        return false;
-      }
-      else if (parseInt(frm.numArrays.value) <= 0)
-      {
-        Forms.showNotification(frm.numArrays, "Number of arrays must be &gt;0");
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['design'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        DataFiles.writeFileActionsToForm(frm);
-        frm.submit();
-      }
-    }
-    
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame();
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame();
-    }
-    
-    function loadDataFilesFrame()
-    {
-      var frm = document.forms['design'];
-      var platform = Platforms.getSelectedPlatform(frm.platform);
-      var variant = Platforms.getSelectedVariant(frm.platform);
-      DataFiles.autoLoadEditFrame(platform ? platform.id : 0, variant ? variant.id : 0, 0);
-    }
-
-    function init()
-    {
-      var frm = document.forms['design'];
-      <%
-      if (design == null)
-      {
-        %>
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-      initPlatforms(<%=currentPlatform == null ? 0 : currentPlatform.getId()%>, <%=currentVariant == null ? 0 : currentVariant.getId()%>);
-    }
-    
-    function initPlatforms(platformId, variantId)
-    {
-      <%
-      for (Platform p : platforms)
-      {
-        if (!p.isRemoved() || p.equals(currentPlatform))
-        {
-          RawDataType rdt = p.isFileOnly() ? null : p.getRawDataType();
-          %>
-          var p<%=p.getId()%> = new Platform(<%=p.getId()%>, '<%=HTML.javaScriptEncode(p.getExternalId())%>', '<%=HTML.javaScriptEncode(p.getName())%>', <%=p.isFileOnly()%>, '<%=rdt == null ? "" : rdt.getId()%>');
-          <%
-        }
-      }
-      for (PlatformVariant v : variants)
-      {
-        Platform p = v.getPlatform();
-        if ((!v.isRemoved() || v.equals(currentVariant)) && (!p.isRemoved() || p.equals(currentPlatform)))
-        {
-          RawDataType rdt = v.isFileOnly() ? null : v.getRawDataType();
-          %>
-          var v<%=v.getId()%> = new Variant(p<%=p.getId()%>, <%=v.getId()%>, '<%=HTML.javaScriptEncode(v.getExternalId())%>', '<%=HTML.javaScriptEncode(v.getName())%>', <%=v.isFileOnly()%>, '<%=rdt == null ? "" : rdt.getId()%>');
-          <%
-        }
-      }
-      %>
-      var frm = document.forms['design'];
-      Platforms.populateList(frm.platform, platformId, variantId);
-    }
-    </script>
+    <style>
+    .platform
+    {
+      font-weight: bold;
+      margin-top: 2px;
+    }
+    </style>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="design">
@@ -264 +173 @@
       position="bottom" active="<%=tabId%>" remember="<%=tabId == null && design != null%>" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Array design" validate="validateArrayDesign()" helpid="arraydesign.edit">
+    <t:tab id="info" title="Array design" helpid="arraydesign.edit">
       <table class="fullform input100">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" data-auto-init="<%=design == null ? "focus-select" : "focus" %>"
+          type="text" name="name" 
           value="<%=HTML.encodeTags(design == null ? Values.getString(cc.getPropertyValue("name"), "New array design") : design.getName())%>" 
           maxlength="<%=ArrayDesign.MAX_NAME_LENGTH%>"></td>
@@ -285 +195 @@
             <%
           }
+          else
+          {
+            for (Platform p : platforms)
+            {
+              if (!p.isRemoved() || p.equals(currentPlatform))
+              {
+                boolean selected = p.equals(currentPlatform) && currentVariant == null;
+                %>
+                <option class="platform"
+                  value="PLATFORM:<%=p.getId()%>"
+                  data-platform="<%=p.getId()%>"
+                  <%=selected ? "selected" : ""%>><%=HTML.encodeTags(p.getName()) %>
+                <%
+              }
+              variantQuery.setEntityParameter("platform", p);
+              List<PlatformVariant> variants = variantQuery.list(dc);
+              PlatformVariant lastVariant = variants.size()>0 ? variants.get(variants.size()-1) : null;
+              for (PlatformVariant v : variants)
+              {
+                if ((!v.isRemoved() || v.equals(currentVariant)) && (!p.isRemoved() || p.equals(currentPlatform)))
+                {
+                  boolean selected = v.equals(currentVariant);
+                  String prefix = v == lastVariant ? " └ " : " ├ ";
+                  %>
+                  <option class="variant"
+                    value="VARIANT:<%=v.getId()%>"
+                    data-platform="<%=p.getId()%>"
+                    data-variant="<%=v.getId()%>"
+                    <%=selected ? "selected" : ""%>><%=prefix%><%=HTML.encodeTags(v.getName()) %>
+                  <%
+                }
+              }
+            }
+          }
           %>
           </select>
@@ -292 +236 @@
       <tr>
         <th>Arrays / slide</th>
-        <td><input class="text required" type="text" name="numArrays" style="width: 15em;"
+        <td><input class="text required" type="text" name="numArrays" id="numArrays" style="width: 15em;"
           value="<%=design == null ? Values.getString(cc.getPropertyValue("numArrays"), "1") : design.getNumArrays()%>" 
-          maxlength="10" onkeypress="return Numbers.integerOnly(event)"></td>
+          maxlength="10"></td>
         <td></td>
       </tr>
@@ -325 +269 @@
     </t:tab>
 
-    <t:tab id="datafiles" title="Data files" helpid="datafiles.edit" activate="loadDataFilesFrame()">
+    <t:tab id="datafiles" title="Data files" helpid="datafiles.edit">
       <jsp:include page="../../common/datafiles/select_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -333 +277 @@
     </t:tab>
 
-    <t:tab id="annotations" title="Annotations" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations" helpid="annotations.edit">
       <jsp:include page="../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -342 +286 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -357 +301 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arraydesigns/index.jsp

@@ -169 +169 @@
     
     String[] pv = request.getParameter("platform").split(":");
-    int platformId = Values.getInt(pv[0], -1);
-    int variantId = pv.length > 1 ? Values.getInt(pv[1], -1) : -1;
-    Platform platform = platformId > 0 ? Platform.getById(dc, platformId) : null;
-    PlatformVariant variant = variantId > 0 ? PlatformVariant.getById(dc, variantId) : null;
+    Platform platform = null;
+    PlatformVariant variant = null;
+    if ("PLATFORM".equals(pv[0]))
+    {
+      int platformId = Values.getInt(pv[1]);
+      platform = Platform.getById(dc, platformId);
+    }
+    else
+    {
+      int variantId = Values.getInt(pv[1]);
+      variant = PlatformVariant.getById(dc, variantId);
+      platform = variant.getPlatform();
+    }
     if (platform != null) cc.setRecent(platform, maxRecent);
     if (variant != null) cc.setRecent(variant, maxRecent);
@@ -394 +403 @@
     
     List<Plate> plates = new java.util.LinkedList<Plate>();
-    String[] plateIds = request.getParameterValues("plates");
-    if (plateIds != null)
-    {
-      for (String pId : plateIds)
-      {
-        plates.add(Plate.getById(dc, Values.getInt(pId)));
-      }
+    for (String pId : request.getParameter("+PLATE").split(","))
+    {
+      plates.add(Plate.getById(dc, Values.getInt(pId)));
     }
     design.setPlateList(plates);

trunk/www/lims/arraydesigns/manage_plates.jsp

@@ -44 +44 @@
   import="net.sf.basedb.clients.web.util.HTML"
   import="net.sf.basedb.util.Values"
+  import="net.sf.basedb.util.json.JsonUtil"
+  import="net.sf.basedb.util.json.JsonConverter"
+  import="org.json.simple.JSONObject"
   import="java.util.List"
   import="java.util.Set"
@@ -62 +65 @@
 {
   ArrayDesign design = ArrayDesign.getById(dc, itemId);
+  design.checkPermission(Permission.WRITE);
   cc.setObject("item", design);
   String title = "Attach plate -- " + HTML.encodeTags(design.getName());
-  if (!design.hasPermission(Permission.WRITE))
+  
+  // Load current plates
+  JSONObject jsonPlates = new JSONObject();
+  jsonPlates.put("itemType", "PLATE");
+  ItemQuery<ArrayDesignPlate> platesQuery = design.getArrayDesignPlates();
+  platesQuery.include(Include.MINE, Include.SHARED, Include.OTHERS, Include.IN_PROJECT);
+  platesQuery.order(Orders.asc(Hql.property("position")));
+  jsonPlates.put("items", JsonUtil.toArray(platesQuery.iterate(dc), new JsonConverter<ArrayDesignPlate>()
   {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
-  
+    public Object convert(ArrayDesignPlate adp)
+    {
+      Plate plate = adp.getPlate();
+      JSONObject json = new JSONObject();
+      json.put("id", plate.getId());
+      json.put("name", plate.getName());
+      return json;
+    }
+  }));
   %>
-
   <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js,linkitems.js" styles="tabcontrol.css">
-    <script>
-    // Validate the "Plates" tab
-    function validatePlates()
-    {
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['design'];
-      if (validatePlates())
-      {
-        var plates = frm.plates;
-        for (var i = 0; i < plates.length; ++i) // >
-        {
-          plates[i].selected = true;
-        }
-        frm.submit();
-      }
-    }
-    
-    function addPlatesOnClick()
-    {
-      var ids = Link.getListIds(document.forms['design'].plates, '');
-      var excludes = ids.join(',');
-      var url = '../plates/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectmultiple&callback=addPlateCallback';
-      url += '&excludes='+excludes;
-      Main.openPopup(url, 'AddPlates', 1050, 700);
-    }
-
-    function addPlateCallback(plateId, name)
-    {
-      var item = Link.getItem('', plateId);
-      if (!item) item = new Item('', plateId, name);
-      Link.addItem(document.forms['design'].plates, item);
-    }
-    
-    function removePlatesOnClick()
-    {
-      Link.removeSelected(document.forms['design'].plates);
-    }
-
-    function init()
-    {
-      var frm = document.forms['design'];
-      var plates = frm.plates;
-      <%
-      ItemQuery<ArrayDesignPlate> platesQuery = design.getArrayDesignPlates();
-      platesQuery.include(Include.MINE, Include.SHARED, Include.OTHERS, Include.IN_PROJECT);
-      platesQuery.order(Orders.asc(Hql.property("position")));
-      ItemResultList<ArrayDesignPlate> plates = platesQuery.list(dc);
-      for (ArrayDesignPlate adPlate : plates)
-      {
-        Plate plate = adPlate.getPlate();
-        %>
-        Link.addNewItem(plates, new Item('', <%=plate.getId()%>, '<%=HTML.javaScriptEncode(plate.getName())%>'));
-        <%
-      }
-      %>
-    }
-    </script>
-  </base:head>
-  <base:body onload="init()">
+  <base:head scripts="linkitems-2.js,~manage_plates.js" />
+  <base:body>
     <h1><%=title%> <base:help helpid="arraydesign.edit.plates" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="design">
@@ -157 +109 @@
             <base:buttongroup vertical="true">
               <base:button
-                onclick="Forms.moveListOptions(document.forms['design'].plates, false)"
+                id="moveUp"
+                data-down="0"
                 image="move_up.png" 
                 tooltip="Move up" 
@@ -163 +116 @@
               />
               <base:button 
-                onclick="Forms.moveListOptions(document.forms['design'].plates, true)" 
+                id="moveDown"
+                data-down="1"
                 image="move_down.png" 
                 tooltip="Move down" 
@@ -171 +125 @@
           </td>
           <td>
-            <select name="plates" size="15" multiple>
+            <select name="plates" id="plates" 
+              class="auto-init"
+              data-auto-init="link-container"
+              data-initial-items="[<%=HTML.encodeTags(jsonPlates.toJSONString()) %>]"
+              size="15" multiple>
             </select>
           </td>
@@ -177 +135 @@
             <base:buttongroup vertical="true">
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="add-link"
+                data-list-id="plates"
+                data-item-type="PLATE"
                 style="width: 12em;"
-                onclick="addPlatesOnClick()" 
                 title="Add plates..." 
                 tooltip="Add plates to be used"
               />
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="remove-link"
+                data-list-id="plates"
                 style="width: 12em;"
-                onclick="removePlatesOnClick()" 
                 title="Remove" 
                 tooltip="Remove the selected plates"
@@ -202 +163 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arrayslides/create_wizard.jsp

@@ -23 +23 @@
   @version 2.0
 --%>
-
-
-
 <%@ page pageEncoding="UTF-8" session="false"
   import="net.sf.basedb.core.SessionControl"
@@ -44 +41 @@
   import="net.sf.basedb.util.Values"
   import="java.util.List"
-  
 %>
 <%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
@@ -62 +58 @@
 { 
   String title = null;
-  ArraySlide slide = null;
   String name = "New slides.";
   
@@ -85 +80 @@
   {
     name = HTML.encodeTags(currentArrayBatch.getName()) + ".";
-  }
-
-  if (slide != null && !slide.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
-    
+  }   
   %>
-
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css,toolbar.css">
-    <script>
-    // Validate the "ArraySlide" tab
-    function validateArraySlide()
-    {
-      var frm = document.forms['WizardStep1'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (frm.arraybatch_id && !frm.arraybatch_id.value)
-      {
-        Forms.showNotification('arraybatch_id.select', 'You must select an array batch');
-        return false;
-      }
-      if (Main.trimString(frm.quantity.value) == '')
-      {
-        Forms.showNotification(frm.quantity, 'You must enter a quantity of slides');
-        return false;
-      }
-      if (frm.quantity.value < 1 || frm.quantity.value > 999)
-      {
-        Forms.showNotification(frm.quantity, 'The quantity of array slides to be created must be between 1 and 999');
-        return false;
-      }
-      return true;
-    }
-    
-    function validateNames()
-    {
-      var frm = document.forms['WizardStep2'];
-      var quantity = parseInt(frm.quantity.value);
-      for (i = 0; i < quantity; i++)
-      {
-        var name = frm['name'+i];
-        if (Main.trimString(name.value) == '')
-        {
-          Forms.showNotification(name, 'You must enter a name for all slides', null, 'pointer-left');
-          return false;
-        }
-      }
-      return true;
-    }
-    
-    // Submit the step 1 form and continue to step 2
-    function nextStep()
-    {     
-      if (validateArraySlide())
-      {
-        var frm = document.forms['WizardStep1'];
-        frm.submit();
-      }
-    }   
-    // Submit and finish the wizard
-    function saveSettings()
-    {
-      if (validateNames())
-      {
-        var frm = document.forms['WizardStep2'];    
-        frm.submit();
-      }
-    }
-
-    function selectArrayBatchOnClick()
-    {
-      var frm = document.forms['WizardStep1'];
-      var url = '../../lims/arraybatches/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setArrayBatchCallback';
-      if (frm.arraybatch_id.length > 0) url += '&item_id='+frm.arraybatch_id[0].value;
-      Main.openPopup(url, 'SelectArrayBatch', 1050, 700);
-    }
-    function setArrayBatchCallback(id, name)
-    {
-      var frm = document.forms['WizardStep1'];
-      var list = frm.arraybatch_id;
-      if (list.length < 1 || list[0].value == '0') // >
-      {
-        Forms.addListOption(list, 0, new Option());
-      }
-      list[0].value = id;
-      list[0].text = name;
-      list.selectedIndex = 0;
-    }
-    
-    function pasteMultiple(prefix)
-    {
-      Main.openPopup('paste_multiple.jsp?ID=<%=ID%>&form=WizardStep2&prefix=' + prefix, 'PasteMultiple', 400, 600);
-    }
-
-    function clearAll(prefix)
-    {
-      var frm = document.forms['WizardStep2'];
-      var i = 0;
-      var field;
-      while(field = frm[prefix+i])
-      {
-        field.value = '';
-        i++;
-      }
-    }
-    
-    function init()
-    {         
-      var frm = document.forms['WizardStep1'];
-      if (frm != null)
-      {
-        frm.name.focus();
-        frm.name.select();
-      }
-      else
-      {
-        frm = document.forms['WizardStep2'];
-        frm.barcode1.focus();
-      }
-    }
-    </script>
-  </base:head>
-  <base:body onload="init()">
+  <base:page type="popup" title="<%=title%>" id="<%=HTML.encodeTags(cmd)%>">
+  <base:head scripts="~wizard.js" />
+  <base:body>
     <%
     //Wizard step1
@@ -219 +90 @@
     {
     %>        
-      <h1><%=title%> <base:help tabcontrol="settings" /></h1>
+      <h1><%=title%> <base:help helpid="arrayslide.createwizard.1" /></h1>
       <form action="create_wizard.jsp?ID=<%=ID%>" method="post" name="WizardStep1">
       <input type="hidden" name="cmd" value="WizardStep2">
@@ -227 +98 @@
         <tr>
           <th>Name</th>
-          <td><input class="text required" type="text" name="name"
+          <td><input class="text required auto-init" data-auto-init="focus-select"
+            type="text" name="name"
             value="<%=name%>"
             maxlength="<%=ArraySlide.MAX_NAME_LENGTH%>"></td>
@@ -243 +115 @@
               recent="<%=recentArrayBatches%>"
               newitem="true"
-              onselect="selectArrayBatchOnClick()"
             />
           </td>
@@ -250 +121 @@
         <tr>
           <th>Quantity</th>
-          <td><input class="text required" type="text" name="quantity" value="50" 
-             maxlength="3" style="width: 5em;"
-            onkeypress="return Numbers.integerOnly(event)"><i> (1-999)</i></td>
+          <td><input class="text required" type="text" name="quantity" id="quantity" 
+            value="50" maxlength="3" style="width: 5em;"><i> (1-999)</i></td>
           <td></td>
         </tr>
         <tr>
           <th>Start at</th>
-          <td><input class="text" type="text" name="start_at" value="1" 
-            maxlength="10" style="width: 10em;"
-            onkeypress="return Numbers.integerOnly(event)">
+          <td><input class="text" type="text" name="start_at" id="start_at" 
+            value="1" maxlength="10" style="width: 10em;">
           </td>
           <td></td>
@@ -266 +135 @@
           <th class="subprompt">- pad size</th>
           <td>
-            <input class="text" type="text" name="pad_length" value="" 
-            maxlength="1" style="width: 10em;"
-            onkeypress="return Numbers.integerOnly(event)">
+            <input class="text" type="text" name="pad_length" id="pad_length" 
+            value="" maxlength="1" style="width: 10em;">
           </td>
           <td>
@@ -307 +175 @@
       int startAt = Values.getInt(request.getParameter("start_at"), 1);
       %>  
-      <h1><%=title%> <base:help tabcontrol="settings" /></h1>
+      <h1><%=title%> <base:help helpid="arrayslide.createwizard.2" /></h1>
       <form action="index.jsp?ID=<%=ID%>" method="post" name="WizardStep2">       
       <input type="hidden" name="cmd" value="CreateItems">
@@ -326 +194 @@
             <th>&nbsp;</th>
             <th>Name: 
-              <base:icon image="paste.png" onclick="pasteMultiple('name')" 
-                tooltip="Paste multiple values in a single large textarea" />
-              <base:icon image="clear_down.png" onclick="clearAll('name')" 
-                tooltip="Clear all values" />
+              <base:icon 
+                id="pasteMultipleName"
+                data-form-prefix="name"
+                image="paste.png" 
+                tooltip="Paste multiple values in a single large textarea" 
+              />
+              <base:icon 
+                id="clearAllNames" 
+                data-form-prefix="name"
+                image="clear_down.png" 
+                tooltip="Clear all values" 
+              />
             </th>
             <th>Barcode:
-              <base:icon image="paste.png" onclick="pasteMultiple('barcode')" 
-                tooltip="Paste multiple values in a single large textarea" />
-              <base:icon image="clear_down.png" onclick="clearAll('barcode')" 
-                tooltip="Clear all values" />
+              <base:icon 
+                id="pasteMultipleBarcode"
+                data-form-prefix="barcode"
+                image="paste.png"
+                tooltip="Paste multiple values in a single large textarea" 
+              />
+              <base:icon 
+                id="clearAllBarcodes" 
+                data-form-prefix="barcode"
+                image="clear_down.png"
+                tooltip="Clear all values" 
+              />
             </th>
           </tr>
@@ -381 +265 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings();" title="Save" visible="<%=cmd.equals("WizardStep2")%>" />
-      <base:button onclick="nextStep();" title="Next" image="gonext.png" visible="<%=cmd.equals("WizardStep1")%>" />
-      <base:button onclick="window.close();" title="Cancel" />
+      <base:button id="btnSave" title="Save" visible="<%=cmd.equals("WizardStep2")%>" />
+      <base:button id="btnNext" title="Next" image="gonext.png" visible="<%=cmd.equals("WizardStep1")%>" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arrayslides/edit_slide.jsp

@@ -97 +97 @@
   {
     slide = ArraySlide.getById(dc, itemId);
+    slide.checkPermission(Permission.WRITE);
     cc.setObject("item", slide);
     title = "Edit array slide -- " + HTML.encodeTags(slide.getName());
@@ -108 +109 @@
     }
   }
-  if (slide != null && !slide.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
   
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), slide);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~slides.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "ArraySlide" tab
-    function validateArraySlide()
-    {
-      var frm = document.forms['slide'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (frm.arraybatch_id && !frm.arraybatch_id.value)
-      {
-        Forms.showNotification('arraybatch_id.select', 'You must select an array batch');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['slide'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        frm.submit();
-      }
-    }
-    
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame();
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame(getParents());
-    }
-    
-    function getParents()
-    {
-      var frm = document.forms['slide'];
-      var parents = new Array();
-      if (frm.arraybatch_id)
-      {
-        var batchId = Math.abs(parseInt(frm.arraybatch_id[frm.arraybatch_id.selectedIndex].value));
-        if (batchId > 0) parents[parents.length] = 'ARRAYBATCH:'+batchId;
-      }
-      return parents;
-    }
-    
-    function selectArrayBatchOnClick()
-    {
-      var frm = document.forms['slide'];
-      var url = '../../lims/arraybatches/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setArrayBatchCallback';
-      if (frm.arraybatch_id.length > 0) url += '&item_id='+frm.arraybatch_id[0].value;
-      Main.openPopup(url, 'SelectArrayBatch', 1050, 700);
-    }
-    function setArrayBatchCallback(id, name)
-    {
-      var frm = document.forms['slide'];
-      var list = frm.arraybatch_id;
-      if (list.length < 1 || list[0].value == '0') // >
-      {
-        Forms.addListOption(list, 0, new Option());
-      }
-      list[0].value = id;
-      list[0].text = name;
-      list.selectedIndex = 0;
-    }
-
-    function init()
-    {
-      var frm = document.forms['slide'];
-      <%
-      if (slide == null)
-      {
-        %>
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="slide">
@@ -215 +125 @@
     <t:tabcontrol id="settings"
       subclass="content dialogtabcontrol"
-      position="bottom"  remember="<%=slide != null%>" 
+      position="bottom" remember="<%=slide != null%>" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Array slide" validate="validateArraySlide()" helpid="arrayslide.edit">
+    <t:tab id="info" title="Array slide" helpid="arrayslide.edit">
       <table class="fullform input100">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" data-auto-init="<%=slide == null ? "focus-select" : "focus" %>"
+          type="text" name="name" 
           value="<%=HTML.encodeTags(slide == null ? Values.getString(cc.getPropertyValue("name"), "New array slide") : slide.getName())%>" 
           maxlength="<%=ArraySlide.MAX_NAME_LENGTH%>"></td>
@@ -261 +172 @@
               recent="<%=recentArrayBatches%>"
               newitem="true"
-              onselect="selectArrayBatchOnClick()"
             />
             <%
@@ -271 +181 @@
       <tr>
         <th>Index</th>
-        <td><input class="text" type="text" name="batch_index" value="<%=slide == null ? Values.getInt(cc.getPropertyValue("batchIndex"), maxIndex + 1) : slide.getBatchIndex()%>" 
-          maxlength="10" style="width: 15em;"
-          onkeypress="return Numbers.integerOnly(event)"></td>
+        <td><input class="text" type="text" name="batch_index" id="batch_index"
+          value="<%=slide == null ? Values.getInt(cc.getPropertyValue("batchIndex"), maxIndex + 1) : slide.getBatchIndex()%>" 
+          maxlength="10" style="width: 15em;"></td>
         <td></td>
       </tr>
@@ -289 +199 @@
     </t:tab>
     
-    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations &amp; parameters" helpid="annotations.edit">
       <jsp:include page="../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -298 +208 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -313 +223 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arrayslides/paste_multiple.jsp

@@ -59 +59 @@
 %>
 
-  <base:page type="popup" title="<%=title%>">
-  <base:head>
-    <script>
-    // Validate the "ArraySlide" tab
-    function init()
-    {
-      var pfrm = window.opener.document.forms['<%=form%>'];
-      var frm = document.forms['paste'];
-      if (pfrm)
-      {
-        var i = 0;
-        var text = '';
-        while (pfrm['<%=prefix%>'+i])
-        {
-          text += pfrm['<%=prefix%>'+i].value + '\n';
-          i++;
-        }
-        frm['text'].value = text;
-      }
-    }
-
-    // Submit the form
-    function save()
-    {
-      var pfrm = window.opener.document.forms['<%=form%>'];
-      var frm = document.forms['paste'];
-      if (pfrm)
-      {
-        var text = frm['text'].value.split('\n');
-        for (var i = 0; i < text.length; ++i)
-        {
-          var field = '<%=prefix%>' + i;
-          if (pfrm[field]) pfrm[field].value = text[i];
-        }
-        // Clear any remaining fields
-        while (pfrm['<%=prefix%>'+i])
-        {
-          pfrm['<%=prefix%>'+i].value = '';
-          i++;
-        }
-      }
-      window.close();
-    }
-    </script>
-  </base:head>
-  <base:body onload="init()">
+  <base:page type="popup" title="<%=title%>" id="paste-multiple">
+  <base:head scripts="~wizard.js" />
+  <base:body>
     <h1><%=title%> <base:help helpid="arrayslide.createwizard.pastemultiple" /></h1>
+    <div id="page-data" class="datacontainer"
+      data-form-name="<%=form %>" 
+      data-form-prefix="<%=prefix %>"
+    ></div>
     <form name="paste">
-
     <div class="content">
       <table style="width: 100%; height: 100%;">
@@ -113 +73 @@
         <td class="padded filled">
         <i>
-          Enter one name or barcode per line. Click <b>Save</b> to store the
+          Enter one name or barcode per line. Click <b>Ok</b> to store the
           result in the parent form.
         </i>
@@ -130 +90 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="save()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnOk" title="Ok" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/arrayslides/slides.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', arraySlides.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', Annotations.autoLoadEditFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', arraySlides.loadInheritedAnnotationsFrame);
+      TabControl.addTabValidator('settings.info', arraySlides.validateArraySlide);
+      
+      // Array batch
+      Buttons.addClickHandler('arraybatch_id.select', arraySlides.selectArrayBatch);
+      Events.addEventHandler('arraybatch_id', 'base-selected', arraySlides.setArrayBatchCallback);
+      
+      // Batch order
+      Events.addEventHandler('batch_index', 'keypress', Events.integerOnly);
     }
     else if (pageId == 'view-page')
@@ -83 +97 @@
   }
   
+  arraySlides.validateArraySlide = function()
+  {
+    var frm = document.forms['slide'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    if (frm.arraybatch_id && !frm.arraybatch_id.value)
+    {
+      Forms.showNotification('arraybatch_id.select', 'You must select an array batch');
+      return false;
+    }
+    return true;
+  }
+
+  arraySlides.save = function()
+  {
+    var frm = document.forms['slide'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      frm.submit();
+    }
+  }
+  
+  arraySlides.loadInheritedAnnotationsFrame = function()
+  {
+    Annotations.autoLoadInheritFrame(arraySlides.getParents());
+  }
+  
+  arraySlides.getParents = function()
+  {
+    var frm = document.forms['slide'];
+    var parents = new Array();
+    if (frm.arraybatch_id)
+    {
+      var batchId = Math.abs(parseInt(frm.arraybatch_id[frm.arraybatch_id.selectedIndex].value));
+      if (batchId > 0) parents[parents.length] = 'ARRAYBATCH:'+batchId;
+    }
+    return parents;
+  }
+
+  arraySlides.selectArrayBatch = function()
+  {
+    var frm = document.forms['slide'];
+    var url = '';
+    if (frm.arraybatch_id.length > 0) 
+    {
+      url += '&item_id='+frm.arraybatch_id[0].value;
+    }
+    Dialogs.selectItem('ARRAYBATCH', 'arraybatch_id', 0, url);
+  }
+  
+  arraySlides.setArrayBatchCallback = function(event)
+  {
+    var frm = document.forms['slide'];
+    var list = frm.arraybatch_id;
+    if (list.length < 1 || list[0].value == '0')
+    {
+      Forms.addListOption(list, 0, new Option());
+    }
+    list[0].value = event.detail.id;
+    list[0].text = event.detail.name;
+    list.selectedIndex = 0;
+  }
+
+  
   return arraySlides;
 }();

trunk/www/lims/platemappings/edit_mapping.jsp

@@ -94 +94 @@
   {
     mapping = PlateMapping.getById(dc, itemId);
+    mapping.checkPermission(Permission.WRITE);
     cc.setObject("item", mapping);
     title = "Edit plate mapping -- " + HTML.encodeTags(mapping.getName());
@@ -114 +115 @@
     }
   }
-  if (mapping != null && !mapping.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
-  
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), mapping);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~mappings.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "PlateMapping" tab
-    function validatePlateMapping()
-    {
-      var frm = document.forms['mapping'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['mapping'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        frm.submit();
-      }
-    }
-
-    function updateImage()
-    {
-      var frm = document.forms['mapping'];
-      var newSrc = frm.image.value;
-      var imageSrc = '../../images/platemappings/'+newSrc;
-      var image = document.getElementById('mappingImage');
-      if (image && newSrc && imageSrc != image.src)
-      {
-        image.src = imageSrc;
-      }
-    }
-
-    function init()
-    {
-      var frm = document.forms['mapping'];
-      <%
-      if (mapping == null)
-      {
-        %>
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="mapping">
@@ -186 +132 @@
       position="bottom" remember="<%=mapping != null%>"
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Plate mapping" validate="validatePlateMapping()" helpid="platemapping.edit">
+    <t:tab id="info" title="Plate mapping" helpid="platemapping.edit">
       <table class="fullform input100 smaller">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" data-auto-init="<%=mapping == null ? "focus-select" : "focus" %>"
+          type="text" name="name" 
           value="<%=HTML.encodeTags(mapping == null ? Values.getString(cc.getPropertyValue("name"), "New plate mapping") : mapping.getName())%>" 
           maxlength="<%=PlateMapping.MAX_NAME_LENGTH%>"></td>
@@ -202 +149 @@
           {
             %>
-            <input class="text required" type="text" name="source_count" style="width: 15em;"
-              value="<%=Values.getInt(cc.getPropertyValue("sourceCount"), 1)%>" 
-              maxlength="10" onkeypress="return Numbers.integerOnly(event)">
+            <input class="text required" type="text" name="source_count" id="source_count"
+              style="width: 15em;" maxlength="10"
+              value="<%=Values.getInt(cc.getPropertyValue("sourceCount"), 1)%>">
             plate(s) of
             <select name="sourcegeometry_id" class="required">
@@ -237 +184 @@
           {
             %>
-            <input class="text required" type="text" name="destination_count" style="width: 15em;"
-              value="<%=Values.getInt(cc.getPropertyValue("destinationCount"), 1)%>" 
-              maxlength="10" onkeypress="return Numbers.integerOnly(event)">
+            <input class="text required" type="text" name="destination_count" id="destination_count" 
+              style="width: 15em;" maxlength="10"
+              value="<%=Values.getInt(cc.getPropertyValue("destinationCount"), 1)%>">
             plate(s) of
             <select name="destinationgeometry_id" class="required">
@@ -268 +215 @@
         <th>Image</th>
         <td>
-          <input class="text" type="text" name="image" 
+          <input class="text" type="text" name="image" id="image"
             value="<%=HTML.encodeTags(mapping == null ? "" : mapping.getImage())%>" 
-            maxlength="<%=PlateMapping.MAX_IMAGE_LENGTH%>" 
-            onBlur="updateImage()">
+            maxlength="<%=PlateMapping.MAX_IMAGE_LENGTH%>">
             <br><br>
             <%
@@ -304 +250 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/platemappings/mappings.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', plateMappings.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabValidator('settings.info', plateMappings.validatePlateMapping);
+      
+      // Count
+      Events.addEventHandler('source_count', 'keypress', Events.integerOnly);
+      Events.addEventHandler('destination_count', 'keypress', Events.integerOnly);
+      
+      // Image
+      Events.addEventHandler('image', 'blur', plateMappings.updateImage);
     }
     else if (pageId == 'view-page')
@@ -72 +84 @@
     }
   }
-    
+  
+  
+  plateMappings.validatePlateMapping = function()
+  {
+    var frm = document.forms['mapping'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    return true;
+  }
+
+  // Submit the form
+  plateMappings.save = function()
+  {
+    var frm = document.forms['mapping'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      frm.submit();
+    }
+  }
+
+  plateMappings.updateImage = function()
+  {
+    var frm = document.forms['mapping'];
+    var newSrc = frm.image.value;
+    var imageSrc = '../../images/platemappings/'+newSrc;
+    var image = Doc.element('mappingImage');
+    if (image && newSrc && imageSrc != image.src)
+    {
+      image.src = imageSrc;
+    }
+  }
+
   return plateMappings;
 }();

trunk/www/lims/plates/edit_plate.jsp

@@ -56 +56 @@
 <%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
 <%@ taglib prefix="t" uri="/WEB-INF/tab.tld" %>
+<%@ taglib prefix="ext" uri="/WEB-INF/extensions.tld" %>
 <%
 final Item itemType = Item.PLATE;
@@ -90 +91 @@
   {
     plate = Plate.getById(dc, itemId);
+    plate.checkPermission(Permission.WRITE);
     cc.setObject("item", plate);
     title = "Edit plate -- " + HTML.encodeTags(plate.getName());
@@ -101 +103 @@
     }
   }
-  if (plate != null && !plate.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
   
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), plate);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~plates.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "Plate" tab
-    function validatePlate()
-    {
-      var frm = document.forms['plate'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (frm.platetype_id && frm.platetype_id.length == 0)
-      {
-        Forms.showNotification('platetype_id.select', 'You must select a plate type');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['plate'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        frm.submit();
-      }
-    }
-    
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame();
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame();
-    }
-
-    function selectPlateTypeOnClick()
-    {
-      var frm = document.forms['plate'];
-      var url = '../platetypes/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setPlateTypeCallback';
-      if (frm.platetype_id.length > 0) url += '&item_id='+frm.platetype_id[0].value;
-      Main.openPopup(url, 'SelectArrayBatch', 1050, 700);
-    }
-    function setPlateTypeCallback(plateTypeId, name)
-    {
-      var frm = document.forms['plate'];
-      if (frm.platetype_id.length < 1) // >
-      {
-        frm.platetype_id[frm.platetype_id.length] = new Option();
-      }
-      frm.platetype_id[0].value = plateTypeId;
-      frm.platetype_id[0].text = name;
-      frm.platetype_id.selectedIndex = 0;
-    }
-
-    function init()
-    {
-      var frm = document.forms['plate'];
-      <%
-      if (plate == null)
-      {
-        %>
-        frm.name.focus();
-        frm.name.select();
-        <%
-      }
-      %>
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
     <form action="index.jsp?ID=<%=ID%>" method="post" name="plate">
@@ -195 +119 @@
     <t:tabcontrol id="settings" 
       subclass="content dialogtabcontrol"
-      position="bottom"  remember="<%=plate != null%>" 
+      position="bottom" remember="<%=plate != null%>" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Plate" validate="validatePlate()" helpid="plate.edit">
+    <t:tab id="info" title="Plate" helpid="plate.edit">
       <table class="fullform input100 smaller">
       <tr>
         <th>Name</th>
-        <td><input class="text required" type="text" name="name" 
+        <td><input class="text required auto-init" data-auto-init="<%=plate == null ? "focus-select" : "focus" %>" type="text" name="name" 
           value="<%=HTML.encodeTags(plate == null ? Values.getString(cc.getPropertyValue("name"), "New plate") : plate.getName())%>" 
           maxlength="<%=Plate.MAX_NAME_LENGTH%>"></td>
@@ -236 +160 @@
             <tr>
             <td>
-              <select name="platetype_id" size="1" 
+              <select name="platetype_id" id="platetype_id" size="1" 
                 <%=!readCurrentPlateType ? "disabled readonly class=\"disabled\"" : "class=\"required\""%>
                 style="width: 20em;">
@@ -258 +182 @@
               </select>
             </td>
-            <td><base:button onclick="selectPlateTypeOnClick()" title="Select&hellip;" /></td>
+            <td><base:button id="platetype_id.select" title="Select&hellip;" /></td>
             </tr>
             </table>
@@ -280 +204 @@
     </t:tab>
     
-    <t:tab id="annotations" title="Annotations" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations" helpid="annotations.edit">
       <jsp:include page="../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -289 +213 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -304 +228 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/plates/events/edit_event.jsp

@@ -125 +125 @@
   {
     event = PlateEvent.getById(dc, itemId);
+    event.checkPermission(Permission.WRITE);
     eventType = event.getPlateEventType();
     eventDate = event.getEventDate();
@@ -154 +155 @@
     }
   }
-  
-  if (event != null && !event.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
-  
-  
+    
   Formatter<Date> dateFormatter = FormatterFactory.getDateFormatter(sc);
   String dateFormat = FormatterSettings.getDateFormat(sc);
@@ -168 +163 @@
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~events.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "Event" tab
-    function validateEvent()
-    {
-      var frm = document.forms['event'];
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['event'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        frm.submit();
-      }
-    }
-    
-    var protocolTypeFilter = <%=currentProtocolType != null ? currentProtocolType.getId() : 0%>;    
-    function selectProtocolOnClick()
-    {
-      var frm = document.forms['event'];
-      var url = '../../../admin/protocols/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setProtocolCallback';
-      if (frm.protocol_id.length > 1) 
-      {
-        var id = Math.abs(parseInt(frm.protocol_id[1].value));        
-        url += '&item_id='+id;
-      }
-      if (protocolTypeFilter)
-      {
-        url += '&resetTemporary=1&tmpfilter:INT:itemSubtype='+protocolTypeFilter;
-      }
-      Main.openPopup(url, 'SelectProtocol', 1050, 700);
-    }
-    function setProtocolCallback(id, name)
-    {
-      var frm = document.forms['event'];
-      var list = frm.protocol_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-    function selectHardwareOnClick()
-    {
-      var frm = document.forms['event'];
-      var url = '../../../admin/hardware/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectone&callback=setHardwareCallback';
-      if (frm.hardware_id.length > 1)
-      {
-        var id = Math.abs(parseInt(frm.hardware_id[1].value));
-        url += '&item_id='+id;
-      }
-      Main.openPopup(url, 'SelectHardware', 1050, 700);
-    }
-    function setHardwareCallback(id, name)
-    {
-      var frm = document.forms['event'];
-      var list = frm.hardware_id;
-      if (list.length < 2 || list[1].value == '0') // >
-      {
-        Forms.addListOption(list, 1, new Option());
-      }
-      list[1].value = id;
-      list[1].text = name;
-      list.selectedIndex = 1;
-    }
-
-    function init()
-    {
-      var frm = document.forms['event'];
-      plateEventTypeOnChange();
-    }
-    <%
-    if (event == null)
-    {
-      %>
-      var protocolTypes = new Array();
-      <%
-      for (PlateEventType pet : eventTypes)
-      {
-        try
-        {
-          ItemSubtype pt = pet.getProtocolType();
-          if (pt != null)
-          {
-            %>
-            protocolTypes['P<%=pet.getId()%>'] = <%=pt.getId()%>;
-            <%
-          }
-        }
-        catch (Throwable t)
-        {}
-      }
-    }
-    %>
-    function plateEventTypeOnChange()
-    {
-      var frm = document.forms['event'];
-      if (frm.plateeventtype_id)
-      {
-        var eventTypeId = frm.plateeventtype_id[frm.plateeventtype_id.selectedIndex].value;
-        protocolTypeFilter = protocolTypes['P'+eventTypeId];
-      }
-    }
-    </script>
   </base:head>
-  <base:body onload="init()">
+  <base:body>
     <h1><%=title%> <base:help tabcontrol="settings" /></h1>
+    <div id="page-data" class="datacontainer"
+      data-protocol-type="<%=currentProtocolType == null ? 0 : currentProtocolType.getId() %>"
+    ></div>
+    
     <form action="index.jsp?ID=<%=ID%>" method="post" name="event">
     <input type="hidden" name="cmd" value="UpdateItem">
@@ -291 +182 @@
       position="bottom" remember="<%=event != null%>"
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Event" validate="validateEvent()" helpid="plateevent.edit">
+    <t:tab id="info" title="Event" helpid="plateevent.edit">
       <table class="fullform input100 smaller">
       <tr>
@@ -300 +191 @@
           {
             %>
-            <select name="plateeventtype_id" class="required" onchange="plateEventTypeOnChange()">
+            <select name="plateeventtype_id" class="required">
             <%
             for (PlateEventType pet : eventTypes)
             {
+              ItemSubtype eventProtocolType = null;
+              try
+              {
+                eventProtocolType = pet.getProtocolType();
+              }
+              catch (Throwable t)
+              {}
               %>
-              <option value="<%=pet.getId()%>"><%=pet.getOrdinal()%>. <%=HTML.encodeTags(pet.getName())%>
+              <option value="<%=pet.getId()%>"
+                data-protocol-type="<%=eventProtocolType == null ? 0 : eventProtocolType.getId()%>"><%=pet.getOrdinal()%>. <%=HTML.encodeTags(pet.getName())%>
               <%
             }
@@ -356 +255 @@
             recent="<%=recentProtocols%>"
             newitem="<%=event == null%>"
-            onselect="selectProtocolOnClick()"
           />
         </td>
@@ -372 +270 @@
             recent="<%=recentHardware%>"
             newitem="<%=event == null%>"
-            onselect="selectHardwareOnClick()"
           />
         </td>
@@ -397 +294 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSabe" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/plates/events/events.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', plateEvents.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabValidator('settings.info', plateEvents.validateEvent);
+
+      // Protocol
+      Buttons.addClickHandler('protocol_id.select', plateEvents.selectProtocol);
+      Events.addEventHandler('protocol_id', 'base-selected', plateEvents.setProtocolCallback);
+      
+      // Hardware
+      Buttons.addClickHandler('hardware_id.select', plateEvents.selectHardware);
+      Events.addEventHandler('hardware_id', 'base-selected', plateEvents.setHardwareCallback);
     }
     else if (pageId == 'view-page')
@@ -89 +102 @@
 
 
+  plateEvents.validateEvent = function()
+  {
+    return true;
+  }
+
+  // Submit the form
+  plateEvents.save = function()
+  {
+    var frm = document.forms['event'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      frm.submit();
+    }
+  }
+
+  plateEvents.selectHardware = function()
+  {
+    var frm = document.forms['event'];
+    var url = '';
+    if (frm.hardware_id.length > 1)
+    {
+      var id = Math.abs(parseInt(frm.hardware_id[1].value));
+      url += '&item_id='+id;
+    }
+    Dialogs.selectItem('HARDWARE', 'hardware_id', 0, url);
+  }
+  
+  plateEvents.setHardwareCallback = function(event)
+  {
+    var frm = document.forms['event'];
+    var list = frm.hardware_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+
+  plateEvents.selectProtocol = function()
+  {
+    var frm = document.forms['event'];
+    var url = '';
+    if (frm.protocol_id.length > 1) 
+    {
+      var id = Math.abs(parseInt(frm.protocol_id[1].value));        
+      url += '&item_id='+id;
+    }
+    
+    var protocolTypeId;
+    if (frm.plateeventtype_id)
+    {
+      protocolTypeId = Data.int(frm.plateeventtype_id[frm.plateeventtype_id.selectedIndex], 'protocol-type');
+    }
+    else 
+    {
+      protocolTypeId = Data.int('page-data', 'protocol-type');
+      
+    }
+    if (protocolTypeId)
+    {
+      url += '&resetTemporary=1&tmpfilter:INT:itemSubtype='+protocolTypeId;
+    }
+    Dialogs.selectItem('PROTOCOL', 'protocol_id', 0, url);
+  }
+  
+  plateEvents.setProtocolCallback = function(event)
+  {
+    var frm = document.forms['event'];
+    var list = frm.protocol_id;
+    if (list.length < 2 || list[1].value == '0')
+    {
+      Forms.addListOption(list, 1, new Option());
+    }
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
+    list.selectedIndex = 1;
+  }
+
   return plateEvents;
 }();

trunk/www/lims/plates/index.jsp

@@ -329 +329 @@
     
     List<Plate> sourcePlates = new ArrayList<Plate>(plateMapping.getSourceCount());
-    for (String pId : request.getParameter("mergePlates").split(","))
+    for (String pId : request.getParameter("+PLATE").split(","))
     {
       sourcePlates.add(Plate.getById(dc, Values.getInt(pId)));

trunk/www/lims/plates/merge_plates.jsp

@@ -53 +53 @@
   String title = "Merge plates -- step 1 of 2 -- Select mapping";
   
-  
-  
   // Load recently used items
   List<PlateMapping> recentPlateMappings = (List<PlateMapping>)cc.getRecent(dc, Item.PLATEMAPPING);
@@ -60 +58 @@
   %>
 
-  <base:page type="popup" title="<%=title%>">
-  <base:head>
-    <script>
-    // Validate the entered information
-    function validate()
-    {
-      var frm = document.forms['merge'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (!frm.platemapping_id.value)
-      {
-        Forms.showNotification('platemapping_id.select', 'You must select a plate mapping');
-        return false;
-      }
-      if (!frm.platetype_id.value)
-      {
-        Forms.showNotification('platetype_id.select', 'You must select a plate type');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function nextStep()
-    {
-      var frm = document.forms['merge'];
-      if (validate())
-      {
-        frm.submit();
-      }
-    }
-    
-    function selectPlateMappingOnClick()
-    {
-      var frm = document.forms['merge'];
-      var url = '../platemappings/index.jsp?ID=<%=ID%>&mode=selectone&callback=setPlateMappingCallback';
-      Main.openPopup(url, 'SelectPlateMapping', 1050, 700);
-    }
-    function setPlateMappingCallback(id, name)
-    {
-      var frm = document.forms['merge'];
-      var list = frm.platemapping_id;
-      if (list.length < 1 || list[0].value == '0') // >
-      {
-        Forms.addListOption(list, 0, new Option());
-      }
-      list[0].value = id;
-      list[0].text = name;
-      list.selectedIndex = 0;
-    }
-
-    function selectPlateTypeOnClick()
-    {
-      var frm = document.forms['merge'];
-      var url = '../platetypes/index.jsp?ID=<%=ID%>&mode=selectone&callback=setPlateTypeCallback';
-      Main.openPopup(url, 'SelectPlateType', 1050, 700);
-    }
-    function setPlateTypeCallback(id, name)
-    {
-      var frm = document.forms['merge'];
-      var list = frm.platetype_id;
-      if (list.length < 1 || list[0].value == '0') // >
-      {
-        Forms.addListOption(list, 0, new Option());
-      }
-      list[0].value = id;
-      list[0].text = name;
-      list.selectedIndex = 0;
-    }
-    </script>
-  </base:head>
+  <base:page type="popup" title="<%=title%>" id="step-1">
+  <base:head scripts="~merge_plates.js" />
   <base:body>
     <h1><%=title%> <base:help helpid="plates.merge.1" /></h1>
@@ -150 +76 @@
             recent="<%=recentPlateMappings%>"
             newitem="true"
-            onselect="selectPlateMappingOnClick()"
           />
         </td>
@@ -169 +94 @@
             recent="<%=recentPlateTypes%>"
             newitem="true"
-            onselect="selectPlateTypeOnClick()"
           />
         </td>
@@ -185 +109 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="nextStep()" title="Next" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnNext" title="Next" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
 

trunk/www/lims/plates/merge_plates_2.jsp

@@ -63 +63 @@
   
   String title = "Merge plates -- step 2 of 2 -- Select plates";
-  
-  
   %>
-
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="linkitems.js">
-    <script>
-    // Validate the entered information
-    function validate()
-    {
-      var frm = document.forms['merge'];
-      if (Main.trimString(frm.name.value) == '')
-      {
-        Forms.showNotification(frm.name, 'You must enter a name');
-        return false;
-      }
-      if (frm.plates.length != <%=plateMapping.getSourceCount()%>)
-      {
-        Forms.showNotification(frm.plates, 'You must select exactly <%=plateMapping.getSourceCount()%> plates');
-        return false;
-      }
-      return true;
-    }
-
-    // Submit the form
-    function mergePlates()
-    {
-      var frm = document.forms['merge'];
-      if (validate())
-      {
-        frm.mergePlates.value = Link.getActionIds(1, 'P').join(',');
-        frm.submit();
-      }
-    }
-    
-    function addPlatesOnClick()
-    {
-      var ids = Link.getListIds(document.forms['merge'].plates, 'P');
-      var excludes = ids.join(',');
-      var url = '../plates/index.jsp?ID=<%=ID%>&cmd=UpdateContext&mode=selectmultiple&callback=addPlateCallback';
-      url += "&exclude="+excludes;
-      url += '&resetTemporary=1&tmpfilter:INT:plateType.plateGeometry=<%=sourceGeometry.getId()%>';
-      Main.openPopup(url, 'AddPlates', 1050, 700);
-    }
-
-    function addPlateCallback(plateId, name)
-    {
-      var item = Link.getItem('P', plateId);
-      if (!item) item = new Item('P', plateId, name);
-      Link.addItem(document.forms['merge'].plates, item);
-    }
-    
-    function removePlatesOnClick()
-    {
-      Link.removeSelected(document.forms['merge'].plates);
-    }
-    </script>
-  </base:head>
+  <base:page type="popup" title="<%=title%>" id="step-2">
+  <base:head scripts="linkitems-2.js,~merge_plates.js" />
   <base:body>
     <h1><%=title%> <base:help helpid="plates.merge.2" /></h1>
+
+    <div id="page-data" class="datacontainer"
+      data-source-count="<%=plateMapping.getSourceCount()%>"
+    ></div>
 
     <form action="index.jsp?ID=<%=ID%>" method="post" name="merge">
@@ -164 +113 @@
             <base:buttongroup vertical="true">
               <base:button
-                onclick="Forms.moveListOptions(document.forms['merge'].plates, false)" 
+                id="moveUp"
+                data-down="0"
                 image="move_up.png" 
                 tooltip="Move up" 
@@ -170 +120 @@
               />
               <base:button 
-                onclick="Forms.moveListOptions(document.forms['merge'].plates, true)" 
+                id="moveDown"
+                data-down="1"
                 image="move_down.png" 
                 tooltip="Move down" 
@@ -178 +129 @@
           </td>
           <td>
-            <select name="plates" size="<%=plateMapping.getSourceCount()%>" multiple 
-              style="width: 15em;" class="required">
+            <select name="plates" id="plates" 
+              class="auto-init"
+              data-auto-init="link-container"
+              size="<%=Math.max(5, plateMapping.getSourceCount())%>" 
+              multiple style="width: 15em;" class="required">
             </select>
-            <input type="hidden" name="mergePlates">
           </td>
           <td>
             <base:buttongroup vertical="true">
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="add-link"
+                data-list-id="plates"
+                data-item-type="PLATE"
+                data-extra-url="<%="&resetTemporary=1&tmpfilter:INT:plateType.plateGeometry="+sourceGeometry.getId()%>" 
                 style="width: 14em;"
-                onclick="addPlatesOnClick()" 
                 title="Add&nbsp;plates&hellip;" 
                 tooltip="Add plates to be used"
               />
               <base:button 
-                subclass="leftaligned"
+                subclass="leftaligned auto-init"
+                data-auto-init="remove-link"
+                data-list-id="plates"
                 style="width: 14em;"
-                onclick="removePlatesOnClick()" 
                 title="Remove" 
                 tooltip="Remove the selected plates"
@@ -218 +175 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="mergePlates()" title="Merge" image="gonext.png"/>
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnMerge" title="Merge" image="gonext.png"/>
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
 

trunk/www/lims/plates/plates.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', plates.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', Annotations.autoLoadEditFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', Annotations.autoLoadInheritFrame);
+      TabControl.addTabValidator('settings.info', plates.validatePlate);
+
+      // Plate type
+      Buttons.addClickHandler('platetype_id.select', plates.selectPlateType);
+      Events.addEventHandler('platetype_id', 'base-selected', plates.setPlateType);
     }
     else if (pageId == 'view-page')
@@ -96 +107 @@
     location.replace(url);
   }
+  
+  plates.validatePlate = function()
+  {
+    var frm = document.forms['plate'];
+    if (Main.trimString(frm.name.value) == '')
+    {
+      Forms.showNotification(frm.name, 'You must enter a name');
+      return false;
+    }
+    if (frm.platetype_id && frm.platetype_id.length == 0)
+    {
+      Forms.showNotification('platetype_id.select', 'You must select a plate type');
+      return false;
+    }
+    return true;
+  }
+
+  // Submit the form
+  plates.save = function()
+  {
+    var frm = document.forms['plate'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      frm.submit();
+    }
+  }
+
+
+  plates.selectPlateType = function()
+  {
+    var frm = document.forms['plate'];
+    var url = '';
+    if (frm.platetype_id.length > 0) 
+    {
+      url += '&item_id='+frm.platetype_id[0].value;
+    }
+    Dialogs.selectItem('PLATETYPE', 'platetype_id', 0, url);
+  }
+  
+  plates.setPlateType = function(event)
+  {
+    var frm = document.forms['plate'];
+    if (frm.platetype_id.length < 1)
+    {
+      frm.platetype_id[frm.platetype_id.length] = new Option();
+    }
+    frm.platetype_id[0].value = event.detail.id;
+    frm.platetype_id[0].text = event.detail.name;
+    frm.platetype_id.selectedIndex = 0;
+  }
 
   return plates;

trunk/www/lims/plates/wells/edit_well.jsp

@@ -46 +46 @@
 <%@ taglib prefix="base" uri="/WEB-INF/base.tld" %>
 <%@ taglib prefix="t" uri="/WEB-INF/tab.tld" %>
+<%@ taglib prefix="ext" uri="/WEB-INF/extensions.tld" %>
 <%
 final Item itemType = Item.WELL;
@@ -59 +60 @@
   String title = null;
   Well well = Well.getById(dc, itemId);
+  well.checkPermission(Permission.WRITE);
   Plate plate = well.getPlate();
   ReporterData reporter = well.getReporter();
@@ -66 +68 @@
   
   title = "Edit well -- " + HTML.encodeTags(plate.getName()) + " [" + rowFormatter.format(well.getRow()) + columnFormatter.format(well.getColumn()) + "]";
-  
-  if (well != null && !well.hasPermission(Permission.WRITE))
-  {
-    throw new PermissionDeniedException(Permission.WRITE, itemType.toString());
-  }
   cc.setObject("item", well);
   JspContext jspContext = ExtensionsControl.createContext(dc, pageContext, GuiContext.item(itemType), well);
   ExtensionsInvoker invoker = EditUtil.useEditExtensions(jspContext);
   %>
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page type="popup" title="<%=title%>" id="edit-page">
+  <base:head scripts="tabcontrol-2.js,~wells.js" styles="tabcontrol.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    // Validate the "Well" tab
-    function validateWell()
-    {
-      var frm = document.forms['well'];
-      return true;
-    }
-
-    // Submit the form
-    function saveSettings()
-    {
-      var frm = document.forms['well'];
-      if (TabControl.validateActiveTab('settings'))
-      {
-        Annotations.saveModifiedAnnotationsToForm(frm);
-        Annotations.saveInheritedAnnotationsToForm(frm);
-        frm.submit();
-      }
-    }
-    
-    function loadAnnotationsFrame()
-    {
-      Annotations.autoLoadEditFrame();
-    }
-    
-    function loadInheritedAnnotationsFrame()
-    {
-      Annotations.autoLoadInheritFrame();
-    }
-    </script>
   </base:head>
   <base:body>
@@ -120 +87 @@
       position="bottom" 
       extensions="<%=invoker%>">
-    <t:tab id="info" title="Well" validate="validateWell()" helpid="well.edit">
+    <t:tab id="info" title="Well" helpid="well.edit">
       <table class="fullform input100 outlined">
       <tr>
@@ -145 +112 @@
     </t:tab>
 
-    <t:tab id="annotations" title="Annotations" helpid="annotations.edit" activate="loadAnnotationsFrame()">
+    <t:tab id="annotations" title="Annotations" helpid="annotations.edit">
       <jsp:include page="../../../common/annotations/annotate_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -154 +121 @@
     
     <t:tab id="inheritedAnnotations" title="Inherited annotations" 
-      helpid="annotations.edit.inherited" activate="loadInheritedAnnotationsFrame()">
+      helpid="annotations.edit.inherited">
       <jsp:include page="../../../common/annotations/inherit_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -165 +132 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="saveSettings()" title="Save" />
-      <base:button onclick="window.close()" title="Cancel" />
+      <base:button id="btnSave" title="Save" />
+      <base:button id="close" title="Cancel" />
     </base:buttongroup>
   </base:body>

trunk/www/lims/plates/wells/wells.js

@@ -35 +35 @@
     if (pageId == 'edit-page')
     {
-      // TODO
+      // Save + Close buttons
+      Buttons.addClickHandler('btnSave', wells.save);
+      Buttons.addClickHandler('close', App.closeWindow);
+
+      // Tab validation
+      TabControl.addTabActivateListener('settings.annotations', Annotations.autoLoadEditFrame);
+      TabControl.addTabActivateListener('settings.inheritedAnnotations', Annotations.autoLoadInheritFrame);
+      TabControl.addTabValidator('settings.info', wells.validateWell);
     }
     else if (pageId == 'view-page')
@@ -93 +100 @@
   }
 
+  wells.validateWell = function()
+  {
+    return true;
+  }
 
+  // Submit the form
+  wells.save = function()
+  {
+    var frm = document.forms['well'];
+    if (TabControl.validateActiveTab('settings'))
+    {
+      Annotations.saveModifiedAnnotationsToForm(frm);
+      Annotations.saveInheritedAnnotationsToForm(frm);
+      frm.submit();
+    }
+  }
+  
   return wells;
 }();

trunk/www/lims/platetypes/eventtypes/eventtypes.js

@@ -122 +122 @@
     var frm = document.forms['eventtype'];
     var protocolType = Data.get('protocoltype_id', 'protocol-type-filter');
-    var url = url += '&resetTemporary=1&tmpfilter:INT:itemType='+protocolType;
+    var url = '&resetTemporary=1&tmpfilter:INT:itemType='+protocolType;
     if (frm.protocoltype_id.length > 1) 
     {
@@ -136 +136 @@
     if (list.length < 2 || list[1].disabled)
     {
-      Forms.addListOption(list, 0, new Option());
+      Forms.addListOption(list, 1, new Option());
     }
-    list[0].value = event.detail.id;
-    list[0].text = event.detail.name;
+    list[1].value = event.detail.id;
+    list[1].text = event.detail.name;
     list.selectedIndex = 1;
   }