Changeset 6307

Timestamp:

Aug 15, 2013, 9:54:08 AM (9 years ago)

Author:

Nicklas Nordborg

Message:

References #1729 and #1730. Fixed on more pages in the Biomaterial/Array? LIMS sections.

Location:

trunk/www

Files:

• biomaterials/extracts/list_extracts.jsp (modified) (1 diff)
• common/history/frameset.jsp (modified) (1 diff)
• common/history/history.js (modified) (1 diff)
• include/scripts/main-2.js (modified) (6 diffs)
• lims/arraybatches/batches.js (added)
• lims/arraybatches/list_batches.jsp (modified) (8 diffs)
• lims/arraybatches/view_batch.jsp (modified) (14 diffs)
• lims/arraydesigns/designs.js (added)
• lims/arraydesigns/features/features.js (added)
• lims/arraydesigns/features/list_features.jsp (modified) (8 diffs)
• lims/arraydesigns/features/view_feature.jsp (modified) (2 diffs)
• lims/arraydesigns/list_designs.jsp (modified) (7 diffs)
• lims/arraydesigns/view_design.jsp (modified) (14 diffs)
• lims/arrayslides/list_slides.jsp (modified) (6 diffs)
• lims/arrayslides/slides.js (added)
• lims/arrayslides/view_slide.jsp (modified) (12 diffs)
• lims/platemappings/list_mappings.jsp (modified) (6 diffs)
• lims/platemappings/mappings.js (added)
• lims/platemappings/view_mapping.jsp (modified) (9 diffs)
• lims/plates/events/events.js (added)
• lims/plates/events/list_events.jsp (modified) (7 diffs)
• lims/plates/events/view_event.jsp (modified) (6 diffs)
• lims/plates/list_plates.jsp (modified) (6 diffs)
• lims/plates/plates.js (added)
• lims/plates/view_plate.jsp (modified) (11 diffs)
• lims/plates/wells/list_wells.jsp (modified) (8 diffs)
• lims/plates/wells/view_well.jsp (modified) (7 diffs)
• lims/plates/wells/wells.js (added)
• my_base/messages/list_messages.jsp (modified) (6 diffs)
• my_base/messages/view_message.jsp (modified) (3 diffs)
• my_base/projects/items/items.js (added)
• my_base/projects/items/list_items.jsp (modified) (3 diffs)
• my_base/projects/list_projects.jsp (modified) (8 diffs)
• my_base/projects/projects.js (added)
• my_base/projects/set_active.jsp (modified) (2 diffs)
• my_base/projects/view_project.jsp (modified) (10 diffs)

trunk/www/biomaterials/extracts/list_extracts.jsp

@@ -173 +173 @@
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    /*
-    var submitPage = 'index.jsp';
-    var formId = 'extracts';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function newPooledItem()
-    {
-      Table.poolItems(submitPage, '<%=ID%>', formId, '<%=itemType.name()%>', 'NewPooledItem');
-    }
-    function newPhysicalBioAssay()
-    {
-      Table.poolItems(submitPage, '<%=ID%>', formId, '<%=itemType.name()%>', 'NewPhysicalBioAssay');
-    }
-    function newExtract(extractId)
-    {
-      Main.viewOrEditItem('<%=ID%>', 'EXTRACT', 0, true, '&extract_id='+extractId);
-    }
-    function newRawBioAssay(extractId)
-    {
-      Main.viewOrEditItem('<%=ID%>', 'RAWBIOASSAY', 0, true, '&extract_id='+extractId);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function newBioMaterialList()
-    {
-      var controller = Main.getController('BIOMATERIALLIST');
-      Table.submitToPopup(formId, 'CreateBioMaterialList', controller.width, controller.height);
-    }
-    function placeOnPlate()
-    {
-      Table.submitToPopup(formId, 'PlaceOnPlate', 900, 600);
-    }
-    */
-    </script>
   </base:head>
   

trunk/www/common/history/frameset.jsp

@@ -46 +46 @@
     ></div>
     <script type="text/javascript" charset="UTF-8" src="<%=root%>/common/history/history.js"></script>
-    <div class="absolutefull"><iframe name="history" id="idHistory"
+    <div class="absolutefull"><iframe name="history-frame" id="idHistory"
       src="<%=root%>/common/history/wait.jsp" 
       class="absolutefull" style="width: 100%; height: 100%;"></iframe></div>

trunk/www/common/history/history.js

@@ -60 +60 @@
     url += '&source_type='+Data.get('history-data', 'source-type');
     url += '&source_id='+Data.get('history-data', 'source-id');
-    frames['history'].location.href = url;
+    frames['history-frame'].location.href = url;
     loaded = true;
   }

trunk/www/include/scripts/main-2.js

@@ -784 +784 @@
     that is given by the 'data-item-type' and 'data-item-id'
     attributes to be deleted from the database. Usually attached 
-    to an 'Trashcan' icon on a single-item page. The current page
-    is automatically reloaded with the list page instead.
+    to an 'Trashcan' icon on a single-item page. Specify a target
+    element id in 'data-notify' attribute to send a 'base-notify'
+    message after the item has been deleted, otherwise the current
+    page is automatically reloaded with the list page instead.
   */
   buttons.deleteItemPermanently = function(event)
@@ -793 +795 @@
     var itemId = Data.int(target, 'item-id');
     var extraUrl = Data.get(target, 'extra-url');
-    Items.deleteItemPermanently(itemType, itemId, true, extraUrl);
+    var notify = Data.get(target, 'notify');
+    Items.deleteItemPermanently(itemType, itemId, true, notify, extraUrl);
   }
   
@@ -848 +851 @@
     var target = event.currentTarget;
     var tableId = Data.get(target, 'table-id');
-    Table.setOwnerOfItems(tableId);
+    var regexp = Data.get(target, 'regexp');
+    Table.setOwnerOfItems(tableId, regexp);
   }
 
@@ -1305 +1309 @@
     The current page is automatically changed to the list page.
   */
-  items.deleteItemPermanently = function(itemType, itemId, ask, extraUrl)
+  items.deleteItemPermanently = function(itemType, itemId, ask, notify, extraUrl)
   {
     if (ask)
@@ -1312 +1316 @@
     }
     
