git.roojs.org Git - roojs1/blob - Roo/bootstrap/panel/Grid.js

   1
   2 /**
   3  * @class Roo.bootstrap.panel.Grid
   4  * @extends Roo.bootstrap.panel.Content
   5  * @constructor
   6  * Create a new GridPanel.
   7  * @cfg {Roo.bootstrap.Table} grid The grid for this panel
   8  * @cfg {Roo.bootstrap.nav.Simplebar} toolbar the toolbar at the top of the grid.
   9  * @param {Object} config A the config object
  10
  11  */
  12
  13
  14
  15 Roo.bootstrap.panel.Grid = function(config)
  16 {
  17
  18
  19     this.wrapper = Roo.DomHelper.append(document.body, // wrapper for IE7 strict & safari scroll issue
  20         {tag: "div", cls: "roo-layout-grid-wrapper roo-layout-inactive-content"}, true);
  21
  22     config.el = this.wrapper;
  23     //this.el = this.wrapper;
  24
  25       if (config.container) {
  26         // ctor'ed from a Border/panel.grid
  27
  28
  29         this.wrapper.setStyle("overflow", "hidden");
  30         this.wrapper.addClass('roo-grid-container');
  31
  32     }
  33
  34
  35     if(config.toolbar){
  36         var tool_el = this.wrapper.createChild();
  37         this.toolbar = Roo.factory(config.toolbar);
  38         var ti = [];
  39         if (config.toolbar.items) {
  40             ti = config.toolbar.items ;
  41             delete config.toolbar.items ;
  42         }
  43
  44         var nitems = [];
  45         this.toolbar.render(tool_el);
  46         for(var i =0;i < ti.length;i++) {
  47           //  Roo.log(['add child', items[i]]);
  48             nitems.push(this.toolbar.addxtype(Roo.apply({}, ti[i])));
  49         }
  50         this.toolbar.items = nitems;
  51
  52         delete config.toolbar;
  53     }
  54
  55     Roo.bootstrap.panel.Grid.superclass.constructor.call(this, config);
  56     config.grid.scrollBody = true;;
  57     config.grid.monitorWindowResize = false; // turn off autosizing
  58     config.grid.autoHeight = false;
  59     config.grid.autoWidth = false;
  60
  61     this.grid = new config.grid.xns[config.grid.xtype](config.grid);
  62
  63     if (config.background) {
  64         // render grid on panel activation (if panel background)
  65         this.on('activate', function(gp) {
  66             if (!gp.grid.rendered) {
  67                 gp.grid.render(this.wrapper);
  68                 gp.grid.getGridEl().replaceClass("roo-layout-inactive-content", "roo-layout-component-panel");
  69             }
  70         });
  71
  72     } else {
  73         this.grid.render(this.wrapper);
  74         this.grid.getGridEl().replaceClass("roo-layout-inactive-content", "roo-layout-component-panel");
  75
  76     }
  77     //this.wrapper.dom.appendChild(config.grid.getGridEl().dom);
  78     // ??? needed ??? config.el = this.wrapper;
  79
  80
  81
  82
  83     // xtype created footer. - not sure if will work as we normally have to render first..
  84     if (this.footer && !this.footer.el && this.footer.xtype) {
  85
  86         var ctr = this.grid.getView().getFooterPanel(true);
  87         this.footer.dataSource = this.grid.dataSource;
  88         this.footer = Roo.factory(this.footer, Roo);
  89         this.footer.render(ctr);
  90
  91     }
  92
  93
  94
  95
  96
  97 };
  98
  99 Roo.extend(Roo.bootstrap.panel.Grid, Roo.bootstrap.panel.Content,
 100 {
 101
 102     getId : function(){
 103         return this.grid.id;
 104     },
 105
 106     /**
 107      * Returns the grid for this panel
 108      * @return {Roo.bootstrap.Table}
 109      */
 110     getGrid : function(){
 111         return this.grid;
 112     },
 113
 114     setSize : function(width, height)
 115     {
 116
 117         //if(!this.ignoreResize(width, height)){
 118             var grid = this.grid;
 119             var size = this.adjustForComponents(width, height);
 120             // tfoot is not a footer?
 121
 122
 123             var gridel = grid.getGridEl();
 124             gridel.setSize(size.width, size.height);
 125
 126             var tbd = grid.getGridEl().select('tbody', true).first();
 127             var thd = grid.getGridEl().select('thead',true).first();
 128             var tbf= grid.getGridEl().select('tfoot', true).first();
 129
 130             if (tbf) {
 131                 size.height -= tbf.getHeight();
 132             }
 133             if (thd) {
 134                 size.height -= thd.getHeight();
 135             }
 136
 137             tbd.setSize(size.width, size.height );
 138             // this is for the account management tab -seems to work there.
 139             var thd = grid.getGridEl().select('thead',true).first();
 140             //if (tbd) {
 141             //    tbd.setSize(size.width, size.height - thd.getHeight());
 142             //}
 143
 144             grid.autoSize();
 145         //}
 146
 147     },
 148
 149
 150
 151     beforeSlide : function(){
 152         this.grid.getView().scroller.clip();
 153     },
 154
 155     afterSlide : function(){
 156         this.grid.getView().scroller.unclip();
 157     },
 158
 159     destroy : function(){
 160         this.grid.destroy();
 161         delete this.grid;
 162         Roo.bootstrap.panel.Grid.superclass.destroy.call(this);
 163     }
 164 });