X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=Roo%2FViewPanel.js;h=7ca1e2ec45b37dc4b20c4b6f0825133b93974830;hb=refs%2Fheads%2Fwip_leon_T7094_logo_image_upload_in_boilerplate;hp=d938e741a905dbfb160c6bcc0ca20dcc09027682;hpb=48a7254fe18f20ff8ea17aa9c0d99db10505e5f2;p=roojs1

diff --git a/Roo/ViewPanel.js b/Roo/ViewPanel.js
index d938e741a9..7ca1e2ec45 100644
--- a/Roo/ViewPanel.js
+++ b/Roo/ViewPanel.js
@@ -8,144 +8,79 @@
  * Fork - LGPL
  * <script type="text/javascript">
  */
- 
+
 /**
- * @class Roo.grid.ViewPanel
- * @extends Roo.grid.Grid
- * Class for creating and editable grid.
- * @param {String/HTMLElement/Roo.Element} container The element into which this grid will be rendered - 
- * The container MUST have some type of size defined for the grid to fill. The container will be 
- * automatically set to position relative if it isn't already.
- * @param {Object} dataSource The data model to bind to
- * @param {Object} colModel The column model with info about this grid's columns
+ * @class Roo.GridPanel
+ * @extends Roo.ContentPanel
+ * @constructor
+ * Create a new GridPanel.
+ * @param {Roo.grid.Grid} grid The grid for this panel
+ * @param {String/Object} config A string to set only the panel's title, or a config object
  */