-    // Create temporary div to receive redirect
-    // notification from popup window
-    var notifyDiv = document.createElement('div');
-    notifyDiv.id = 'n'+(new Date()).getTime();
-    Events.addEventHandler(notifyDiv, 'base-notify', 
-      function() 
-      {
-        Items.list(itemType, extraUrl); 
-      }
-    );
-    document.body.appendChild(notifyDiv);
+    if (!notify)
+    {
+      // Create temporary div to receive redirect
+      // notification from popup window
+      var notifyDiv = document.createElement('div');
+      notifyDiv.id = 'n'+(new Date()).getTime();
+      Events.addEventHandler(notifyDiv, 'base-notify', 
+        function() 
+        {
+          Items.list(itemType, extraUrl); 
+        }
+      );
+      document.body.appendChild(notifyDiv);
+      notify = notifyDiv.id;
+    }
     
     var url = App.getRoot();
@@ -1329 +1337 @@
     url += '&cmd=DeleteItem&popup=1';
     url += '&item_type='+itemType+'&item_id=' + itemId;
-    url += '&notify='+notifyDiv.id;
+    url += '&notify='+notify;
     Dialogs.openPopup(url, 'Delete'+itemType, 300, 200);
   }

trunk/www/lims/arraybatches/list_batches.jsp

@@ -119 +119 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Array batches" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Array batches" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~batches.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'batches';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function newSlide(batchId)
-    {
-      Main.viewOrEditItem('<%=ID%>', 'ARRAYSLIDE', 0, true, '&arraybatch_id='+batchId);
-    }
-    function multipleNewSlides(batchId)
-    {     
-      Main.openPopup('../arrayslides/index.jsp?ID=<%=ID%>&cmd=NewItems&arraybatch_id='+batchId, 'NewArraySlides', 750, 500);
-    }
-    </script>
   </base:head>
   
@@ -357 +284 @@
           >
           <tbl:button 
+            id="btnNewItem"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="newItem()" 
             title="New&hellip;" 
             tooltip="<%=createPermission ? "Create new array batche" : "You do not have permission to create array batches"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -401 +329 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -408 +337 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -528 +458 @@
                     visible="<%=item.isShared()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -572 +505 @@
                   <base:icon
                     image="add.png" 
-                    onclick="<%="newSlide("+itemId+")"%>" 
+                    subclass="link auto-init"
+                    data-auto-init="new-slide"
+                    data-item-id="<%=itemId %>"
                     tooltip="Create new slide" 
                     visible="<%=mode.hasEditLink() && createSlidePermission && usePermission %>"
@@ -578 +513 @@
                   <base:icon
                     image="new_wizard.png" 
-                    onclick="<%="multipleNewSlides("+itemId+")"%>" 
+                    subclass="link auto-init"
+                    data-auto-init="new-slide-wizard"
+                    data-item-id="<%=itemId %>"
                     tooltip="Create multiple new slides using a wizard" 
                     visible="<%=mode.hasEditLink() && createSlidePermission && usePermission %>"
@@ -657 +594 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/lims/arraybatches/view_batch.jsp

