title: Unable to create straight line connection in JSPlumb
body: <p>I'm trying to create a straight line connection in JSPlumb between two endpoints. 
  When I try to connect to the endpoint, the source point is dragged instead of creating a straight line connection.</p>
  
  <p>Here the fiddle:
  <a href="http://jsfiddle.net/dutchman71/aMksZ/2/" rel="noreferrer">http://jsfiddle.net/dutchman71/aMksZ/2/</a></p>
  
  <p>Any help appreciated.</p>
  
  <pre><code>            var endpointOptions = { 
                      anchor:"BottomCenter",
                      maxConnections:1, 
                      isSource:true, 
                      isTarget:true, 
                      endpoint:["Dot", {radius:5}], 
                      paintStyle:{fillStyle:"#5b9ada"},
                      connectorStyle : {  lineWidth: 3, strokeStyle:"#5b9ada" },
                      connector : new jsPlumb.Connectors.Straight(),
                      setDragAllowedWhenFull:true,
                      connectorOverlays:[ 
                          [ "Arrow", { width:20, length:30, location:1, id:"arrow" } ], 
                          [ "Label", { label:"", id:"label" } ]
                      ]               
                      }
  
              jsPlumb.bind("ready", function() {
  
                      jsPlumb.addEndpoint('block1', endpointOptions);
  
                      jsPlumb.addEndpoint('block2', endpointOptions);
  
                      jsPlumb.draggable('block1');
                      jsPlumb.draggable('block2');
              });
  </code></pre>