Before drop event

[GoogleCodeExporter]

Is possible to setup function for event "before drop" of new connection.
Use Case:
1. I have source Node
2. Click on Node and holde mouse
3. holding mouse button and moving mouse starts to create open connection (no 
end-point)
4. stop holding mouse button -> drop connection 
---------------
current state connection is removed
better I want have function to create new node undred connection and link it 
the new connection

Thx

Original issue reported on code.google.com by stransky...@gmail.com on 4 Feb 2012 at 5:11

[GoogleCodeExporter]

IU found solution but perhaps will be better do it in plugin as funciton...

here is my init code for jsPlumb:

//bind mouse up on BODY element
$("body").bind("mouseup", function(event){
  $("body").data("mouseuppos",{pageX:event.pageX,pageY:event.pageY,el:""});
});
//bind mouse up on typical node element differnce is in storing data in el
$(".w").live("mouseup",function(event){
  id = $(event.target).parent().attr("id");
  $("body").data("mouseuppos",{pageX:event.pageX,pageY:event.pageY,el:id});
});

jsPlumb.makeTarget($("body"), {
  endpoint:{
    anchor:"Continuous",
    id:UUID.create(),
    hoverPaintStyle:{
      lineWidth:2,
      strokeStyle:"#2e2aF8"
    }
}
});

jsPlumb.bind("beforeDrop", function(connection){
  sourceID = connection.sourceId;
  targetID = $("body").data("mouseuppos").el;
  if(targetID==""){
    targetID = UUID.create();
    !!! here is code for adding new NODE targetID
    !!! here is code for Connection sourceID,targetID
  }
  else{
    !!! here is code for Connection sourceID,targetID
  }
  return false;
});

perhaps it is not so clean solution but works pretty well

Original comment by stransky...@gmail.com on 4 Feb 2012 at 6:57

[GoogleCodeExporter]

Seems to me that there is bug in makeTarget on body element.
when document size change body target is not reflecting this issue try to 
makeTarget on body click wherever on screen  and beforeDrop event is triggered, 
but if you click outside of formal screensize (holding button an moving out of 
basic view) there no event is triggered.
:(

Original comment by stransky...@gmail.com on 4 Feb 2012 at 8:10

[GoogleCodeExporter]

I made warkaround but it is not so nice...
---------------------------------
$.FNaddConnectionItem and $.FNaddNodeItem are my functions to add more detailed 
nodes and connection
I use one object #map, that is sized with window size and storing data into 
BODY element
in chrome it works nice with JQuery
-------------------------
$(window).resize(function(){
  newWidth = window.innerWidth+window.pageXOffset;
  newHeight = window.innerHeight+window.pageYOffset;
  $("#map").css({"position": "absolute","width":newWidth+"px","height":newHeight+"px"});
});

$(window).scroll(function(){
  newWidth = window.innerWidth+window.pageXOffset;
  newHeight = window.innerHeight+window.pageYOffset;
  $("#map").css({"position": "absolute","width":newWidth+"px","height":newHeight+"px"});
});

$("#map").bind("mouseup", function(event){
  $("body").data("mouseuppos",{pageX:event.pageX,pageY:event.pageY,el:""});
});
$(".w").live("mouseup",function(event){
  id = $(event.target).parent().attr("id");
  $("body").data("mouseuppos",{pageX:event.pageX,pageY:event.pageY,el:id});
});

jsPlumb.makeTarget($("#map"), {
  endpoint:{
    anchor:"Continuous",
    id:UUID.create(),
    hoverPaintStyle:{
      lineWidth:2,
      strokeStyle:"#2e2aF8"
    }
  }
});

jsPlumb.bind("beforeDrop", function(connection){
  sourceID = connection.sourceId;
  targetID = $("body").data("mouseuppos").el;
  if(targetID==""){ 
    targetID = UUID.create();
    $.FNaddNodeItem($("body").data("mouseuppos").pageY+"px",$("body").data("mouseuppos").pageX+"px","",targetID,'','',"#map");
    $.FNaddConnectionItem(sourceID,targetID, '', UUID.create(), '', "#map");
  }
  else{
    $.FNaddConnectionItem(sourceID,targetID, '', UUID.create(), '', "#map");
  }
  return false;
});

Original comment by stransky...@gmail.com on 4 Feb 2012 at 9:01

[GoogleCodeExporter]

makeTarget depends on the droppable stuff in whatever library you're using.  so 
the failure you're seeing is caused by jQuery.

Original comment by simon.po...@gmail.com on 22 Feb 2012 at 11:43

[GoogleCodeExporter]

It seems correct.. sorry and thanks

Original comment by stransky...@gmail.com on 23 Feb 2012 at 10:15

[GoogleCodeExporter]

ok cool - i'll close this.

Original comment by simon.po...@gmail.com on 23 Feb 2012 at 10:30

• Changed state: Invalid