@@ -107 +107 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="tabcontrol.js,table.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="tabcontrol-2.js,table.js,~batches.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function shareItem()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ShareItem&item_id=<%=itemId%>', 'ShareArrayBatch', 600, 400);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    function newSlide()
-    {
-      Main.viewOrEditItem('<%=ID%>', 'ARRAYSLIDE', 0, true, '&arraybatch_id=<%=itemId%>');
-    }
-    function multipleNewSlides()
-    {     
-      Main.openPopup('../arrayslides/index.jsp?ID=<%=ID%>&cmd=NewItems&arraybatch_id=<%=itemId%>', 'NewArraySlides', 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -163 +117 @@
       /><p:pathelement title="<%=HTML.encodeTags(batch.getName())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
@@ -179 +134 @@
           />
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -193 +149 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this array batch" : "You do not have permission to edit this array batch"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!batch.isRemoved()%>"
@@ -208 +164 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=batch.isRemoved()%>"
@@ -216 +172 @@
             />
             <tbl:button
+              id="btnNewSlide"
               image="add.png"
-              onclick="newSlide()"
               title="New slide&hellip;"
               tooltip="Create a new array slide in this batch"
@@ -223 +179 @@
             />
             <tbl:button
+              id="btnNewSlideWizard"
               image="new_wizard.png"
-              onclick="multipleNewSlides()"
               title="Create slides&hellip;"
               tooltip="Create multiple new array slides in this batch using a wizard" 
@@ -230 +186 @@
             />
             <tbl:button 
+              id="btnShare"
               disabled="<%=!sharePermission%>"
               image="share.png"
-              onclick="shareItem()" 
               title="Share&hellip;" 
               tooltip="<%=sharePermission ? "Share this array batch to other user, groups and projects" : "You do not have permission to share this array batch"%>"
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -251 +208 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -258 +216 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -268 +227 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'arraybatch.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="arraybatch.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"
@@ -394 +355 @@
       
       <t:tab id="annotations" title="Annotations &amp; parameters" 
-        tooltip="View annotation values and protocol parameters" clazz="white"
-        activate="AnnotationsList.loadOnce()">
+        tooltip="View annotation values and protocol parameters" clazz="white">
         <jsp:include page="../../common/annotations/list_frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -404 +364 @@
 
       <t:tab id="overview" title="Overview" 
-        tooltip="Display a tree overview of related items"
-        activate="Overview.loadOnce()">
+        tooltip="Display a tree overview of related items">
         <jsp:include page="../../common/overview/overview.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -414 +373 @@
       <t:tab id="history" title="Change history" 
         tooltip="Displays a log of all modifications made to this item"
-        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>"
-        activate="History.loadOnce()">
+        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>">
         <jsp:include page="../../common/history/frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />

trunk/www/lims/arraydesigns/features/list_features.jsp

@@ -143 +143 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="list-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~features.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'features';
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false, '&arraydesign_id=<%=arrayDesignId%>');
-    }
-    function itemOnClick(evt, itemId)
-    {
-      viewItem(itemId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'properties' || tabId == 'annotations' || tabId == 'overview' || tabId == 'history')
-      {
-        location.href = '../index.jsp?ID=<%=ID%>&cmd=ViewItem&item_id=<%=arrayDesignId%>&tab='+tabId;
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    function newReporterList()
-    {
-      Table.submitToPopup(formId, 'CreateReporterList', 600, 400);
-    }
-    </script>
   </base:head>
   
@@ -198 +158 @@
       id="main" 
       subclass="content mastertabcontrol"
-      active="images" switch="switchTab">
+      active="images">
     <t:tab id="properties" title="Properties" />
     <t:tab id="annotations" title="Annotations" />
@@ -515 +475 @@
           >
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
             onclick="configureColumns()" 
@@ -521 +482 @@
           />
           <tbl:button
+            id="btnNewReporterList"
             image="add.png"
-            onclick="newReporterList()"
             title="New reporter list&hellip;"
             tooltip="Create a new reporter list from matching features"
@@ -528 +489 @@
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -535 +497 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -542 +505 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -642 +606 @@
                   visible="<%=mode.hasIcons()%>"
                   ></tbl:header>
-                <tbl:cell column="position"><div class="link" onclick="itemOnClick(event, <%=itemId%>)" 
-                  title="<%=tooltip%>"><%=item.getPosition()%></div></tbl:cell>
+                <tbl:cell column="position"><div
+                    class="link table-item"
+                    data-item-id="<%=itemId%>"
+                    data-no-edit="1" 
+                    data-extra-url="&arraydesign_id=<%=arrayDesignId%>"
+                    tabindex="0"
+                    title="<%=tooltip%>"><%=item.getPosition()%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
-                <tbl:cell column="externalId"><div class="link" onclick="itemOnClick(event, <%=itemId%>)" 
-                  title="<%=tooltip%>"><%=HTML.encodeTags(item.getExternalId())%></div></tbl:cell>
+                <tbl:cell column="externalId"><div
+                    class="link table-item"
+                    data-item-id="<%=itemId%>"
+                    data-no-edit="1" 
+                    data-extra-url="&arraydesign_id=<%=arrayDesignId%>"
+                    tabindex="0"
+                    title="<%=tooltip%>"><%=HTML.encodeTags(item.getExternalId())%></div></tbl:cell>
                 <tbl:cell column="block"><%=block.getBlockNumber()%></tbl:cell>
                 <tbl:cell column="row"><%=item.getRow()%></tbl:cell>

trunk/www/lims/arraydesigns/features/view_feature.jsp

@@ -97 +97 @@
   }
 
-  
-  
   String title = "Feature of "+HTML.encodeTags(design.getName()) + " at position " + feature.getPosition();
   %>
-
-  <base:page title="<%=title%>" type="popup">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css">
+  <base:page title="<%=title%>" type="popup" id="view-page">
+  <base:head scripts="tabcontrol-2.js,~features.js" styles="tabcontrol.css">
   </base:head>
   <base:body>
@@ -323 +320 @@
 
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="window.close()" title="Close" />
+      <base:button id="close" title="Close" />
     </base:buttongroup>
     

trunk/www/lims/arraydesigns/list_designs.jsp

@@ -144 +144 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Array designs" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Array designs" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~designs.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'designs';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function newBatch(designId)
-    {
-      Main.viewOrEditItem('<%=ID%>', 'ARRAYBATCH', 0, true, '&arraydesign_id='+designId);
-    }
-    </script>
   </base:head>
   
@@ -452 +382 @@
           >
           <tbl:button 
+            id="btnNewItem"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="newItem()" 
             title="New&hellip;" 
             tooltip="<%=createPermission ? "Create new array design" : "You do not have permission to create array designs"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -496 +427 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -503 +435 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -630 +563 @@
                     visible="<%=item.isShared()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -702 +638 @@
                   %>
                   <base:icon
+                    subclass="link auto-init"
+                    data-auto-init="new-batch"
+                    data-item-id="<%=itemId %>"
                     image="add.png" 
-                    onclick="<%="newBatch("+itemId+")"%>" 
                     tooltip="Create new batch" 
                     visible="<%=mode.hasEditLink() && createBatchPermission && usePermission %>"
@@ -782 +720 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/lims/arraydesigns/view_design.jsp

@@ -124 +124 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~designs.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function shareItem()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ShareItem&item_id=<%=itemId%>', 'ShareArrayDesign', 600, 400);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    function viewFeatures()
-    {
-      location.href = 'features/index.jsp?ID=<%=ID%>&arraydesign_id=<%=itemId%>';
-    }
-    function managePlates()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ManagePlates&item_id=<%=itemId%>', 'ManagePlates', 600, 400);
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (TabControl.isActive(tabControlId, tabId)) return;
-      if (tabId == 'features')
-      {
-        viewFeatures();
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    function newBatch()
-    {
-      Main.viewOrEditItem('<%=ID%>', 'ARRAYBATCH', 0, true, '&arraydesign_id=<%=itemId%>');
-    }
-    function verifyReporters()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=VerifyReporters&item_id=<%=itemId%>', 'VerifyReporters', 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -200 +134 @@
       /><p:pathelement title="<%=HTML.encodeTags(design.getName())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
       id="main" 
       subclass="content mastertabcontrol" 
-      active="<%=tab%>" switch="switchTab" remember="false">
+      active="<%=tab%>">
     <t:tab id="properties" title="Properties">
       <div>
@@ -216 +151 @@
           />
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -230 +166 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this array design" : "You do not have permission to edit this array design"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!design.isRemoved()%>"
@@ -245 +181 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=design.isRemoved()%>"
@@ -253 +189 @@
             />
             <tbl:button 
+              id="btnShare"
               disabled="<%=!sharePermission%>"
               image="share.png"
-              onclick="shareItem()" 
               title="Share&hellip;" 
               tooltip="<%=sharePermission ? "Share this array design to other user, groups and projects" : "You do not have permission to share this array design"%>"
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button
+              id="btnNewBatch"
               image="add.png"
-              onclick="newBatch()"
               title="New batch&hellip;"
               tooltip="Create a new array batch with this design"
@@ -274 +210 @@
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -281 +218 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -288 +226 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -295 +234 @@
             />
             <tbl:button 
-              onclick="managePlates()"
+              id="btnManagePlates"
               title="Manage plates&hellip;"
               tooltip="Attach / detach plates to this array design"
@@ -304 +243 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'arraydesign.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="arraydesign.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"
@@ -554 +495 @@
       
     <t:tab id="annotations" title="Annotations" 
-      tooltip="View annotation values" clazz="white"
-        activate="AnnotationsList.loadOnce()">
+      tooltip="View annotation values" clazz="white">
         <jsp:include page="../../common/annotations/list_frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -563 +503 @@
     </t:tab>
       
-    <t:tab id="features" title="Features" visible="<%=design.getNumDbFeatures() > 0%>"/>
+    <t:tab id="features" title="Features" visible="<%=design.getNumDbFeatures() > 0%>">
+      <div class="filled absolutefull">
+        <table style="margin: auto; height: 100%;"><tr><td>
+        <b>Please wait. The features information is loading...</b>
+        </td></tr></table>
+      </div>
+    </t:tab>
 
     <t:tab id="overview" title="Overview" 
-      tooltip="Display a tree overview of related items"
-      activate="Overview.loadOnce()">
+      tooltip="Display a tree overview of related items">
       <jsp:include page="../../common/overview/overview.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -576 +521 @@
     <t:tab id="history" title="Change history" 
       tooltip="Displays a log of all modifications made to this item"
-      visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>"
-      activate="History.loadOnce()">
+      visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>">
       <jsp:include page="../../common/history/frameset.jsp">
         <jsp:param name="item_type" value="<%=itemType.name()%>" />

trunk/www/lims/arrayslides/list_slides.jsp

@@ -107 +107 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Array slides" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Array slides" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~slides.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'slides';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function newItems()
-    {     
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=NewItems', 'NewArraySlides', 750, 500);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    </script>
   </base:head>
   
@@ -361 +292 @@
           >
           <tbl:button 
+            id="btnNewItem"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="newItem()" 
             title="New&hellip;" 
             tooltip="<%=createPermission ? "Create new array slide" : "You do not have permission to create array slides"%>" 
           />
           <tbl:button
+            id="btnNewItemsWizard"
             disabled="<%=!createPermission%>"
             image="new_wizard.png"
-            onclick="newItems()"
             title="Create multiple&hellip;"
             tooltip="<%=createPermission ? "Create multiple new array slides using a wizard" : "You do not have permission to create array slides"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -412 +344 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -419 +352 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -538 +472 @@
                     visible="<%=item.isShared()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -641 +578 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/lims/arrayslides/view_slide.jsp

@@ -105 +105 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="tabcontrol.js,table.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="tabcontrol-2.js,table.js,~slides.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function shareItem()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ShareItem&item_id=<%=itemId%>', 'ShareArraySlide', 600, 400);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -153 +115 @@
       /><p:pathelement title="<%=HTML.encodeTags(slide.getName())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
@@ -169 +132 @@
           />
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -183 +147 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this array slide" : "You do not have permission to edit this array slide"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!slide.isRemoved()%>"
@@ -198 +162 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=slide.isRemoved()%>"
@@ -206 +170 @@
             />
             <tbl:button 
+              id="btnShare"
               disabled="<%=!sharePermission%>"
               image="share.png"
-              onclick="shareItem()" 
               title="Share&hellip;" 
               tooltip="<%=sharePermission ? "Share this array slide to other user, groups and projects" : "You do not have permission to share this array slide"%>"
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -227 +192 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -234 +200 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -244 +211 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'arrayslide.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="arrayslide.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"
@@ -313 +282 @@
       
       <t:tab id="annotations" title="Annotations &amp; parameters" 
-        tooltip="View annotation values and protocol parameters" clazz="white"
-        activate="AnnotationsList.loadOnce()">
+        tooltip="View annotation values and protocol parameters" clazz="white">
         <jsp:include page="../../common/annotations/list_frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -323 +291 @@
 
       <t:tab id="overview" title="Overview" 
-        tooltip="Display a tree overview of related items"
-        activate="Overview.loadOnce()">
+        tooltip="Display a tree overview of related items">
         <jsp:include page="../../common/overview/overview.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -333 +300 @@
       <t:tab id="history" title="Change history" 
         tooltip="Displays a log of all modifications made to this item"
-        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>"
-        activate="History.loadOnce()">
+        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>">
         <jsp:include page="../../common/history/frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />

trunk/www/lims/platemappings/list_mappings.jsp

@@ -106 +106 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Plate mappings" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Plate mappings" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~mappings.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'mappings';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    </script>
   </base:head>
   
@@ -328 +263 @@
           >
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -365 +301 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -372 +309 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -491 +429 @@
                     visible="<%=item.isShared()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -564 +505 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/lims/platemappings/view_mapping.jsp

@@ -106 +106 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~mappings.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function shareItem()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ShareItem&item_id=<%=itemId%>', 'SharePlateMapping', 600, 400);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -154 +116 @@
       /><p:pathelement title="<%=HTML.encodeTags(mapping.getName())%>"
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
@@ -170 +133 @@
           />
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -184 +148 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this plate mapping" : "You do not have permission to edit this plate mapping"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!mapping.isRemoved()%>"
@@ -199 +163 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=mapping.isRemoved()%>"
@@ -207 +171 @@
             />
             <tbl:button 
+              id="btnShare"
               disabled="<%=!sharePermission%>"
               image="share.png"
-              onclick="shareItem()" 
               title="Share&hellip;" 
               tooltip="<%=sharePermission ? "Share this plate mapping to other user, groups and projects" : "You do not have permission to share this plate mapping"%>"
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -228 +193 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -235 +201 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -245 +212 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'platemapping.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="platemapping.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"

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

@@ -104 +104 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~events.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'events';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true, '&plate_id=<%=plateId%>');
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      var numChecked = Forms.numChecked(frm);
-      if (numChecked == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      else
-      {
-        var rep = numChecked == 1 ? 'event' : 'events';
-        if (!confirm('You are about to delete '+numChecked+' '+rep+'. This can\'t be undone. Continue?'))
-        {
-          return;
-        }
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'properties' || tabId == 'annotations' || tabId == 'history')
-      {
-        location.href = '../index.jsp?ID=<%=ID%>&cmd=ViewItem&item_id=<%=plateId%>&tab='+tabId;
-      }
-      else if (tabId == 'wells')
-      {
-        location.href = '../wells/index.jsp?ID=<%=ID%>&plate_id=<%=plateId%>';
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    </script>
   </base:head>
   
@@ -188 +119 @@
       id="main" 
       subclass="content mastertabcontrol"
-      active="events" switch="switchTab">
+      active="events">
     <t:tab id="properties" title="Properties" />
     <t:tab id="annotations" title="Annotations" />
@@ -313 +244 @@
           >
           <tbl:button 
+            id="btnNewItem"
+            data-extra-url="<%="&plate_id="+plateId%>"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="newItem()" 
             title="New&hellip;" 
             tooltip="<%=createPermission ? "Create new event" : "You do not have permission to create events"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
+            data-confirm="1"
             disabled="<%=!deletePermission%>" 
             image="delete.png" 
             title="Delete&hellip;"
-            onclick="deleteItems()" 
             tooltip="<%=deletePermission ? "Delete the selected events" : "You do not have permission to delete events"%>" 
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -340 +274 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -347 +282 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -451 +387 @@
                 <tbl:cell column="ordinal"><%=eventType.getOrdinal()%></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
-                <tbl:cell column="eventType"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="eventType"><div 
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>"
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="protocol"
@@ -508 +447 @@
 
     <base:buttongroup>
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
   

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

@@ -95 +95 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~events.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function deleteItem()
-    {
-      if (confirm('This can\'t be undone. Continue?'))
-      {
-        location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&plate_id=<%=plateId%>&item_id=<%=itemId%>');
-      }
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&plate_id=<%=plateId%>&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -125 +108 @@
       /><p:pathelement title="<%="Event: "+Base.getEncodedName(currentEventType, !readCurrentEventType)%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>" data-plate-id="<%=plateId%>"></div>
     
     <t:tabcontrol
       id="main" 
       subclass="content mastertabcontrol" 
-      active="properties" switch="switchTab">
+      active="properties">
     <t:tab id="properties" title="Properties">
       <div>
@@ -138 +122 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this event" : "You do not have permission to edit this event"%>" 
             />
             <tbl:button 
+              id="btnDelete"
+              data-confirm="1"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               tooltip="<%=deletePermission ? "Delete this event" : "You do not have permission to event this event"%>" 
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -159 +145 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -166 +153 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -176 +164 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'plateevent.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="plateevent.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"

trunk/www/lims/plates/list_plates.jsp

@@ -130 +130 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Plates" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Plates" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~plates.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'plates';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function mergePlates()
-    {
-      Main.openPopup('merge_plates.jsp?ID=<%=ID%>', 'MergePlates', 600, 400);
-    }
-    </script>
   </base:head>
   
@@ -400 +331 @@
           >
           <tbl:button 
+            id="btnMergePlates"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="mergePlates()" 
             title="Merge&hellip;" 
             tooltip="<%=createPermission ? "Create new plates by merging other plates" : "You do not have permission to create plates"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -444 +376 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -451 +384 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -570 +504 @@
                     visible="<%=item.isShared()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -728 +665 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/lims/plates/view_plate.jsp

@@ -113 +113 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="tabcontrol.js,table.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="tabcontrol-2.js,table.js,~plates.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function shareItem()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=ShareItem&item_id=<%=itemId%>', 'SharePlate', 600, 400);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    function viewWells()
-    {
-      location.href = 'wells/index.jsp?ID=<%=ID%>&plate_id=<%=itemId%>';
-    }
-    function viewEvents()
-    {
-      location.href = 'events/index.jsp?ID=<%=ID%>&plate_id=<%=itemId%>';
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'events')
-      {
-        viewEvents();
-      }
-      else if (tabId == 'wells')
-      {
-        viewWells();
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    </script>
   </base:head>
   <base:body>
@@ -184 +123 @@
       /><p:pathelement title="<%=HTML.encodeTags(plate.getName())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
       id="main" 
       subclass="content mastertabcontrol" 
-      active="<%=tab%>" switch="switchTab" remember="false">
+      active="<%=tab%>">
     <t:tab id="properties" title="Properties">
       <div>
@@ -200 +140 @@
           />
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -214 +155 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this plate" : "You do not have permission to edit this plate"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!plate.isRemoved()%>"
@@ -229 +170 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=plate.isRemoved()%>"
@@ -237 +178 @@
             />
             <tbl:button 
+              id="btnShare"
               disabled="<%=!sharePermission%>"
               image="share.png"
-              onclick="shareItem()" 
               title="Share&hellip;" 
               tooltip="<%=sharePermission ? "Share this plate to other user, groups and projects" : "You do not have permission to share this plate"%>"
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -258 +200 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -265 +208 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -275 +219 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'plate.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="plate.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"
@@ -491 +437 @@
       
       <t:tab id="annotations" title="Annotations" 
-        tooltip="View annotation values" clazz="white"
-        activate="AnnotationsList.loadOnce()">
+        tooltip="View annotation values" clazz="white">
         <jsp:include page="../../common/annotations/list_frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />
@@ -504 +449 @@
       <t:tab id="history" title="Change history" 
         tooltip="Displays a log of all modifications made to this item"
-        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>"
-        activate="History.loadOnce()">
+        visible="<%=ChangeHistoryUtil.showChangeHistoryTab(sc)%>">
         <jsp:include page="../../common/history/frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />

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

@@ -134 +134 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~wells.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'wells';
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'properties' || tabId == 'annotations' || tabId == 'history')
-      {
-        location.href = '../index.jsp?ID=<%=ID%>&cmd=ViewItem&item_id=<%=plateId%>&tab='+tabId;
-      }
-      else if (tabId == 'events')
-      {
-        location.href = '../events/index.jsp?ID=<%=ID%>&plate_id=<%=plateId%>';
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    function newReporterList()
-    {
-      Table.submitToPopup(formId, 'CreateReporterList', 600, 400);
-    }
-    </script>
   </base:head>
   
@@ -197 +149 @@
       id="main" 
       subclass="content mastertabcontrol"
-      active="wells" switch="switchTab">
+      active="wells">
     <t:tab id="properties" title="Properties" />
     <t:tab id="annotations" title="Annotations" />
@@ -419 +371 @@
           >
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button
+            id="btnNewReporterList"
             image="add.png"
-            onclick="newReporterList()"
             title="New reporter list&hellip;"
             tooltip="Create a new reporter list from matching wells"
@@ -432 +384 @@
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -439 +392 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -446 +400 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -546 +501 @@
                   visible="<%=mode.hasIcons()%>"
                   >&nbsp;</tbl:header>
-                <tbl:cell column="row"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="row"><div 
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>"
+                  tabindex="0"
                   title="<%=tooltip%>"><tbl:cellvalue value="<%=item.getRow()%>" /></div></tbl:cell>
                 <tbl:cell column="column"><tbl:cellvalue value="<%=item.getColumn()%>"/></tbl:cell>
@@ -670 +628 @@
 
     <base:buttongroup>
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
   

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

@@ -133 +133 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~wells.js" styles="toolbar.css,table.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&plate_id=<%=plateId%>&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    </script>
   </base:head>
   <base:body>
@@ -156 +146 @@
       /><p:pathelement title="<%="Well: "+rowFormatter.format(well.getRow())+columnFormatter.format(well.getColumn())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
@@ -169 +160 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this well" : "You do not have permission to edit this well"%>" 
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -183 +175 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -190 +183 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -200 +194 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'well.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="well.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"
@@ -340 +336 @@
       </t:tab>
       <t:tab id="annotations" title="Annotations" 
-        tooltip="View annotation values" clazz="white"
-        activate="AnnotationsList.loadOnce()">
+        tooltip="View annotation values" clazz="white">
         <jsp:include page="../../../common/annotations/list_frameset.jsp">
           <jsp:param name="item_type" value="<%=itemType.name()%>" />

trunk/www/my_base/messages/list_messages.jsp

@@ -99 +99 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Messages" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Messages" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~messages.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'messages';
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      viewItem(itemId);
-    }
-    function markAsRead()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'MarkAsRead';
-      frm.submit();
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    </script>
   </base:head>
   
@@ -260 +199 @@
           >
           <tbl:button 
+            id="btnMarkAsRead"
             image="message.png" 
-            onclick="markAsRead()" 
             title="Mark as read" 
             tooltip="Mark the selected messages as read" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -291 +231 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -298 +239 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -414 +356 @@
                     visible="<%=item.isRemoved()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" onclick="itemOnClick(event, <%=itemId%>)" 
+                <tbl:cell column="name"><div 
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="1"
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -446 +392 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/my_base/messages/view_message.jsp

@@ -108 +108 @@
   final boolean deletePermanentlyPermission = deletePermission && !isUsed;
   %>
-
-  <base:page type="popup" title="<%=title%>">
-  <base:head scripts="tabcontrol.js" styles="tabcontrol.css,progressbar.css">
-  <script>
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      location.href = getRoot() + 'common/close_popup.jsp?ID=<%=ID%>&refresh_opener=1&wait=0';
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-  </script>
-  </base:head>
-  <base:body>
-    
+  <base:page type="popup" title="<%=title%>" id="view-page">
+  <base:head scripts="~messages.js" />
+  <base:body>   
     <h1><%=title%> <base:help tabcontrol="main" /></h1>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <div class="content bottomborder">
@@ -140 +124 @@
           <div class="itemstatus">
             <base:icon 
+              id="btnDeletePermanently"
               image="deleted.png"
-              onclick="<%=deletePermanentlyPermission ? "deleteItemPermanently()" : null%>"
+              data-notify="btnDeletePermanently"
               tooltip="<%=deletePermanentlyPermission ? "Permanently delete this item" : null%>"
+              enabled="<%=deletePermanentlyPermission %>"
               visible="<%=isRemoved%>"> This item has been flagged for deletion<br></base:icon>
-            <base:icon image="used.png" 
-              onclick="showUsingItems()"
+            <base:icon 
+              id="btnUsingItems"
+              image="used.png" 
               tooltip="Show the items that are using this one"
               visible="<%=isUsed%>"> This item is used by other items and can't be permanently deleted<br></base:icon>
@@ -184 +171 @@
       </div>
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="window.close()" title="Close" />
+      <base:button id="close" title="Close" />
     </base:buttongroup>
 

trunk/www/my_base/projects/items/list_items.jsp

@@ -125 +125 @@
       "net.sf.basedb.clients.web.listcolumn.projectitems");
   %>
-  <base:page>
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page id="list-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~items.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'items';
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      var numChecked = Forms.numChecked(frm, /item:/);
-      if (numChecked == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm, /item:/) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId, /item:/);
-    }
-    function shareItems()
-    {
-      Table.shareItems(formId, /item:/);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function setToActive()
-    {
-      Main.openPopup('../set_active.jsp?ID=<%=ID%>&project_id=<%=projectId%>', 'ActivateProject', 300, 200);
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'properties')
-      {
-        location.href = '../index.jsp?ID=<%=ID%>&cmd=ViewItem&item_id=<%=projectId%>&tab='+tabId;
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    </script>
   </base:head>
   
@@ -192 +136 @@
       /><p:pathelement title="<%=HTML.encodeTags(project.getName())%>" 
       /></p:path>
+    <div id="page-data" data-project-id="<%=projectId%>"></div>
 
     <t:tabcontrol 
       id="main" 
       subclass="mastertabcontrol content"
-      active="items" switch="switchTab">
+      active="items">
     <t:tab id="properties" title="Properties" />
     
@@ -270 +215 @@
         <tbl:toolbar subclass="bottomborder">
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected items"
           />
           <tbl:button 
+            id="btnShareItems"
             image="share.png"
-            onclick="shareItems()" 
             title="Share&hellip;" 
             tooltip="Share the selected items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
-            onclick="configureColumns()" 
             title="Columns&hellip;" 
             tooltip="Show, hide and re-order columns" 

trunk/www/my_base/projects/list_projects.jsp

@@ -95 +95 @@
   ExtensionsInvoker columnsInvoker = ListColumnUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title==null ? "Projects" : title%>" type="<%=mode.getPageType()%>">
-  <base:head scripts="table.js" styles="table.css,toolbar.css">
+  <base:page title="<%=title==null ? "Projects" : title%>" type="<%=mode.getPageType()%>" id="list-page">
+  <base:head scripts="table.js,~projects.js" styles="table.css,toolbar.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    var submitPage = 'index.jsp';
-    var formId = 'projects';
-    function newItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', 0, true);
-    }
-    function editItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, true);
-    }
-    function viewItem(itemId)
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', itemId, false);
-    }
-    function itemOnClick(evt, itemId)
-    {
-      Table.itemOnClick(formId, evt, itemId, '<%=mode.getName()%>', viewItem, editItem, returnSelected);
-    }
-    function deleteItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'DeleteItems';
-      frm.submit();
-    }
-    function restoreItems()
-    {
-      var frm = document.forms[formId];
-      if (Forms.numChecked(frm) == 0)
-      {
-        Forms.showNotification('check.uncheck', 'Please select at least one item in the list', null, 'pointer-left');
-        return; 
-      }
-      frm.action = submitPage;
-      frm.cmd.value = 'RestoreItems';
-      frm.submit();
-    }
-    function setOwner()
-    {
-      Table.setOwnerOfItems(formId);
-    }
-    function configureColumns()
-    {
-      Table.configureColumns(formId);
-    }
-    function runPlugin(cmd)
-    {
-      Table.submitToPopup(formId, cmd, 750, 500);
-    }
-    function returnSelected()
-    {
-      Table.returnSelected(formId, <%=callback != null ? "window.opener."+callback : "null" %>);
-      window.close();
-    }
-    function setActive(projectId)
-    {
-      Main.openPopup('set_active.jsp?ID=<%=ID%>&project_id='+projectId, 'ActivateProject', 300, 200);
-    }
-    </script>
   </base:head>
   
