PDA

View Full Version : [OPEN] [FIXED-264][2.x,3.x] Constrained drag within scrolling element



Condor
15 Sep 2009, 2:46 AM
The drag constrains are calculated incorrectly within a scrolling element.

Example:

<script type="text/javascript">
Ext.onReady(function(){
var win = new Ext.Window({
title: 'Window',
x: 100,
y: 100,
width: 200,
height: 200,
renderTo: 'container',
constrain: true
});
win.show();
Ext.get('container').on('scroll', function(){
win.doConstrain();
});
});
</script>
<div id="container" style="left: 100px; top: 100px; width: 400px; height: 400px; overflow: scroll; position: relative; border: 1px solid red;">
<div id="scroller" style="width: 2000px; height: 2000px;">&nbsp;</div>
</div>
(scroll down and/or right and try moving the window)

IMHO the fix should be:

Ext.override(Ext.dd.DragDrop, {
constrainTo : function(constrainTo, pad, inContent){
if(typeof pad == "number"){
pad = {left: pad, right:pad, top:pad, bottom:pad};
}
pad = pad || this.defaultPadding;
var b = Ext.get(this.getEl()).getBox();
var ce = Ext.get(constrainTo);
var s = ce.getScroll();
var c, cd = ce.dom;
if(cd == document.body){
c = {x: s.left, y: s.top, width: Ext.lib.Dom.getViewWidth(), height: Ext.lib.Dom.getViewHeight()};
}else{
var xy = ce.getXY();
c = {x: xy[0]/*+s.left*/, y: xy[1]/*+s.top*/, width: cd.clientWidth, height: cd.clientHeight};
}
var topSpace = b.y - c.y;
var leftSpace = b.x - c.x;
this.resetConstraints();
this.setXConstraint(leftSpace - (pad.left||0),
c.width - leftSpace - b.width - (pad.right||0),
this.xTickSize
);
this.setYConstraint(topSpace - (pad.top||0),
c.height - topSpace - b.height - (pad.bottom||0),
this.yTickSize
);
}
});

Condor
23 Sep 2009, 11:16 PM
*** Bump ***

evant
24 Sep 2009, 7:51 PM
Fix applied to svn in rev #5409 for patch release 3.0.3.