Switched away from accordion setup to collapsible panels:

[htsworkflow.git] / www / js / htsw.js

diff --git a/www/js/htsw.js b/www/js/htsw.js
index bb1b8cd90b8c75b6829f866d35a13e27b2d3f497..9f212545ad89a06c11a47b2787af42390f05512c 100644 (file)
--- a/www/js/htsw.js
+++ b/www/js/htsw.js
@@ -1,6 +1,82 @@
+Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
+
+Ext.override(Ext.Panel,{
+  getState: function() {
+    return { collapsed: this.collapsed };
+    }
+});
 
 $(document).ready(function(){
-    var menuAccordionPanel = new Ext.Panel({
+    
+    var panel_freezers = new Ext.Panel({
+        frame: true,
+        title: 'Freezers',
+        collapsible: true,
+        titleCollapse: true,
+        collapsed: true,
+        stateful: true,
+        stateId: 'freezer_panel_state',
+        contentEl: 'freezer_menu',
+        stateEvents: ['collapse', 'expand']
+    });
+    
+    var panel_containers = new Ext.Panel({
+        frame: true,
+        title: 'Containers',
+        collapsible: true,
+        titleCollapse: true,
+        collapsed: true,
+        stateful: true,
+        stateId: 'container_panel_state',
+        contentEl: 'container_menu',
+        stateEvents: ['collapse', 'expand']
+    });
+    
+    var panel_samples = new Ext.Panel({
+        frame: true,
+        title: 'Samples',
+        collapsible: true,
+        titleCollapse: true,
+        collapsed: true,
+        stateful: true,
+        stateId: 'sample_panel_state',
+        contentEl: 'sample_menu',
+        stateEvents: ['collapse', 'expand']
+    });
+    
+    var panel_settings = new Ext.Panel({
+        frame: true,
+        title: 'Settings',
+        collapsible: true,
+        titleCollapse: true,
+        collapsed: true,
+        stateful: true,
+        stateId: 'settings_panel_state',
+        contentEl: 'settings_menu',
+        stateEvents: ['collapse', 'expand']
+    });
+    
+    var panel_bcmagic = new Ext.Panel({
+        //title: 'BC Magic',
+        contentEl: 'bcmagic_div',
+        height: 160
+    });
+    
+    var menuPanel = new Ext.Panel({
+       id: 'menu_panel',
+       region: 'west',
+       collapsible: true,
+       margins: '2 0 0 0',
+       cmargins: '2 2 0 2',
+       //collapseMode: 'mini',
+       width: 200,
+       minWidth: 150,
+       border: false,
+       //baseCls: 'x-plain',
+       items: [panel_freezers, panel_containers, panel_samples, panel_settings, panel_bcmagic]
+    });
+    
+    /*var menuAccordionPanel = new Ext.Panel({
         id: 'menu_accordion',
         flex: 1,
         layout: 'accordion',
@@ -25,7 +101,7 @@ $(document).ready(function(){
             id: 'settings_menu_panel',
             contentEl: 'settings_menu'
         }]
-    });
+    });*/
     
     var mainBorderPanel = new Ext.Viewport({
        layout: 'border',
@@ -50,7 +126,7 @@ $(document).ready(function(){
                     margins: '2 0 0 0'
             }],
             height: 60 
-       },{
+       },menuPanel,/*{
             title: 'Menu',
             region: 'west',
             margins: '2 0 0 0',
@@ -68,11 +144,11 @@ $(document).ready(function(){
                 {
                     xtype: 'box',
                     applyTo: 'bcmagic_div',
-                    height: 200
+                    height: 160
                 }]
             
             //unstyled: true
-       },{
+       },*/{
             title: 'Body',
             region: 'center',
             xtype: 'container',