@@ -265 +200 @@
           >
           <tbl:button 
+            id="btnNewItem"
             disabled="<%=!createPermission%>" 
             image="new.png" 
-            onclick="newItem()" 
             title="New&hellip;" 
             tooltip="<%=createPermission ? "Create new project" : "You do not have permission to create projects"%>" 
           />
           <tbl:button 
+            id="btnDeleteItems"
             image="delete.png"
-            onclick="deleteItems()" 
             title="Delete" 
             tooltip="Delete the selected items" 
           />
           <tbl:button 
+            id="btnRestoreItems"
             image="restore.png"
-            onclick="restoreItems()" 
             title="Restore" 
             tooltip="Restore the selected (deleted) items"
           />
           <tbl:button 
+            id="btnSetOwner"
             image="take_ownership.png"
-            onclick="setOwner()" 
             title="Set owner&hellip;"
             tooltip="Change owner of the selected items"
           />
           <tbl:button 
+            id="btnColumns"
             image="columns.png" 
             onclick="configureColumns()" 
@@ -296 +232 @@
           />
           <tbl:button 
+            id="btnImport"
+            data-plugin-type="IMPORT"
             image="import.png" 
-            onclick="runPlugin('ImportItems')" 
             title="Import&hellip;" 
             tooltip="Import data" 
