Fixed dynamic east panel code

[htsworkflow.git] / htsworkflow / frontend / static / js / htsw.js

diff --git a/htsworkflow/frontend/static/js/htsw.js b/htsworkflow/frontend/static/js/htsw.js
index 3f1e243cfc03d4824545a271b1b9f556c533b562..8bbe43275aad8fc7b1d3011bc1b9061816d43459 100644 (file)
--- a/htsworkflow/frontend/static/js/htsw.js
+++ b/htsworkflow/frontend/static/js/htsw.js
@@ -22,6 +22,17 @@ var goto_url = function(www_url)
 }
 
 $(document).ready(function(){
+    //----------------------------------------
+    // Django Library Page CSS Fix
+    var fix_library_css = function() {
+      var tofix = Ext.fly('library-index-div');
+      if (tofix != null)
+      {
+       tofix.select('*').addClass('djangocss');
+      }
+    }
+    fix_library_css();
+    
     
     //----------------------------------------
     // Dynamically Generate Panels from HTML!
@@ -59,11 +70,12 @@ $(document).ready(function(){
     var menuPanel = new Ext.Panel({
         id: 'menu_panel',
         region: 'west',
+       hidden: true,
         collapsible: true,
        split: true,
+       collapseMode: 'mini',
         margins: '4 0 0 0',
         //cmargins: '2 2 0 2',
-        collapseMode: 'mini',
         width: 200,
         minWidth: 150,
         border: false,
@@ -78,6 +90,55 @@ $(document).ready(function(){
        items: create_dynamic_panels().concat([panel_bcmagic])
     });
     
+    
+    
+    //-------------------------------
+    // East Region Setup
+    //-------------------------------
+    var get_east_panel_content = function(){
+      // East panel contentEl id is supplied in html div id of east_region_config.
+      var east_id = Ext.fly('east_region_config').dom.textContent;
+      
+      if (east_id.length == 0){
+       return east_id;
+      }
+      
+      // If no element exists with the supplied content id, report and error.
+      if (Ext.fly(east_id) == null){
+       return 'east_region_config_error';
+      }
+      return east_id;
+    }
+    
+    var east_panel_content_id = get_east_panel_content();
+    if (east_panel_content_id.length > 0){
+      var eastPanel = new Ext.Panel({
+         region: 'east',
+         layout: 'auto',
+         //margins: '0 2 0 2',
+         width: 180,
+         collapsible: true,
+         split: true,
+         collapseMode: 'mini',
+         autoScroll: true,
+         contentEl: east_panel_content_id
+      });
+    } else {
+      var eastPanel = new Ext.Panel({
+         region: 'east',
+         layout: 'auto',
+         //margins: '0 2 0 2',
+         width: 180,
+         collapsible: true,
+         split: true,
+         hidden: true,
+         collapseMode: 'mini',
+         autoScroll: true
+         //contentEl: ''
+      });
+    }
+    
+
     //-------------------------------
     // Main Viewport Setup
     //-------------------------------
@@ -98,28 +159,34 @@ $(document).ready(function(){
                 },{
                     id: 'main_toolbar',
                     xtype: 'toolbar',
+                   height: 30,
                     //height: 100,
                     /*items: [{
                         text: "Demo Button",
                         handler: function() { quick_msg('Messages can be fun!'); }
                     }],*/
                     margins: '2 0 0 0'
-            }],
-            height: 60 
+               },{
+                   id: 'app_toolbar',
+                   xtype: 'toolbar',
+                   height: 30
+                   //margins: '2 0 0 0'
+               }],
+           height: 90
        },menuPanel,{
             //title: 'Body',
             region: 'center',
             xtype: 'panel',
            //autoScroll: true,
             layout: 'fit',
-            margins: '2 2 2 2',
-            items: {
+            margins: '2 2 2 0',
+            items: [{
                 //title: 'Inner Panel',
                 contentEl: 'body_content',
                 border: true,
                autoScroll: true
-            }
-       }]
+            }]
+           },eastPanel]
     });
     
     //-------------------------------
@@ -127,45 +194,26 @@ $(document).ready(function(){
     //-------------------------------
     var main_tb = Ext.getCmp('main_toolbar');
     
-    var add_buttons_from_html_left = function(main_tb){
-        var left_tbar_data = Ext.fly('left_tbar_data');
-        var div_array = left_tbar_data.query('div');
-        var div_id = null;
-        // Loop through each div since it defines a button and link or a spacer and add it to the right side of the toolbar
-        Ext.each(div_array, function(divobj) {
-            div_id = divobj.id;
-            if (div_id == 'spacer'){
-                main_tb.add('-');
-            } else {
-                main_tb.add({
-                    text: div_id,
-                    handler: function() { goto_url(divobj.getAttribute('href')); }
-                });
-            }
-        });
-        //return right_tbar_data;
-    }
-    
-    var add_buttons_from_html_right = function(main_tb){
-        var right_tbar_data = Ext.fly('right_tbar_data');
-        var div_array = right_tbar_data.query('div');
+    var add_buttons_from_html = function(tb, bar_id){
+        var tbar_data = Ext.fly(bar_id);
+        var div_array = tbar_data.query('div');
         var div_id = null;
         // Loop through each div since it defines a button and link or a spacer and add it to the right side of the toolbar
         Ext.each(div_array, function(divobj) {
             div_id = divobj.id;
             if (div_id == 'spacer'){
-                main_tb.add('-');
+                tb.add('-');
             } else {
-                main_tb.add({
+                tb.add({
                     text: div_id,
                     handler: function() { goto_url(divobj.getAttribute('href')); }
                 });
             }
         });
-        //return right_tbar_data;
     }
     
-    add_buttons_from_html_left(main_tb);
+    // Fill in left side of main toolbar
+    add_buttons_from_html(main_tb, 'left_tbar_data');
     
     // Shifts the remaining toolbar options to the right side.
     main_tb.add({ xtype: 'tbfill' });
@@ -179,7 +227,7 @@ $(document).ready(function(){
                         text: 'User: ' + user_info.getAttribute('user')
                     });
         main_tb.add('-');
-        add_buttons_from_html_right(main_tb);
+        add_buttons_from_html(main_tb, 'right_tbar_data');
         main_tb.add('-');
        main_tb.add({
                         text: 'Logout',
@@ -195,4 +243,14 @@ $(document).ready(function(){
     
     main_tb.doLayout();
     
+    //-------------------------------
+    // App Toolbar Setup
+    //-------------------------------
+    var app_tb = Ext.getCmp('app_toolbar');
+    add_buttons_from_html(app_tb, 'app_toolbar_west');
+    app_tb.add({ xtype: 'tbfill' });
+    add_buttons_from_html(app_tb, 'app_toolbar_east');
+    app_tb.doLayout();
+    
+    
 });
\ No newline at end of file