Opened 9 years ago
Last modified 4 years ago
#13964 new defect
scrollbar activates DnD
Reported by: | Adam Peller | Owned by: | Eugene Lazutkin |
---|---|---|---|
Priority: | high | Milestone: | 1.15 |
Component: | DnD | Version: | 1.7.0b1 |
Keywords: | Cc: | Eugene Lazutkin | |
Blocked By: | Blocking: |
Description
http://archive.dojotoolkit.org/dojo-2011-09-21/dojotoolkit/dijit/tests/tree/test_Tree_DnD.html
In the "items" tree in the upper-right hand corner (Apples, Bananas...) click and drag one item in the tree to reorder. See the DnD UI, which will disappear when you're done.
Now click on the scrollbar. Move the mouse back over the tree. You'll see the DnD UI appears again. This only seems to happen if you do a DnD operation first.
Change History (10)
comment:1 Changed 9 years ago by
Component: | Dijit → DnD |
---|---|
Owner: | set to Eugene Lazutkin |
comment:2 Changed 9 years ago by
comment:3 Changed 9 years ago by
link in the description is stale. Try a more recent nightly, or the current one at http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/tree/test_Tree_DnD.html
comment:4 Changed 9 years ago by
This issue seems to have been around forever. It makes dijit.Tree widget difficult to use for larger data sets, or where the node label can be long thus causing horizontal scroll. In absence of reasonable scroll bar presence, perhaps the minimum change would be to provide a dead zone for dnd in the area where scroll bars may/may not be present.
In previous discussion on #10585 a solution of triggering scroll over the tree node only is also discussed. I like that solution as in my view it aligns well with behaviour of other GUI environments that I've used.
comment:5 Changed 9 years ago by
Something like this in the mousedown handler may work too, although it needs to be adjusted for RTL systems where the scrollbar is on the left:
if (evt.offsetX > node.clientWidth) return;
I guess offsetX could be relative to a nested node rather that the node with the scrollbar, so might need to use clientX/clientY instead (and subtract the position of the node).
comment:6 Changed 9 years ago by
I was able to workaround this by using a custom dndSource and in its onMouseDown I do this:
//Prevent drag/drop from happening when user mouses down on scrollbar var isContainer = domClass.contains(e.srcElement, "dojoDndContainerOver"); if(isContainer) return;
Not sure if that's right, but it seems to do the trick for me.
comment:7 Changed 9 years ago by
A variation on the solution above, for dojo 1.7.2 I've modified dijit.tree.dndSource.onMouseDown function so that it returns when triggered from a digitTree element. This way, the drag is only done if you are dragging node(s), but not when dragging a the tree container. Additional code
var cName = e.target.className; if(cName.indexOf("dijitTree ") != -1) { return; }
comment:8 Changed 9 years ago by
The offsetX/Y parameters seem not available on all browsers. I made a small patch that works for me in recent Firefox and Chrome versions, using dojo.position and clientLeft/Width. In dojo.dnd.Source::_legalMouseDown(e):
... if(!dojo.mouseButtons.isLeft(e)){ return false; } // BEGIN INSERT // reject when click originated on vertical scrollbar var pos = dojo.position(e.currentTarget); var left = pos.x+e.currentTarget.clientLeft; var right = left+e.currentTarget.clientWidth; if ( e.clientX < left || e.clientX > right ){ return false; } // END INSERT if(!this.withHandles){ return true; } ...
comment:9 Changed 5 years ago by
Milestone: | tbd → 1.12 |
---|
We should either fix this for 1.12, or close as patchwelcome. Given that some earlier efforts were made to try and fix it, I'm reluctant to close it immediately, so will revisit after 1.11 is released.
comment:10 Changed 4 years ago by
Milestone: | 1.13 → 1.15 |
---|
Ticket planning... move current 1.13 tickets out to 1.15 to make it easier to move tickets into the 1.13 milestone.
I can reduce this to a dnd test case: http://archive.dojotoolkit.org/dojo-2011-09-21/dojotoolkit/dojo/tests/dnd/test_dnd.html
Take one of the containers (e.g. "source 1") and set overflow:scroll. As before, try a drag operation first, then click on the scrollbar. It seems to pick up the last dragged item. Perhaps there's a reference which should be removed on drop?