Hareeshchandera / jsplumb

Automatically exported from code.google.com/p/jsplumb
0 stars 0 forks source link

another test for 'isDraggable' -jQuery / OR forced draggable #165

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
This a small request to improve the usability of this nice library from the 
viewpoint of the programmer. 

As written in the documentation, we should use the draggable function in this 
library instead of the one in e.g. jQuery. The test to check if an element is 
draggable is done by checking the 'ui-draggable' css-class (as seen in the 
code). This is a bit strange, a gives some strange problems.

In my application a user can drag-and-drop the nodes from a toolbox. I use the 
drop functionality of jQuery UI (1.8). But jQuery adds also the class 
'ui-draggable' to the node a user drag-and-drops. When I call the function 
jsPlumb.draggable on the node, it didn't worked properly. (because it was 
already draggable). The work-around for now:

var node = ...
node.removeClass("ui-draggable");
jsPlumb.draggable(node);

This is a bit odd, and to improve the library I suggest:
- force registering the draggable with another parameter
- or check the 'is draggable' not with the css-class that jQuery already uses 
(ui-draggable).

- jsplumb 1.3.3
- jQuery UI 1.8
- jQuery 1.7

Original issue reported on code.google.com by j.verdur...@2bmore.nl on 7 Jan 2012 at 2:55

GoogleCodeExporter commented 8 years ago
the reason that test is how it is is because once an element is registered as 
draggable with jquery, a subsequent draggable call cancels the previous one.   
in this jsfiddle you can see that behaviour:

http://jsfiddle.net/sporritt/E4HAU/

if jsPlumb were to force a draggable call in the way you have described it 
could possibly break someone else's code on the page.

testing for 'ui-draggable' is not at all strange since that is, as you pointed 
out, the class that jquery assigns.

Original comment by simon.po...@gmail.com on 7 Jan 2012 at 9:04

GoogleCodeExporter commented 8 years ago
closing this out.  

Original comment by simon.po...@gmail.com on 9 Jan 2012 at 2:00

GoogleCodeExporter commented 8 years ago
For the completeness: I was not proposing to call 

node.removeClass("ui-draggable")

in the jsPlumb library. But to add 

node.addClass("jsplumb-draggable") 

in jsplumb.draggable function. The isDraggable function would check the 
"jsplumb-draggable" class instead of "ui-draggable". I can not imagine that 
this will break anything, but probably i'm wrong ;)

Thx anyway. 

Original comment by j.verdur...@2bmore.nl on 10 Jan 2012 at 7:51

GoogleCodeExporter commented 8 years ago
i did think about adding a jsplumb specific class at some stage but it wouldn't 
provide any benefit for me - i still can't reinitialise a draggable.  although 
i suppose i could at least return false from that method if jsPlumb couldn't 
init the draggable.  what do you think?

Original comment by simon.po...@gmail.com on 10 Jan 2012 at 8:58

GoogleCodeExporter commented 8 years ago
Well, it should fix this case:

http://jsfiddle.net/rQUvj/

Original comment by j.verdur...@2bmore.nl on 10 Jan 2012 at 9:13

GoogleCodeExporter commented 8 years ago
in that jsFiddle you're making calls to .draggable() for no reason, though...i 
don't see what that illustrates about jsPlumb.  you have to use 
jsPlumb.draggable to make it know about stuff it needs to track.

Original comment by simon.po...@gmail.com on 10 Jan 2012 at 9:34

GoogleCodeExporter commented 8 years ago
Well I find it unexpected that w1 isnot working. But it's not a big deal, as I 
said: "This a small request to improve the usability of this nice library from 
the viewpoint of the programmer. "

Original comment by j.verdur...@2bmore.nl on 11 Jan 2012 at 7:57

GoogleCodeExporter commented 8 years ago
the point is that once something has been made draggable, subsequent calls to 
re-initialise the draggable state blow away previous ones. jsPlumb has to be a 
good citizen and not do things like that.

i do not know why you are surprised W1 is not working.  if you don't use 
jsPlumb's draggable method then it will not know about that element!

Original comment by simon.po...@gmail.com on 11 Jan 2012 at 8:18

GoogleCodeExporter commented 8 years ago
I use the jsPlumb's draggable method for W1 (I know, I first used the 'wrong' 
one). But OK, I find it surprising - but that is subjective. :) 

Original comment by j.verdur...@2bmore.nl on 11 Jan 2012 at 8:51