@@ -303 +240 @@
           />
           <tbl:button 
+            id="btnExport"
+            data-plugin-type="EXPORT"
             image="export.png" 
-            onclick="runPlugin('ExportItems')" 
             title="Export&hellip;" 
             tooltip="Export data" 
@@ -310 +248 @@
           />
           <tbl:button 
+            id="btnRunPlugin"
+            data-plugin-type="OTHER"
             image="runplugin.png" 
-            onclick="runPlugin('RunListPlugin')" 
             title="Run plugin&hellip;" 
             tooltip="Run a plugin" 
@@ -420 +359 @@
                     visible="<%=item.isRemoved()%>"
                   />&nbsp;</tbl:header>
-                <tbl:cell column="name"><div class="link" 
-                  onclick="itemOnClick(<%=writePermission ? "event" : null%>, <%=itemId%>)" 
+                <tbl:cell column="name"><div
+                  class="link table-item"
+                  data-item-id="<%=itemId%>"
+                  data-no-edit="<%=writePermission ? 0 : 1 %>" 
+                  tabindex="0"
                   title="<%=tooltip%>"><%=name%></div></tbl:cell>
                 <tbl:cell column="id"><%=item.getId()%></tbl:cell>
@@ -441 +383 @@
                 <tbl:cell column="entryDate" value="<%=item.getEntryDate()%>" />
                 <tbl:cell column="description"><%=HTML.encodeTags(item.getDescription())%></tbl:cell>
