htsworkflow/frontend/static/js/htsw.js

   1 Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
   2
   3 Ext.override(Ext.Panel,{
   4   getState: function() {
   5     return { collapsed: this.collapsed };
   6     }
   7 });
   8
   9 var quick_msg = function(msg)
  10 {
  11     Ext.MessageBox.show({
  12         title: 'Info',
  13         msg: msg,
  14         buttons: Ext.MessageBox.OK,
  15         icon: Ext.MessageBox.INFO
  16     });
  17 }
  18
  19 var goto_url = function(www_url)
  20 {
  21     window.location = www_url;
  22 }
  23
  24 $(document).ready(function(){
  25
  26     //----------------------------------------
  27     // Dynamically Generate Panels from HTML!
  28     var create_dynamic_panels = function(){
  29         var wp_items = Ext.fly('west_panel_items');
  30         var ul_items = wp_items.query('ul');
  31
  32         var dynamic_panels = new Array();
  33         Ext.each(ul_items, function(ul) {
  34             var panel_obj = new Ext.Panel({
  35                 frame: true,
  36                 title: ul.id,
  37                 //collapsible: true,
  38                 //titleCollapse: true,
  39                 //collapsed: true,
  40                 //stateful: true,
  41                 //stateId: 'freezer_panel_state',
  42                 margins: '0 0 0 0',
  43                 //width: 200,
  44                 contentEl: ul
  45                 //stateEvents: ['collapse', 'expand']
  46             });
  47             dynamic_panels.push(panel_obj);
  48         });
  49         return dynamic_panels;
  50     }
  51
  52     var panel_bcmagic = new Ext.Panel({
  53         //title: 'BC Magic',
  54         unstyled: true,
  55         contentEl: 'bcmagic_div',
  56         height: 180
  57     });
  58
  59     var menuPanel = new Ext.Panel({
  60         id: 'menu_panel',
  61         region: 'west',
  62         collapsible: true,
  63         split: true,
  64         collapseMode: 'mini',
  65         margins: '4 0 0 0',
  66         //cmargins: '2 2 0 2',
  67         width: 200,
  68         minWidth: 150,
  69         border: false,
  70         //baseCls: 'x-plain',
  71         unstyled: true,
  72         layout: 'vbox',
  73         layoutConfig: {
  74             align: 'stretch',
  75             pack: 'start'
  76         },
  77         // Add dynamically generated panels from html and include barcode magic
  78        items: create_dynamic_panels().concat([panel_bcmagic])
  79     });
  80
  81     var get_east_panel_content = function(){
  82       // East panel contentEl id is supplied in html div id of east_region_config.
  83       var east_id = Ext.fly('east_region_config').dom.textContent;
  84
  85       // If no element exists with the supplied content id, report and error.
  86       if (Ext.fly(east_id) == null){
  87         return 'east_region_config_error';
  88       }
  89       return east_id;
  90     }
  91
  92     var east_panel_content_id = get_east_panel_content();
  93     if (east_panel_content_id.length > 0){
  94       var eastPanel = new Ext.Panel({
  95           region: 'east',
  96           layout: 'auto',
  97           //margins: '0 2 0 2',
  98           width: 180,
  99           collapsible: true,
 100           split: true,
 101           collapseMode: 'mini',
 102           autoScroll: true,
 103           contentEl: east_panel_content_id
 104       });
 105     } else {
 106       var eastPanel = new Ext.Panel({
 107           region: 'east',
 108           layout: 'auto',
 109           //margins: '0 2 0 2',
 110           width: 180,
 111           collapsible: true,
 112           split: true,
 113           hidden: true,
 114           collapseMode: 'mini',
 115           autoScroll: true
 116           //contentEl: ''
 117       });
 118     }
 119
 120
 121     //-------------------------------
 122     // Main Viewport Setup
 123     //-------------------------------
 124     var mainBorderPanel = new Ext.Viewport({
 125        layout: 'border',
 126        items: [{
 127             region: 'north',
 128             layout: 'vBox',
 129             layoutConfig: {
 130                 align: 'stretch',
 131                 pack: 'start'
 132             },
 133             items: [{
 134                     xtype: 'box',
 135                     applyTo: 'header',
 136                     id: 'header-panel',
 137                     height: 30
 138                 },{
 139                     id: 'main_toolbar',
 140                     xtype: 'toolbar',
 141                     //height: 100,
 142                     /*items: [{
 143                         text: "Demo Button",
 144                         handler: function() { quick_msg('Messages can be fun!'); }
 145                     }],*/
 146                     margins: '2 0 0 0'
 147             }],
 148             height: 60
 149        },menuPanel,{
 150             //title: 'Body',
 151             region: 'center',
 152             xtype: 'panel',
 153             //autoScroll: true,
 154             layout: 'fit',
 155             margins: '2 2 2 2',
 156             items: [{
 157                 //title: 'Inner Panel',
 158                 contentEl: 'body_content',
 159                 border: true,
 160                 autoScroll: true
 161             }]
 162             },eastPanel]
 163     });
 164
 165     //-------------------------------
 166     // Menu Bar Setup
 167     //-------------------------------
 168     var main_tb = Ext.getCmp('main_toolbar');
 169
 170     var add_buttons_from_html_left = function(main_tb){
 171         var left_tbar_data = Ext.fly('left_tbar_data');
 172         var div_array = left_tbar_data.query('div');
 173         var div_id = null;
 174         // Loop through each div since it defines a button and link or a spacer and add it to the right side of the toolbar
 175         Ext.each(div_array, function(divobj) {
 176             div_id = divobj.id;
 177             if (div_id == 'spacer'){
 178                 main_tb.add('-');
 179             } else {
 180                 main_tb.add({
 181                     text: div_id,
 182                     handler: function() { goto_url(divobj.getAttribute('href')); }
 183                 });
 184             }
 185         });
 186         //return right_tbar_data;
 187     }
 188
 189     var add_buttons_from_html_right = function(main_tb){
 190         var right_tbar_data = Ext.fly('right_tbar_data');
 191         var div_array = right_tbar_data.query('div');
 192         var div_id = null;
 193         // Loop through each div since it defines a button and link or a spacer and add it to the right side of the toolbar
 194         Ext.each(div_array, function(divobj) {
 195             div_id = divobj.id;
 196             if (div_id == 'spacer'){
 197                 main_tb.add('-');
 198             } else {
 199                 main_tb.add({
 200                     text: div_id,
 201                     handler: function() { goto_url(divobj.getAttribute('href')); }
 202                 });
 203             }
 204         });
 205         //return right_tbar_data;
 206     }
 207
 208     add_buttons_from_html_left(main_tb);
 209
 210     // Shifts the remaining toolbar options to the right side.
 211     main_tb.add({ xtype: 'tbfill' });
 212     var user_info = Ext.fly('login_info');
 213     var logout_url = user_info.getAttribute('logouturl');
 214     var login_url = user_info.getAttribute('loginurl');
 215
 216     if (user_info.getAttribute('authenticated') == 'true') {
 217         main_tb.add({
 218                         xtype: 'tbtext',
 219                         text: 'User: ' + user_info.getAttribute('user')
 220                     });
 221         main_tb.add('-');
 222         add_buttons_from_html_right(main_tb);
 223         main_tb.add('-');
 224         main_tb.add({
 225                         text: 'Logout',
 226                         handler: function() { goto_url(logout_url); }
 227                     });
 228
 229     } else {
 230         main_tb.add({
 231                         text: 'Login',
 232                         handler: function() { goto_url(login_url) }
 233                     });
 234     }
 235
 236     main_tb.doLayout();
 237
 238 });