-
-Roo.grid.ViewPanel = function(container, config){
-    Roo.grid.ViewPanel.superclass.constructor.call(this, container, config);
-    this.getGridEl().addClass("xedit-grid");
-
-    if(!this.selModel){
-        this.selModel = new Roo.grid.CellSelectionModel();
+Roo.ViewPanel = function(el, config){
+     
+    this.wrapper = Roo.DomHelper.append(document.body, // wrapper for IE7 strict & safari scroll issue
+        {tag: "div", cls: "x-layout-grid-wrapper x-layout-inactive-content"}, true);
+        
+    this.wrapper.dom.appendChild(el.dom);
+    
+    Roo.ViewPanel.superclass.constructor.call(this, this.wrapper, config);
+    
+    if(this.toolbar){
+        this.toolbar.el.insertBefore(this.wrapper.dom.firstChild);
     }
-
-    this.activeEditor = null;
-
-	this.addEvents({
-	    /**
-	     * @event beforeedit
-	     * Fires before cell editing is triggered. The edit event object has the following properties <br />
-	     * <ul style="padding:5px;padding-left:16px;">
-	     * <li>grid - This grid</li>
-	     * <li>record - The record being edited</li>
-	     * <li>field - The field name being edited</li>
-	     * <li>value - The value for the field being edited.</li>
-	     * <li>row - The grid row index</li>
-	     * <li>column - The grid column index</li>
-	     * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
-	     * </ul>
-	     * @param {Object} e An edit event (see above for description)
-	     */
-	    "beforeedit" : true,
-	    /**
-	     * @event afteredit
-	     * Fires after a cell is edited. <br />
-	     * <ul style="padding:5px;padding-left:16px;">
-	     * <li>grid - This grid</li>
-	     * <li>record - The record being edited</li>
-	     * <li>field - The field name being edited</li>
-	     * <li>value - The value being set</li>
-	     * <li>originalValue - The original value for the field, before the edit.</li>
-	     * <li>row - The grid row index</li>
-	     * <li>column - The grid column index</li>
-	     * </ul>
-	     * @param {Object} e An edit event (see above for description)
-	     */
-	    "afteredit" : true,
-	    /**
-	     * @event validateedit
-	     * Fires after a cell is edited, but before the value is set in the record. 
-         * You can use this to modify the value being set in the field, Return false
-	     * to cancel the change. The edit event object has the following properties <br />
-	     * <ul style="padding:5px;padding-left:16px;">
-         * <li>editor - This editor</li>
-	     * <li>grid - This grid</li>
-	     * <li>record - The record being edited</li>
-	     * <li>field - The field name being edited</li>
-	     * <li>value - The value being set</li>
-	     * <li>originalValue - The original value for the field, before the edit.</li>
-	     * <li>row - The grid row index</li>
-	     * <li>column - The grid column index</li>
-	     * <li>cancel - Set this to true to cancel the edit or return false from your handler.</li>
-	     * </ul>
-	     * @param {Object} e An edit event (see above for description)
-	     */
-	    "validateedit" : true
-	});
-    this.on("bodyscroll", this.stopEditing,  this);
-    this.on(this.clicksToEdit == 1 ? "cellclick" : "celldblclick", this.onCellDblClick,  this);
+    // xtype created footer. - not sure if will work as we normally have to render first..
+    if (this.footer && !this.footer.el && this.footer.xtype) {
+        
+        this.footer.container = this.wrapper.el; // this.getView().getFooterPanel(true);
+        this.footer.dataSource = this.view.store;
+        this.footer = Roo.factory(this.footer, Roo);
+        
+    }
+    //??? create teh view???
+    
+    //grid.monitorWindowResize = false; // turn off autosizing
+    //grid.autoHeight = false;
+    //grid.autoWidth = false;
+    //this.grid = grid;
+    //this.grid.getGridEl().replaceClass("x-layout-inactive-content", "x-layout-component-panel");
 };
 
-
-Roo.extend(Roo.grid.ViewPanel, Roo.grid.Grid, {
+Roo.extend(Roo.ViewPanel, Roo.ContentPanel, {
     
-    // private
-    rendered : false,
+    autoCreate : true,
+    getId : function(){
+        return this.view.id;
+    },
     
     /**
-    * @cfg {Boolean} autoWidth True to set the grid's width to the default total width of the grid's columns instead
-    * of a fixed width. Default is false.
-    */
-    /**
-    * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if autoHeight is not on.
-    */
-    /**
-     * Called once after all setup has been completed and the grid is ready to be rendered.
-     * @return {Roo.grid.Grid} this
+     * Returns the grid for this panel
+     * @return {Roo.grid.Grid} 
      */
-    render : function()
-    {
-        var c = this.container;
-        // try to detect autoHeight/width mode
-        if((!c.dom.offsetHeight || c.dom.offsetHeight < 20) || c.getStyle("height") == "auto"){
-    	    this.autoHeight = true;
-    	}
-    	var view = this.getView();
-        view.init(this);
-
-        c.on("click", this.onClick, this);
-        c.on("dblclick", this.onDblClick, this);
-        c.on("contextmenu", this.onContextMenu, this);
-        c.on("keydown", this.onKeyDown, this);
-
-        this.relayEvents(c, ["mousedown","mouseup","mouseover","mouseout","keypress"]);
-
-        this.getSelectionModel().init(this);
-
-        view.render();
-
-        if(this.loadMask){
-            this.loadMask = new Roo.LoadMask(this.container,
-                    Roo.apply({store:this.dataSource}, this.loadMask));
-        }
-        
-        
-        if (this.toolbar && this.toolbar.xtype) {
-            this.toolbar.container = this.getView().getHeaderPanel(true);
-            this.toolbar = new Roo.Toolbar(this.toolbar);
-        }
-        if (this.footer && this.footer.xtype) {
-            this.footer.dataSource = this.getDataSource();
-            this.footer.container = this.getView().getFooterPanel(true);
-            this.footer = Roo.factory(this.footer, Roo);
-        }
-        if (this.dropTarget && this.dropTarget.xtype) {
-            delete this.dropTarget.xtype;
-            this.dropTarget =  new Roo.dd.DropTarget(this.getView().mainBody, this.dropTarget);
+    getGrid : function(){
+        return this.view;    
+    },
+    
+    setSize : function(width, height){
+        if(!this.ignoreResize(width, height)){
+            var grid = this.grid;
+            var size = this.adjustForComponents(width, height);
+            grid.getGridEl().setSize(size.width, size.height);
+            grid.autoSize();
         }
-        
-        
-        this.rendered = true;
-        this.fireEvent('render', this);
-        return this;
+    },
+    
+    beforeSlide : function(){
+        this.grid.getView().scroller.clip();
+    },
+    
+    afterSlide : function(){
+        this.grid.getView().scroller.unclip();
+    },
+    
+    destroy : function(){
+        this.grid.destroy();
+        delete this.grid;
+        Roo.GridPanel.superclass.destroy.call(this); 
     }
 });
\ No newline at end of file