-                <tbl:cell column="actions"><a href="javascript:setActive(<%=itemId%>)">Set active</a></tbl:cell>
+                <tbl:cell column="actions"><span class="link auto-init" data-auto-init="set-active" data-item-id="<%=itemId%>">Set active</span></tbl:cell>
                 <tbl:cell column="permission"><%=PermissionUtil.getShortPermissions(item)%></tbl:cell>
                 <tbl:xt-cells dc="<%=dc%>" item="<%=item%>">
@@ -467 +409 @@
     
     <base:buttongroup subclass="dialogbuttons">
-      <base:button onclick="returnSelected();" title="Ok" visible="<%=mode.hasOkButton()%>" />
-      <base:button onclick="window.close();" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
-      <base:button onclick="window.close();" title="Close" visible="<%=mode.hasCloseButton()%>" />
+      <base:button id="btnOk" title="Ok" visible="<%=mode.hasOkButton()%>" />
+      <base:button id="close" title="Cancel" visible="<%=mode.hasCancelButton()%>" />
+      <base:button id="close" title="Close" visible="<%=mode.hasCloseButton()%>" />
     </base:buttongroup>
     

trunk/www/my_base/projects/set_active.jsp

@@ -102 +102 @@
 }
 %>
-<base:page type="popup" title="<%=title%>">
-<base:head>
-<script>
-function reloadAndClose()
-{
-  window.opener.location.reload();
-  setTimeout(closeWindow, 500);
-}
-function closeWindow()
-{
-  window.close();
-}
-</script>
-</base:head>
-<base:body onload="reloadAndClose()">
+<base:page type="popup" title="<%=title%>" id="set-active">
+<base:head scripts="~projects.js" />
+<base:body>
   <h1><%=title %></h1>
   <div class="content">
