Roo/bootstrap/panel/Grid.js
[roojs1] / 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  * @param {Object} config A the config object
9   
10  */
11
12
13
14 Roo.bootstrap.panel.Grid = function(config)
15 {
16     
17       
18     this.wrapper = Roo.DomHelper.append(document.body, // wrapper for IE7 strict & safari scroll issue
19         {tag: "div", cls: "roo-layout-grid-wrapper roo-layout-inactive-content"}, true);
20
21     config.el = this.wrapper;
22     //this.el = this.wrapper;
23     
24       if (config.container) {
25         // ctor'ed from a Border/panel.grid
26         
27         
28         this.wrapper.setStyle("overflow", "hidden");
29         this.wrapper.addClass('roo-grid-container');
30
31     }
32     
33     
34     if(config.toolbar){
35         var tool_el = this.wrapper.createChild();    
36         this.toolbar = Roo.factory(config.toolbar);
37         var ti = [];
38         if (config.toolbar.items) {
39             ti = config.toolbar.items ;
40             delete config.toolbar.items ;
41         }
42         
43         var nitems = [];
44         this.toolbar.render(tool_el);
45         for(var i =0;i < ti.length;i++) {
46           //  Roo.log(['add child', items[i]]);
47             nitems.push(this.toolbar.addxtype(Roo.apply({}, ti[i])));
48         }
49         this.toolbar.items = nitems;
50         
51         delete config.toolbar;
52     }
53     
54     Roo.bootstrap.panel.Grid.superclass.constructor.call(this, config);
55     config.grid.scrollBody;
56     config.grid.monitorWindowResize = false; // turn off autosizing
57     config.grid.autoHeight = false;
58     config.grid.autoWidth = false;
59     
60     this.grid = new config.grid.xns[config.grid.xtype](config.grid);
61     
62     if (config.background) {
63         // render grid on panel activation (if panel background)
64         this.on('activate', function(gp) {
65             if (!gp.grid.rendered) {
66                 gp.grid.render(el);
67                 gp.grid.getGridEl().replaceClass("roo-layout-inactive-content", "roo-layout-component-panel");               
68
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     getId : function(){
101         return this.grid.id;
102     },
103     
104     /**
105      * Returns the grid for this panel
106      * @return {Roo.bootstrap.Table} 
107      */
108     getGrid : function(){
109         return this.grid;    
110     },
111     
112     setSize : function(width, height){
113         if(!this.ignoreResize(width, height)){
114             var grid = this.grid;
115             var size = this.adjustForComponents(width, height);
116             var gridel = grid.getGridEl();
117             gridel.setSize(size.width, size.height);
118             /*
119             var thd = grid.getGridEl().select('thead',true).first();
120             var tbd = grid.getGridEl().select('tbody', true).first();
121             if (tbd) {
122                 tbd.setSize(width, height - thd.getHeight());
123             }
124             */
125             grid.autoSize();
126         }
127     },
128      
129     
130     
131     beforeSlide : function(){
132         this.grid.getView().scroller.clip();
133     },
134     
135     afterSlide : function(){
136         this.grid.getView().scroller.unclip();
137     },
138     
139     destroy : function(){
140         this.grid.destroy();
141         delete this.grid;
142         Roo.bootstrap.panel.Grid.superclass.destroy.call(this); 
143     }
144 });