tvheadend/vendor/ext-3.4.1/docs/source/Resizable.html
Adam Sutton bafcfff42d webui: restructure webui/extjs source files
I want to keep the 3rd-party packages away from the main source
where possible.
2013-06-03 17:11:01 +01:00

784 lines
28 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
<style type="text/css">
.highlight { display: block; background-color: #ddd; }
</style>
<script type="text/javascript">
function highlight() {
document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
}
</script>
</head>
<body onload="prettyPrint(); highlight();">
<pre class="prettyprint lang-js"><span id='Ext-Resizable-method-constructor'><span id='Ext-Resizable'>/**
</span></span> * @class Ext.Resizable
* @extends Ext.util.Observable
* &lt;p&gt;Applies drag handles to an element to make it resizable. The drag handles are inserted into the element
* and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
* the textarea in a div and set 'resizeChild' to true (or to the id of the element), &lt;b&gt;or&lt;/b&gt; set wrap:true in your config and
* the element will be wrapped for you automatically.&lt;/p&gt;
* &lt;p&gt;Here is the list of valid resize handles:&lt;/p&gt;
* &lt;pre&gt;
Value Description
------ -------------------
'n' north
's' south
'e' east
'w' west
'nw' northwest
'sw' southwest
'se' southeast
'ne' northeast
'all' all
&lt;/pre&gt;
* &lt;p&gt;Here's an example showing the creation of a typical Resizable:&lt;/p&gt;
* &lt;pre&gt;&lt;code&gt;
var resizer = new Ext.Resizable('element-id', {
handles: 'all',
minWidth: 200,
minHeight: 100,
maxWidth: 500,
maxHeight: 400,
pinned: true
});
resizer.on('resize', myHandler);
&lt;/code&gt;&lt;/pre&gt;
* &lt;p&gt;To hide a particular handle, set its display to none in CSS, or through script:&lt;br&gt;
* resizer.east.setDisplayed(false);&lt;/p&gt;
* @constructor
* Create a new resizable component
* @param {Mixed} el The id or element to resize
* @param {Object} config configuration options
*/
Ext.Resizable = Ext.extend(Ext.util.Observable, {
constructor: function(el, config){
this.el = Ext.get(el);
if(config &amp;&amp; config.wrap){
config.resizeChild = this.el;
this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : {cls:'xresizable-wrap'});
this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
this.el.setStyle('overflow', 'hidden');
this.el.setPositioning(config.resizeChild.getPositioning());
config.resizeChild.clearPositioning();
if(!config.width || !config.height){
var csize = config.resizeChild.getSize();
this.el.setSize(csize.width, csize.height);
}
if(config.pinned &amp;&amp; !config.adjustments){
config.adjustments = 'auto';
}
}
<span id='Ext-Resizable-property-proxy'> /**
</span> * The proxy Element that is resized in place of the real Element during the resize operation.
* This may be queried using {@link Ext.Element#getBox} to provide the new area to resize to.
* Read only.
* @type Ext.Element
* @property proxy
*/
this.proxy = this.el.createProxy({tag: 'div', cls: 'x-resizable-proxy', id: this.el.id + '-rzproxy'}, Ext.getBody());
this.proxy.unselectable();
this.proxy.enableDisplayMode('block');
Ext.apply(this, config);
if(this.pinned){
this.disableTrackOver = true;
this.el.addClass('x-resizable-pinned');
}
// if the element isn't positioned, make it relative
var position = this.el.getStyle('position');
if(position != 'absolute' &amp;&amp; position != 'fixed'){
this.el.setStyle('position', 'relative');
}
if(!this.handles){ // no handles passed, must be legacy style
this.handles = 's,e,se';
if(this.multiDirectional){
this.handles += ',n,w';
}
}
if(this.handles == 'all'){
this.handles = 'n s e w ne nw se sw';
}
var hs = this.handles.split(/\s*?[,;]\s*?| /);
var ps = Ext.Resizable.positions;
for(var i = 0, len = hs.length; i &lt; len; i++){
if(hs[i] &amp;&amp; ps[hs[i]]){
var pos = ps[hs[i]];
this[pos] = new Ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent, this.handleCls);
}
}
// legacy
this.corner = this.southeast;
if(this.handles.indexOf('n') != -1 || this.handles.indexOf('w') != -1){
this.updateBox = true;
}
this.activeHandle = null;
if(this.resizeChild){
if(typeof this.resizeChild == 'boolean'){
this.resizeChild = Ext.get(this.el.dom.firstChild, true);
}else{
this.resizeChild = Ext.get(this.resizeChild, true);
}
}
if(this.adjustments == 'auto'){
var rc = this.resizeChild;
var hw = this.west, he = this.east, hn = this.north, hs = this.south;
if(rc &amp;&amp; (hw || hn)){
rc.position('relative');
rc.setLeft(hw ? hw.el.getWidth() : 0);
rc.setTop(hn ? hn.el.getHeight() : 0);
}
this.adjustments = [
(he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
(hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1
];
}
if(this.draggable){
this.dd = this.dynamic ?
this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
if(this.constrainTo){
this.dd.constrainTo(this.constrainTo);
}
}
this.addEvents(
<span id='Ext-Resizable-event-beforeresize'> /**
</span> * @event beforeresize
* Fired before resize is allowed. Set {@link #enabled} to false to cancel resize.
* @param {Ext.Resizable} this
* @param {Ext.EventObject} e The mousedown event
*/
'beforeresize',
<span id='Ext-Resizable-event-resize'> /**
</span> * @event resize
* Fired after a resize.
* @param {Ext.Resizable} this
* @param {Number} width The new width
* @param {Number} height The new height
* @param {Ext.EventObject} e The mouseup event
*/
'resize'
);
if(this.width !== null &amp;&amp; this.height !== null){
this.resizeTo(this.width, this.height);
}else{
this.updateChildSize();
}
if(Ext.isIE){
this.el.dom.style.zoom = 1;
}
Ext.Resizable.superclass.constructor.call(this);
},
<span id='Ext-Resizable-cfg-adjustments'> /**
</span> * @cfg {Array/String} adjustments String 'auto' or an array [width, height] with values to be &lt;b&gt;added&lt;/b&gt; to the
* resize operation's new size (defaults to &lt;tt&gt;[0, 0]&lt;/tt&gt;)
*/
adjustments : [0, 0],
<span id='Ext-Resizable-cfg-animate'> /**
</span> * @cfg {Boolean} animate True to animate the resize (not compatible with dynamic sizing, defaults to false)
*/
animate : false,
<span id='Ext-Resizable-cfg-constrainTo'> /**
</span> * @cfg {Mixed} constrainTo Constrain the resize to a particular element
*/
<span id='Ext-Resizable-cfg-disableTrackOver'> /**
</span> * @cfg {Boolean} disableTrackOver True to disable mouse tracking. This is only applied at config time. (defaults to false)
*/
disableTrackOver : false,
<span id='Ext-Resizable-cfg-draggable'> /**
</span> * @cfg {Boolean} draggable Convenience to initialize drag drop (defaults to false)
*/
draggable: false,
<span id='Ext-Resizable-cfg-duration'> /**
</span> * @cfg {Number} duration Animation duration if animate = true (defaults to 0.35)
*/
duration : 0.35,
<span id='Ext-Resizable-cfg-dynamic'> /**
</span> * @cfg {Boolean} dynamic True to resize the element while dragging instead of using a proxy (defaults to false)
*/
dynamic : false,
<span id='Ext-Resizable-cfg-easing'> /**
</span> * @cfg {String} easing Animation easing if animate = true (defaults to &lt;tt&gt;'easingOutStrong'&lt;/tt&gt;)
*/
easing : 'easeOutStrong',
<span id='Ext-Resizable-cfg-enabled'> /**
</span> * @cfg {Boolean} enabled False to disable resizing (defaults to true)
*/
enabled : true,
<span id='Ext-Resizable-property-enabled'> /**
</span> * @property enabled Writable. False if resizing is disabled.
* @type Boolean
*/
<span id='Ext-Resizable-cfg-handles'> /**
</span> * @cfg {String} handles String consisting of the resize handles to display (defaults to undefined).
* Specify either &lt;tt&gt;'all'&lt;/tt&gt; or any of &lt;tt&gt;'n s e w ne nw se sw'&lt;/tt&gt;.
*/
handles : false,
<span id='Ext-Resizable-cfg-multiDirectional'> /**
</span> * @cfg {Boolean} multiDirectional &lt;b&gt;Deprecated&lt;/b&gt;. Deprecated style of adding multi-direction resize handles.
*/
multiDirectional : false,
<span id='Ext-Resizable-cfg-height'> /**
</span> * @cfg {Number} height The height of the element in pixels (defaults to null)
*/
height : null,
<span id='Ext-Resizable-cfg-width'> /**
</span> * @cfg {Number} width The width of the element in pixels (defaults to null)
*/
width : null,
<span id='Ext-Resizable-cfg-heightIncrement'> /**
</span> * @cfg {Number} heightIncrement The increment to snap the height resize in pixels
* (only applies if &lt;code&gt;{@link #dynamic}==true&lt;/code&gt;). Defaults to &lt;tt&gt;0&lt;/tt&gt;.
*/
heightIncrement : 0,
<span id='Ext-Resizable-cfg-widthIncrement'> /**
</span> * @cfg {Number} widthIncrement The increment to snap the width resize in pixels
* (only applies if &lt;code&gt;{@link #dynamic}==true&lt;/code&gt;). Defaults to &lt;tt&gt;0&lt;/tt&gt;.
*/
widthIncrement : 0,
<span id='Ext-Resizable-cfg-minHeight'> /**
</span> * @cfg {Number} minHeight The minimum height for the element (defaults to 5)
*/
minHeight : 5,
<span id='Ext-Resizable-cfg-minWidth'> /**
</span> * @cfg {Number} minWidth The minimum width for the element (defaults to 5)
*/
minWidth : 5,
<span id='Ext-Resizable-cfg-maxHeight'> /**
</span> * @cfg {Number} maxHeight The maximum height for the element (defaults to 10000)
*/
maxHeight : 10000,
<span id='Ext-Resizable-cfg-maxWidth'> /**
</span> * @cfg {Number} maxWidth The maximum width for the element (defaults to 10000)
*/
maxWidth : 10000,
<span id='Ext-Resizable-cfg-minX'> /**
</span> * @cfg {Number} minX The minimum x for the element (defaults to 0)
*/
minX: 0,
<span id='Ext-Resizable-cfg-minY'> /**
</span> * @cfg {Number} minY The minimum x for the element (defaults to 0)
*/
minY: 0,
<span id='Ext-Resizable-cfg-pinned'> /**
</span> * @cfg {Boolean} pinned True to ensure that the resize handles are always visible, false to display them only when the
* user mouses over the resizable borders. This is only applied at config time. (defaults to false)
*/
pinned : false,
<span id='Ext-Resizable-cfg-preserveRatio'> /**
</span> * @cfg {Boolean} preserveRatio True to preserve the original ratio between height
* and width during resize (defaults to false)
*/
preserveRatio : false,
<span id='Ext-Resizable-cfg-resizeChild'> /**
</span> * @cfg {Boolean/String/Element} resizeChild True to resize the first child, or id/element to resize (defaults to false)
*/
resizeChild : false,
<span id='Ext-Resizable-cfg-transparent'> /**
</span> * @cfg {Boolean} transparent True for transparent handles. This is only applied at config time. (defaults to false)
*/
transparent: false,
<span id='Ext-Resizable-cfg-resizeRegion'> /**
</span> * @cfg {Ext.lib.Region} resizeRegion Constrain the resize to a particular region
*/
<span id='Ext-Resizable-cfg-wrap'> /**
</span> * @cfg {Boolean} wrap True to wrap an element with a div if needed (required for textareas and images, defaults to false)
* in favor of the handles config option (defaults to false)
*/
<span id='Ext-Resizable-cfg-handleCls'> /**
</span> * @cfg {String} handleCls A css class to add to each handle. Defaults to &lt;tt&gt;''&lt;/tt&gt;.
*/
<span id='Ext-Resizable-method-resizeTo'> /**
</span> * Perform a manual resize and fires the 'resize' event.
* @param {Number} width
* @param {Number} height
*/
resizeTo : function(width, height){
this.el.setSize(width, height);
this.updateChildSize();
this.fireEvent('resize', this, width, height, null);
},
<span id='Ext-Resizable-method-startSizing'> // private
</span> startSizing : function(e, handle){
this.fireEvent('beforeresize', this, e);
if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler
if(!this.overlay){
this.overlay = this.el.createProxy({tag: 'div', cls: 'x-resizable-overlay', html: '&amp;#160;'}, Ext.getBody());
this.overlay.unselectable();
this.overlay.enableDisplayMode('block');
this.overlay.on({
scope: this,
mousemove: this.onMouseMove,
mouseup: this.onMouseUp
});
}
this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
this.resizing = true;
this.startBox = this.el.getBox();
this.startPoint = e.getXY();
this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
(this.startBox.y + this.startBox.height) - this.startPoint[1]];
this.overlay.setSize(Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true));
this.overlay.show();
if(this.constrainTo) {
var ct = Ext.get(this.constrainTo);
this.resizeRegion = ct.getRegion().adjust(
ct.getFrameWidth('t'),
ct.getFrameWidth('l'),
-ct.getFrameWidth('b'),
-ct.getFrameWidth('r')
);
}
this.proxy.setStyle('visibility', 'hidden'); // workaround display none
this.proxy.show();
this.proxy.setBox(this.startBox);
if(!this.dynamic){
this.proxy.setStyle('visibility', 'visible');
}
}
},
<span id='Ext-Resizable-method-onMouseDown'> // private
</span> onMouseDown : function(handle, e){
if(this.enabled){
e.stopEvent();
this.activeHandle = handle;
this.startSizing(e, handle);
}
},
<span id='Ext-Resizable-method-onMouseUp'> // private
</span> onMouseUp : function(e){
this.activeHandle = null;
var size = this.resizeElement();
this.resizing = false;
this.handleOut();
this.overlay.hide();
this.proxy.hide();
this.fireEvent('resize', this, size.width, size.height, e);
},
<span id='Ext-Resizable-method-updateChildSize'> // private
</span> updateChildSize : function(){
if(this.resizeChild){
var el = this.el;
var child = this.resizeChild;
var adj = this.adjustments;
if(el.dom.offsetWidth){
var b = el.getSize(true);
child.setSize(b.width+adj[0], b.height+adj[1]);
}
// Second call here for IE
// The first call enables instant resizing and
// the second call corrects scroll bars if they
// exist
if(Ext.isIE9m){
setTimeout(function(){
if(el.dom.offsetWidth){
var b = el.getSize(true);
child.setSize(b.width+adj[0], b.height+adj[1]);
}
}, 10);
}
}
},
<span id='Ext-Resizable-method-snap'> // private
</span> snap : function(value, inc, min){
if(!inc || !value){
return value;
}
var newValue = value;
var m = value % inc;
if(m &gt; 0){
if(m &gt; (inc/2)){
newValue = value + (inc-m);
}else{
newValue = value - m;
}
}
return Math.max(min, newValue);
},
<span id='Ext-Resizable-method-resizeElement'> /**
</span> * &lt;p&gt;Performs resizing of the associated Element. This method is called internally by this
* class, and should not be called by user code.&lt;/p&gt;
* &lt;p&gt;If a Resizable is being used to resize an Element which encapsulates a more complex UI
* component such as a Panel, this method may be overridden by specifying an implementation
* as a config option to provide appropriate behaviour at the end of the resize operation on
* mouseup, for example resizing the Panel, and relaying the Panel's content.&lt;/p&gt;
* &lt;p&gt;The new area to be resized to is available by examining the state of the {@link #proxy}
* Element. Example:
&lt;pre&gt;&lt;code&gt;
new Ext.Panel({
title: 'Resize me',
x: 100,
y: 100,
renderTo: Ext.getBody(),
floating: true,
frame: true,
width: 400,
height: 200,
listeners: {
render: function(p) {
new Ext.Resizable(p.getEl(), {
handles: 'all',
pinned: true,
transparent: true,
resizeElement: function() {
var box = this.proxy.getBox();
p.updateBox(box);
if (p.layout) {
p.doLayout();
}
return box;
}
});
}
}
}).show();
&lt;/code&gt;&lt;/pre&gt;
*/
resizeElement : function(){
var box = this.proxy.getBox();
if(this.updateBox){
this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
}else{
this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
}
this.updateChildSize();
if(!this.dynamic){
this.proxy.hide();
}
if(this.draggable &amp;&amp; this.constrainTo){
this.dd.resetConstraints();
this.dd.constrainTo(this.constrainTo);
}
return box;
},
<span id='Ext-Resizable-method-constrain'> // private
</span> constrain : function(v, diff, m, mx){
if(v - diff &lt; m){
diff = v - m;
}else if(v - diff &gt; mx){
diff = v - mx;
}
return diff;
},
<span id='Ext-Resizable-method-onMouseMove'> // private
</span> onMouseMove : function(e){
if(this.enabled &amp;&amp; this.activeHandle){
try{// try catch so if something goes wrong the user doesn't get hung
if(this.resizeRegion &amp;&amp; !this.resizeRegion.contains(e.getPoint())) {
return;
}
//var curXY = this.startPoint;
var curSize = this.curSize || this.startBox,
x = this.startBox.x, y = this.startBox.y,
ox = x,
oy = y,
w = curSize.width,
h = curSize.height,
ow = w,
oh = h,
mw = this.minWidth,
mh = this.minHeight,
mxw = this.maxWidth,
mxh = this.maxHeight,
wi = this.widthIncrement,
hi = this.heightIncrement,
eventXY = e.getXY(),
diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0])),
diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1])),
pos = this.activeHandle.position,
tw,
th;
switch(pos){
case 'east':
w += diffX;
w = Math.min(Math.max(mw, w), mxw);
break;
case 'south':
h += diffY;
h = Math.min(Math.max(mh, h), mxh);
break;
case 'southeast':
w += diffX;
h += diffY;
w = Math.min(Math.max(mw, w), mxw);
h = Math.min(Math.max(mh, h), mxh);
break;
case 'north':
diffY = this.constrain(h, diffY, mh, mxh);
y += diffY;
h -= diffY;
break;
case 'west':
diffX = this.constrain(w, diffX, mw, mxw);
x += diffX;
w -= diffX;
break;
case 'northeast':
w += diffX;
w = Math.min(Math.max(mw, w), mxw);
diffY = this.constrain(h, diffY, mh, mxh);
y += diffY;
h -= diffY;
break;
case 'northwest':
diffX = this.constrain(w, diffX, mw, mxw);
diffY = this.constrain(h, diffY, mh, mxh);
y += diffY;
h -= diffY;
x += diffX;
w -= diffX;
break;
case 'southwest':
diffX = this.constrain(w, diffX, mw, mxw);
h += diffY;
h = Math.min(Math.max(mh, h), mxh);
x += diffX;
w -= diffX;
break;
}
var sw = this.snap(w, wi, mw);
var sh = this.snap(h, hi, mh);
if(sw != w || sh != h){
switch(pos){
case 'northeast':
y -= sh - h;
break;
case 'north':
y -= sh - h;
break;
case 'southwest':
x -= sw - w;
break;
case 'west':
x -= sw - w;
break;
case 'northwest':
x -= sw - w;
y -= sh - h;
break;
}
w = sw;
h = sh;
}
if(this.preserveRatio){
switch(pos){
case 'southeast':
case 'east':
h = oh * (w/ow);
h = Math.min(Math.max(mh, h), mxh);
w = ow * (h/oh);
break;
case 'south':
w = ow * (h/oh);
w = Math.min(Math.max(mw, w), mxw);
h = oh * (w/ow);
break;
case 'northeast':
w = ow * (h/oh);
w = Math.min(Math.max(mw, w), mxw);
h = oh * (w/ow);
break;
case 'north':
tw = w;
w = ow * (h/oh);
w = Math.min(Math.max(mw, w), mxw);
h = oh * (w/ow);
x += (tw - w) / 2;
break;
case 'southwest':
h = oh * (w/ow);
h = Math.min(Math.max(mh, h), mxh);
tw = w;
w = ow * (h/oh);
x += tw - w;
break;
case 'west':
th = h;
h = oh * (w/ow);
h = Math.min(Math.max(mh, h), mxh);
y += (th - h) / 2;
tw = w;
w = ow * (h/oh);
x += tw - w;
break;
case 'northwest':
tw = w;
th = h;
h = oh * (w/ow);
h = Math.min(Math.max(mh, h), mxh);
w = ow * (h/oh);
y += th - h;
x += tw - w;
break;
}
}
this.proxy.setBounds(x, y, w, h);
if(this.dynamic){
this.resizeElement();
}
}catch(ex){}
}
},
<span id='Ext-Resizable-method-handleOver'> // private
</span> handleOver : function(){
if(this.enabled){
this.el.addClass('x-resizable-over');
}
},
<span id='Ext-Resizable-method-handleOut'> // private
</span> handleOut : function(){
if(!this.resizing){
this.el.removeClass('x-resizable-over');
}
},
<span id='Ext-Resizable-method-getEl'> /**
</span> * Returns the element this component is bound to.
* @return {Ext.Element}
*/
getEl : function(){
return this.el;
},
<span id='Ext-Resizable-method-getResizeChild'> /**
</span> * Returns the resizeChild element (or null).
* @return {Ext.Element}
*/
getResizeChild : function(){
return this.resizeChild;
},
<span id='Ext-Resizable-method-destroy'> /**
</span> * Destroys this resizable. If the element was wrapped and
* removeEl is not true then the element remains.
* @param {Boolean} removeEl (optional) true to remove the element from the DOM
*/
destroy : function(removeEl){
Ext.destroy(this.dd, this.overlay, this.proxy);
this.overlay = null;
this.proxy = null;
var ps = Ext.Resizable.positions;
for(var k in ps){
if(typeof ps[k] != 'function' &amp;&amp; this[ps[k]]){
this[ps[k]].destroy();
}
}
if(removeEl){
this.el.update('');
Ext.destroy(this.el);
this.el = null;
}
this.purgeListeners();
},
<span id='Ext-Resizable-method-syncHandleHeight'> syncHandleHeight : function(){
</span> var h = this.el.getHeight(true);
if(this.west){
this.west.el.setHeight(h);
}
if(this.east){
this.east.el.setHeight(h);
}
}
});
// private
// hash to map config positions to true positions
Ext.Resizable.positions = {
n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast'
};
Ext.Resizable.Handle = Ext.extend(Object, {
constructor : function(rz, pos, disableTrackOver, transparent, cls){
if(!this.tpl){
// only initialize the template if resizable is used
var tpl = Ext.DomHelper.createTemplate(
{tag: 'div', cls: 'x-resizable-handle x-resizable-handle-{0}'}
);
tpl.compile();
Ext.Resizable.Handle.prototype.tpl = tpl;
}
this.position = pos;
this.rz = rz;
this.el = this.tpl.append(rz.el.dom, [this.position], true);
this.el.unselectable();
if(transparent){
this.el.setOpacity(0);
}
if(!Ext.isEmpty(cls)){
this.el.addClass(cls);
}
this.el.on('mousedown', this.onMouseDown, this);
if(!disableTrackOver){
this.el.on({
scope: this,
mouseover: this.onMouseOver,
mouseout: this.onMouseOut
});
}
},
// private
afterResize : function(rz){
// do nothing
},
// private
onMouseDown : function(e){
this.rz.onMouseDown(this, e);
},
// private
onMouseOver : function(e){
this.rz.handleOver(this, e);
},
// private
onMouseOut : function(e){
this.rz.handleOut(this, e);
},
// private
destroy : function(){
Ext.destroy(this.el);
this.el = null;
}
});
</pre>
</body>
</html>