@@ -125 +113 @@
 
   <base:buttongroup subclass="dialogbuttons">
-    <base:button onclick="window.close();" title="Ok" />
+    <base:button id="close" title="Ok" />
   </base:buttongroup>
 </base:body>

trunk/www/my_base/projects/view_project.jsp

@@ -98 +98 @@
   ExtensionsInvoker invoker = ToolbarUtil.useExtensions(jspContext);
   %>
-  <base:page title="<%=title%>">
-  <base:head scripts="table.js,tabcontrol.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
+  <base:page title="<%=title%>" id="view-page">
+  <base:head scripts="table.js,tabcontrol-2.js,~projects.js" styles="table.css,toolbar.css,headertabcontrol.css,path.css">
     <ext:scripts context="<%=jspContext%>" />
     <ext:stylesheets context="<%=jspContext%>" />
-    <script>
-    function editItem()
-    {
-      Main.viewOrEditItem('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>, true);
-    }
-    function deleteItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=DeleteItem&item_id=<%=itemId%>');
-    }
-    function restoreItem()
-    {
-      location.replace('index.jsp?ID=<%=ID%>&cmd=RestoreItem&item_id=<%=itemId%>');
-    }
-    function deleteItemPermanently()
-    {
-      Main.deleteItemPermanently('<%=ID%>', true, '<%=itemType.name()%>', <%=itemId%>, '&callback=itemDeleted');
-    }
-    function itemDeleted()
-    {
-      Main.listItems('<%=ID%>', '<%=itemType.name()%>');
-    }
-    function showUsingItems()
-    {
-      Main.showUsingItems('<%=ID%>', '<%=itemType.name()%>', <%=itemId%>);
-    }
-    function setOwner()
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd=SetOwnerOfItem&item_id=<%=itemId%>', 'SetOwnerOfItem', 450, 300);
-    }
-    function runPlugin(cmd)
-    {
-      Main.openPopup('index.jsp?ID=<%=ID%>&cmd='+cmd+'&item_id=<%=itemId%>', 'RunPlugin'+cmd, 750, 500);
-    }
-    function setToActive()
-    {
-      Main.openPopup('set_active.jsp?ID=<%=ID%>&project_id=<%=itemId%>', 'ActivateProject', 300, 200);
-    }
-    function viewItems()
-    {
-      location.href = 'items/index.jsp?ID=<%=ID%>&project_id=<%=itemId%>';
-    }
-    function switchTab(tabControlId, tabId)
-    {
-      if (tabId == 'items')
-      {
-        viewItems();
-      }
-      else
-      {
-        TabControl.setActiveTab(tabControlId, tabId);
-      }
-    }
-    </script>
   </base:head>
   <base:body>
