scrollbar activates DnD

[Adam Peller]

​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.

[Adam Peller]

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?

[bill]

See also #13946 and #10585.

[Adam Peller]

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

[kuba]

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.

[bill]

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).

[jackmon]

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.

[kuba]

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;
}

[hendrikvanantwerpen]

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; }

   ...

[dylan]

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.

[dylan]

Ticket planning... move current 1.13 tickets out to 1.15 to make it easier to move tickets into the 1.13 milestone.