Upgrade to ExtJS 3.3.1 - Released 11/30/2010
[extjs.git] / examples / docs / source / PanelResizer.html
1 <html>
2 <head>
3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
4   <title>The source code</title>
5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
7 </head>
8 <body  onload="prettyPrint();">
9     <pre class="prettyprint lang-js">/*!
10  * Ext JS Library 3.3.1
11  * Copyright(c) 2006-2010 Sencha Inc.
12  * licensing@sencha.com
13  * http://www.sencha.com/license
14  */
15 Ext.ux.PanelResizer = Ext.extend(Ext.util.Observable, {
16     minHeight: 0,
17     maxHeight:10000000,
18
19     constructor: function(config){
20         Ext.apply(this, config);
21         this.events = {};
22         Ext.ux.PanelResizer.superclass.constructor.call(this, config);
23     },
24
25     init : function(p){
26         this.panel = p;
27
28         if(this.panel.elements.indexOf('footer')==-1){
29             p.elements += ',footer';
30         }
31         p.on('render', this.onRender, this);
32     },
33
34     onRender : function(p){
35         this.handle = p.footer.createChild({cls:'x-panel-resize'});
36
37         this.tracker = new Ext.dd.DragTracker({
38             onStart: this.onDragStart.createDelegate(this),
39             onDrag: this.onDrag.createDelegate(this),
40             onEnd: this.onDragEnd.createDelegate(this),
41             tolerance: 3,
42             autoStart: 300
43         });
44         this.tracker.initEl(this.handle);
45         p.on('beforedestroy', this.tracker.destroy, this.tracker);
46     },
47
48         // private
49     onDragStart: function(e){
50         this.dragging = true;
51         this.startHeight = this.panel.el.getHeight();
52         this.fireEvent('dragstart', this, e);
53     },
54
55         // private
56     onDrag: function(e){
57         this.panel.setHeight((this.startHeight-this.tracker.getOffset()[1]).constrain(this.minHeight, this.maxHeight));
58         this.fireEvent('drag', this, e);
59     },
60
61         // private
62     onDragEnd: function(e){
63         this.dragging = false;
64         this.fireEvent('dragend', this, e);
65     }
66 });
67 Ext.preg('panelresizer', Ext.ux.PanelResizer);</pre>    
68 </body>
69 </html>