@@ -161 +108 @@
       /><p:pathelement title="<%=HTML.encodeTags(project.getName())%>" 
       /></p:path>
+    <div id="page-data" data-item-id="<%=itemId%>"></div>
     
     <t:tabcontrol 
       id="main" 
       subclass="content mastertabcontrol" 
-      active="<%=tab%>" switch="switchTab">
+      active="<%=tab%>">
     <t:tab id="properties" title="Properties">
       <div>
@@ -172 +120 @@
         <th class="itemstatus">
           <base:icon 
+            id="btnDeletePermanently"
             image="deleted.png"
-            onclick="deleteItemPermanently()"
             tooltip="This item has been flagged for deletion. Click to delete it now."
             enabled="<%=deletePermanentlyPermission %>"
             visible="<%=isRemoved%>" 
           />
-          <base:icon image="used.png" 
-            onclick="showUsingItems()"
+          <base:icon 
+            id="btnUsingItems"
+            image="used.png" 
             tooltip="This item is used by other items and can't be permanently deleted. Show the items that are using this one"
             visible="<%=isRemoved && isUsed%>" />
@@ -186 +135 @@
           <tbl:toolbar subclass="bottomborder">
             <tbl:button 
+              id="btnEdit"
               disabled="<%=!writePermission%>" 
               image="edit.png" 
-              onclick="editItem()" 
               title="Edit&hellip;" 
               tooltip="<%=writePermission ? "Edit this project" : "You do not have permission to edit this project"%>" 
             />
             <tbl:button 
+              id="btnDelete"
               disabled="<%=!deletePermission%>" 
               image="delete.png" 
-              onclick="deleteItem()" 
               title="Delete"
               visible="<%=!project.isRemoved()%>"
@@ -201 +150 @@
             />
             <tbl:button 
+              id="btnRestore"
               disabled="<%=!writePermission%>" 
               image="restore.png" 
-              onclick="restoreItem()" 
               title="Restore"
               visible="<%=project.isRemoved()%>"
@@ -209 +158 @@
             />
             <tbl:button 
+              id="btnSetOwner"
               disabled="<%=!setOwnerPermission%>"
               image="take_ownership.png"
-              onclick="setOwner()" 
               title="Set owner&hellip;"
               tooltip="<%=setOwnerPermission ? "Change owner of this item" : "You do not have permission to change ownership of this item"%>"
             />
             <tbl:button 
-              onclick="setToActive()" 
+              id="btnSetActive"
               image="bullet.png"
               title="Set active"
@@ -222 +171 @@
             />
             <tbl:button 
+              id="btnImport"
               image="import.png" 
-              onclick="runPlugin('ImportItem')" 
+              data-plugin-type="IMPORT"  
               title="Import&hellip;" 
               tooltip="Import data" 
@@ -229 +179 @@
             />
             <tbl:button 
-              image="export.png" 
-              onclick="runPlugin('ExportItem')" 
+              id="btnExport"
+              image="export.png"
+              data-plugin-type="EXPORT" 
               title="Export&hellip;" 
               tooltip="Export data" 
@@ -236 +187 @@
             />
             <tbl:button 
-              image="runplugin.png" 
-              onclick="runPlugin('RunPlugin')" 
+              id="btnRunPlugin"
+              image="runplugin.png"  
+              data-plugin-type="OTHER" 
               title="Run plugin&hellip;" 
               tooltip="Run a plugin" 
@@ -246 +198 @@
             <tbl:button
               image="help.png"
-              onclick="<%="Main.openHelp('" + ID +"', 'project.view.properties')"%>"
+              subclass="auto-init"
+              data-auto-init="help"
+              data-help-id="project.view.properties"
               title="Help&hellip;"
               tooltip="Get help about this page"