202 lines
144 KiB
HTML
202 lines
144 KiB
HTML
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
|
||
|
|
|
||
|
|
<html><head><title>mxConnectionHandler</title><link rel="stylesheet" type="text/css" href="../../styles/main.css"><script language=JavaScript src="../../javascript/main.js"></script><script language=JavaScript src="../../javascript/prettify.js"></script><script language=JavaScript src="../../javascript/searchdata.js"></script></head><body class="ContentPage" onLoad="NDOnLoad();prettyPrint();"><script language=JavaScript><!--
|
||
|
|
if (browserType) {document.write("<div class=" + browserType + ">");if (browserVer) {document.write("<div class=" + browserVer + ">"); }}// --></script>
|
||
|
|
|
||
|
|
<!-- Generated by Natural Docs, version 1.5 -->
|
||
|
|
<!-- http://www.naturaldocs.org -->
|
||
|
|
|
||
|
|
<!-- saved from url=(0026)http://www.naturaldocs.org -->
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<div id=Content><div class="CClass"><div class=CTopic id=MainTopic><h1 class=CTitle><a name="mxConnectionHandler"></a>mxConnectionHandler</h1><div class=CBody><p>Graph event handler that creates new connections. Uses <mxTerminalMarker> for finding and highlighting the source and target vertices and <a href="#mxConnectionHandler.factoryMethod" class=LVariable id=link101 onMouseOver="ShowTip(event, 'tt5', 'link101')" onMouseOut="HideTip('tt5')">factoryMethod</a> to create the edge instance. This handler is built-into <mxGraph.connectionHandler> and enabled using <a href="../view/mxGraph-js.html#mxGraph.setConnectable" class=LFunction id=link102 onMouseOver="ShowTip(event, 'tt81', 'link102')" onMouseOut="HideTip('tt81')">mxGraph.setConnectable</a>.</p><h4 class=CHeading>Example</h4><blockquote><pre class="prettyprint">new mxConnectionHandler(graph, function(source, target, style)
|
||
|
|
{
|
||
|
|
edge = new mxCell('', new mxGeometry());
|
||
|
|
edge.setEdge(true);
|
||
|
|
edge.setStyle(style);
|
||
|
|
edge.geometry.relative = true;
|
||
|
|
return edge;
|
||
|
|
});</pre></blockquote><p>Here is an alternative solution that just sets a specific user object for new edges by overriding <a href="#mxConnectionHandler.insertEdge" class=LFunction id=link103 onMouseOver="ShowTip(event, 'tt77', 'link103')" onMouseOut="HideTip('tt77')">insertEdge</a>.</p><blockquote><pre class="prettyprint">mxConnectionHandlerInsertEdge = mxConnectionHandler.prototype.insertEdge;
|
||
|
|
mxConnectionHandler.prototype.insertEdge = function(parent, id, value, source, target, style)
|
||
|
|
{
|
||
|
|
value = 'Test';
|
||
|
|
|
||
|
|
return mxConnectionHandlerInsertEdge.apply(this, arguments);
|
||
|
|
};</pre></blockquote><h4 class=CHeading>Using images to trigger connections</h4><p>This handler uses mxTerminalMarker to find the source and target cell for the new connection and creates a new edge using <a href="#mxConnectionHandler.connect" class=LFunction id=link104 onMouseOver="ShowTip(event, 'tt1', 'link104')" onMouseOut="HideTip('tt1')">connect</a>. The new edge is created using <a href="#mxConnectionHandler.createEdge" class=LFunction id=link105 onMouseOver="ShowTip(event, 'tt79', 'link105')" onMouseOut="HideTip('tt79')">createEdge</a> which in turn uses <a href="#mxConnectionHandler.factoryMethod" class=LVariable id=link106 onMouseOver="ShowTip(event, 'tt5', 'link106')" onMouseOut="HideTip('tt5')">factoryMethod</a> or creates a new default edge.</p><p>The handler uses a “highlight-paradigm” for indicating if a cell is being used as a source or target terminal, as seen in MS Visio and other products. In order to allow both, moving and connecting cells at the same time, <a href="../util/mxConstants-js.html#mxConstants.DEFAULT_HOTSPOT" class=LVariable id=link107 onMouseOver="ShowTip(event, 'tt82', 'link107')" onMouseOut="HideTip('tt82')">mxConstants.DEFAULT_HOTSPOT</a> is used in the handler to determine the hotspot of a cell, that is, the region of the cell which is used to trigger a new connection. The constant is a value between 0 and 1 that specifies the amount of the width and height around the center to be used for the hotspot of a cell and its default value is 0.5. In addition, <a href="../util/mxConstants-js.html#mxConstants.MIN_HOTSPOT_SIZE" class=LVariable id=link108 onMouseOver="ShowTip(event, 'tt83', 'link108')" onMouseOut="HideTip('tt83')">mxConstants.MIN_HOTSPOT_SIZE</a> defines the minimum number of pixels for the width and height of the hotspot.</p><p>This solution, while standards compliant, may be somewhat confusing because there is no visual indicator for the hotspot and the highlight is seen to switch on and off while the mouse is being moved in and out. Furthermore, this paradigm does not allow to create different connections depending on the highlighted hotspot as there is only one hotspot per cell and it normally does not allow cells to be moved and connected at the same time as there is no clear indication of the connectable area of the cell.</p><p>To come across these issues, the handle has an additional <a href="#mxConnectionHandler.createIcons" class=LFunction id=link109 onMouseOver="ShowTip(event, 'tt53', 'link109')" onMouseOut="HideTip('tt53')">createIcons</a> hook with a default implementation that allows to create one icon to be used to trigger new connections. If this icon is specified, then new connections can only be created if the image is clicked while the cell is being highlighted. The <a href="#mxConnectionHandler.createIcons" class=LFunction id=link110 onMouseOver="ShowTip(event, 'tt53', 'link110')" onMouseOut="HideTip('tt53')">createIcons</a> hook may be overridden to create more than one <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link111 onMouseOver="ShowTip(event, 'tt54', 'link111')" onMouseOut="HideTip('tt54')">mxImageShape</a> for creating new connections, but the default implementation supports one image and is used as follows:</p><p>In order to display the “connect image” whenever the mouse is over the cell, an DEFAULT_HOTSPOT of 1 should be used:</p><blockquote><pre class="prettyprint">mxConstants.DEFAULT_HOTSPOT = 1;</pre></blockquote><p>In order to avoid confusion with the highlighting, the highlight color should not be used with a connect image:</p><blockquote><pre class="prettyprint">mxConstants.HIGHLIGHT_COLOR = null;</pre></blockquote><p>To install the image, the connectImage field of the mxConnectionHandler must be assigned a new <a href="../util/mxImage-js.html#mxImage" class=LClass id=link112 onMouseOver="ShowTip(event, 'tt9', 'link112')" onMouseOut="HideTip('tt9')">mxImage</a> instance:</p><blockquote><pre class="prettyprint">mxConnectionHandler.prototype.connectImage
|
||
|
|
|
||
|
|
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.Events"></a>Events</h3></div></div>
|
||
|
|
|
||
|
|
<div class="CEvent"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mxEvent.CONNECT"></a>mxEvent.<wbr>CONNECT</h3><div class=CBody><p>Fires between begin- and endUpdate in <a href="#mxConnectionHandler.connect" class=LFunction id=link113 onMouseOver="ShowTip(event, 'tt1', 'link113')" onMouseOut="HideTip('tt1')">connect</a>. The <code>cell</code> property contains the inserted edge, the <code>event</code> and <code>target</code> properties contain the respective arguments that were passed to <a href="#mxConnectionHandler.connect" class=LFunction id=link114 onMouseOver="ShowTip(event, 'tt1', 'link114')" onMouseOut="HideTip('tt1')">connect</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mxConnectionHandler"></a>mxConnectionHandler</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>function mxConnectionHandler(</td><td class=PParameter nowrap>graph,</td></tr><tr><td></td><td class=PParameter nowrap>factoryMethod</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Constructs an event handler that connects vertices using the specified factory method to create the new edges. Modify <mxConstants.ACTIVE_REGION> to setup the region on a cell which triggers the creation of a new connection or use connect icons as explained above.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>graph</td><td class=CDLDescription>Reference to the enclosing <a href="../view/mxGraph-js.html#mxGraph" class=LClass id=link115 onMouseOver="ShowTip(event, 'tt4', 'link115')" onMouseOut="HideTip('tt4')">mxGraph</a>.</td></tr><tr><td class=CDLEntry>factoryMethod</td><td class=CDLDescription>Optional function to create the edge. The function takes the source and target <a href="../model/mxCell-js.html#mxCell" class=LClass id=link116 onMouseOver="ShowTip(event, 'tt84', 'link116')" onMouseOut="HideTip('tt84')">mxCell</a> as the first and second argument and an optional cell style from the preview as the third argument. It returns the <a href="../model/mxCell-js.html#mxCell" class=LClass id=link117 onMouseOver="ShowTip(event, 'tt84', 'link117')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the new edge.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.graph"></a>graph</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.graph</td></tr></table></blockquote><p>Reference to the enclosing <a href="../view/mxGraph-js.html#mxGraph" class=LClass id=link118 onMouseOver="ShowTip(event, 'tt4', 'link118')" onMouseOut="HideTip('tt4')">mxGraph</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.factoryMethod"></a>factoryMethod</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.factoryMethod</td></tr></table></blockquote><p>Function that is used for creating new edges. The function takes the source and target <a href="../model/mxCell-js.html#mxCell" class=LClass id=link119 onMouseOver="ShowTip(event, 'tt84', 'link119')" onMouseOut="HideTip('tt84')">mxCell</a> as the first and second argument and returns a new <a href="../model/mxCell-js.html#mxCell" class=LClass id=link120 onMouseOver="ShowTip(event, 'tt84', 'link120')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the edge. This is used in <a href="#mxConnectionHandler.createEdge" class=LFunction id=link121 onMouseOver="ShowTip(event, 'tt79', 'link121')" onMouseOut="HideTip('tt79')">createEdge</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.moveIconFront"></a>moveIconFront</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.moveIconFront</td></tr></table></blockquote><p>Specifies if icons should be displayed inside the graph container instead of the overlay pane. This is used for HTML labels on vertices which hide the connect icon. This has precendence over <a href="#mxConnectionHandler.moveIconBack" class=LVariable id=link122 onMouseOver="ShowTip(event, 'tt7', 'link122')" onMouseOut="HideTip('tt7')">moveIconBack</a> when set to true. Default is false.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.moveIconBack"></a>moveIconBack</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.moveIconBack</td></tr></table></blockquote><p>Specifies if icons should be moved to the back of the overlay pane. This can be set to true if the icons of the connection handler conflict with other handles, such as the vertex label move handle. Default is false.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.connectImage"></a>connectImage</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.connectImage</td></tr></table></blockquote><p><a href="../util/mxImage-js.html#mxImage" class=LClass id=link123 onMouseOver="ShowTip(event, 'tt9', 'link123')" onMouseOut="HideTip('tt9')">mxImage</a> that is used to trigger the creation of a new connection. This is used in <a href="#mxConnectionHandler.createIcons" class=LFunction id=link124 onMouseOver="ShowTip(event, 'tt53', 'link124')" onMouseOut="HideTip('tt53')">createIcons</a>. Default is null.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.targetConnectImage"></a>targetConnectImage</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.targetConnectImage</td></tr></table></blockquote><p>Specifies if the connect icon should be centered on the target state while connections are being previewed. Default is false.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.enabled"></a>enabled</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.enabled</td></tr></table></blockquote><p>Specifies if events are handled. Default is true.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.select"></a>select</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.select</td></tr></table></blockquote><p>Specifies if new edges should be selected. Default is true.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createTarget"></a>createTarget</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createTarget</td></tr></table></blockquote><p>Specifies if <a href="#mxConnectionHandler.createTargetVertex" class=LFunction id=link125 onMouseOver="ShowTip(event, 'tt14', 'link125')" onMouseOut="HideTip('tt14')">createTargetVertex</a> should be called if no target was under the mouse for the new connection. Setting this to true means the connection will be drawn as valid if no target is under the mouse, and <a href="#mxConnectionHandler.createTargetVertex" class=LFunction id=link126 onMouseOver="ShowTip(event, 'tt14', 'link126')" onMouseOut="HideTip('tt14')">createTargetVertex</a> will be called before the connection is created between the source cell and the newly created vertex in <a href="#mxConnectionHandler.createTargetVertex" class=LFunction id=link127 onMouseOver="ShowTip(event, 'tt14', 'link127')" onMouseOut="HideTip('tt14')">createTargetVertex</a>, which can be overridden to create a new target. Default is false.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.marker"></a>marker</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.marker</td></tr></table></blockquote><p>Holds the <mxTerminalMarker> used for finding source and target cells.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.constraintHandler"></a>constraintHandler</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.constraintHandler</td></tr></table></blockquote><p>Holds the <a href="mxConstraintHandler-js.html#mxConstraintHandler" class=LClass id=link128 onMouseOver="ShowTip(event, 'tt17', 'link128')" onMouseOut="HideTip('tt17')">mxConstraintHandler</a> used for drawing and highlighting constraints.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.error"></a>error</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.error</td></tr></table></blockquote><p>Holds the current validation error while connections are being created.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.waypointsEnabled"></a>waypointsEnabled</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.waypointsEnabled</td></tr></table></blockquote><p>Specifies if single clicks should add waypoints on the new edge. Default is false.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHoldEnabled"></a>tapAndHoldEnabled</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldEnabled</td></tr></table></blockquote><p>Specifies if tap and hold should be used for starting connections on touch-based devices. Default is true.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHoldDelay"></a>tapAndHoldDelay</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldDelay</td></tr></table></blockquote><p>Specifies the time for a tap and hold. Default is 500 ms.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHoldInProgress"></a>tapAndHoldInProgress</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldInProgress</td></tr></table></blockquote><p>True if the timer for tap and hold events is running.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHoldValid"></a>tapAndHoldValid</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldValid</td></tr></table></blockquote><p>True as long as the timer is running and the touch events stay within the given <a href="#mxConnectionHandler.tapAndHoldTolerance" class=LVariable id=link129 onMouseOver="ShowTip(event, 'tt24', 'link129')" onMouseOut="HideTip('tt24')">tapAndHoldTolerance</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHoldTolerance"></a>tapAndHoldTolerance</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldTolerance</td></tr></table></blockquote><p>Specifies the tolerance for a tap and hold. Default is 4 pixels.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.initialTouchY"></a>initialTouchY</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.initialTouchY</td></tr></table></blockquote><p>Holds the x-coordinate of the intial touch event for tap and hold.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.initialTouchY"></a>initialTouchY</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.initialTouchY</td></tr></table></blockquote><p>Holds the y-coordinate of the intial touch event for tap and hold.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.ignoreMouseDown"></a>ignoreMouseDown</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.ignoreMouseDown</td></tr></table></blockquote><p>Specifies if the connection handler should ignore the state of the mouse button when highlighting the source. Default is false, that is, the handler only highlights the source if no button is being pressed.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.first"></a>first</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.first</td></tr></table></blockquote><p>Holds the <a href="../util/mxPoint-js.html#mxPoint" class=LClass id=link130 onMouseOver="ShowTip(event, 'tt28', 'link130')" onMouseOut="HideTip('tt28')">mxPoint</a> where the mouseDown took place while the handler is active.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.connectIconOffset"></a>connectIconOffset</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.connectIconOffset</td></tr></table></blockquote><p>Holds the offset for connect icons during connection preview. Default is mxPoint(0, <a href="../util/mxConstants-js.html#mxConstants.TOOLTIP_VERTICAL_OFFSET" class=LVariable id=link131 onMouseOver="ShowTip(event, 'tt85', 'link131')" onMouseOut="HideTip('tt85')">mxConstants.TOOLTIP_VERTICAL_OFFSET</a>). Note that placing the icon under the mouse pointer with an offset of (0,0) will affect hit detection.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.edgeState"></a>edgeState</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.edgeState</td></tr></table></blockquote><p>Optional <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link132 onMouseOver="ShowTip(event, 'tt31', 'link132')" onMouseOut="HideTip('tt31')">mxCellState</a> that represents the preview edge while the handler is active. This is created in <a href="#mxConnectionHandler.createEdgeState" class=LFunction id=link133 onMouseOver="ShowTip(event, 'tt62', 'link133')" onMouseOut="HideTip('tt62')">createEdgeState</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.changeHandler"></a>changeHandler</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.changeHandler</td></tr></table></blockquote><p>Holds the change event listener for later removal.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.drillHandler"></a>drillHandler</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.drillHandler</td></tr></table></blockquote><p>Holds the drill event listener for later removal.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mouseDownCounter"></a>mouseDownCounter</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.mouseDownCounter</td></tr></table></blockquote><p>Counts the number of mouseDown events since the start. The initial mouse down event counts as 1.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.movePreviewAway"></a>movePreviewAway</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.movePreviewAway</td></tr></table></blockquote><p>Switch to enable moving the preview away from the mousepointer. This is required in browsers where the preview cannot be made transparent to events and if the built-in hit detection on the HTML elements in the page should be used. Default is the value of <a href="../mxClient-js.html#mxClient.IS_IE" class=LVariable id=link134 onMouseOver="ShowTip(event, 'tt86', 'link134')" onMouseOut="HideTip('tt86')">mxClient.IS_IE</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isEnabled"></a>isEnabled</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isEnabled = function()</td></tr></table></blockquote><p>Returns true if events are handled. This implementation returns <a href="#mxConnectionHandler.enabled" class=LVariable id=link135 onMouseOver="ShowTip(event, 'tt11', 'link135')" onMouseOut="HideTip('tt11')">enabled</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.setEnabled"></a>setEnabled</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.setEnabled = function(</td><td class=PParameter nowrap>enabled</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Enables or disables event handling. This implementation updates <a href="#mxConnectionHandler.enabled" class=LVariable id=link136 onMouseOver="ShowTip(event, 'tt11', 'link136')" onMouseOut="HideTip('tt11')">enabled</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>enabled</td><td class=CDLDescription>Boolean that specifies the new enabled state.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isCreateTarget"></a>isCreateTarget</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isCreateTarget = function()</td></tr></table></blockquote><p>Returns <a href="#mxConnectionHandler.createTarget" class=LVariable id=link137 onMouseOver="ShowTip(event, 'tt13', 'link137')" onMouseOut="HideTip('tt13')">createTarget</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.setCreateTarget"></a>setCreateTarget</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.setCreateTarget = function(</td><td class=PParameter nowrap>value</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Sets <a href="#mxConnectionHandler.createTarget" class=LVariable id=link138 onMouseOver="ShowTip(event, 'tt13', 'link138')" onMouseOut="HideTip('tt13')">createTarget</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createShape"></a>createShape</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createShape = function()</td></tr></table></blockquote><p>Creates the preview shape for new connections.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.init"></a>init</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.init = function()</td></tr></table></blockquote><p>Initializes the shapes required for this connection handler. This should be invoked if <mxGraph.container> is assigned after the connection handler has been created.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isConnectableCell"></a>isConnectableCell</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isConnectableCell = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true if the given cell is connectable. This is a hook to disable floating connections. This implementation returns true.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createMarker"></a>createMarker</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createMarker = function()</td></tr></table></blockquote><p>Creates and returns the <a href="mxCellMarker-js.html#mxCellMarker" class=LClass id=link139 onMouseOver="ShowTip(event, 'tt44', 'link139')" onMouseOut="HideTip('tt44')">mxCellMarker</a> used in <a href="#mxConnectionHandler.marker" class=LVariable id=link140 onMouseOver="ShowTip(event, 'tt15', 'link140')" onMouseOut="HideTip('tt15')">marker</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.start"></a>start</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.start = function(</td><td class=PParameter nowrap>state,</td></tr><tr><td></td><td class=PParameter nowrap>x,</td></tr><tr><td></td><td class=PParameter nowrap>y,</td></tr><tr><td></td><td class=PParameter nowrap>edgeState</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Starts a new connection for the given state and coordinates.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isConnecting"></a>isConnecting</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isConnecting = function()</td></tr></table></blockquote><p>Returns true if the source terminal has been clicked and a new connection is currently being previewed.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isValidSource"></a>isValidSource</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isValidSource = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns <a href="../view/mxGraph-js.html#mxGraph.isValidSource" class=LFunction id=link141 onMouseOver="ShowTip(event, 'tt48', 'link141')" onMouseOut="HideTip('tt48')">mxGraph.isValidSource</a> for the given source terminal.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>cell</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link142 onMouseOver="ShowTip(event, 'tt84', 'link142')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the source terminal.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isValidTarget"></a>isValidTarget</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isValidTarget = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true. The call to <a href="../view/mxGraph-js.html#mxGraph.isValidTarget" class=LFunction id=link143 onMouseOver="ShowTip(event, 'tt87', 'link143')" onMouseOut="HideTip('tt87')">mxGraph.isValidTarget</a> is implicit by calling <a href="../view/mxGraph-js.html#mxGraph.getEdgeValidationError" class=LFunction id=link144 onMouseOver="ShowTip(event, 'tt88', 'link144')" onMouseOut="HideTip('tt88')">mxGraph.getEdgeValidationError</a> in <a href="#mxConnectionHandler.validateConnection" class=LFunction id=link145 onMouseOver="ShowTip(event, 'tt50', 'link145')" onMouseOut="HideTip('tt50')">validateConnection</a>. This is an additional hook for disabling certain targets in this specific handler.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>cell</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link146 onMouseOver="ShowTip(event, 'tt84', 'link146')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the target terminal.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.validateConnection"></a>validateConnection</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.validateConnection = function(</td><td class=PParameter nowrap>source,</td></tr><tr><td></td><td class=PParameter nowrap>target</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns the error message or an empty string if the connection for the given source target pair is not valid. Otherwise it returns null. This implementation uses <a href="../view/mxGraph-js.html#mxGraph.getEdgeValidationError" class=LFunction id=link147 onMouseOver="ShowTip(event, 'tt88', 'link147')" onMouseOut="HideTip('tt88')">mxGraph.getEdgeValidationError</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>source</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link148 onMouseOver="ShowTip(event, 'tt84', 'link148')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the source terminal.</td></tr><tr><td class=CDLEntry>target</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link149 onMouseOver="ShowTip(event, 'tt84', 'link149')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the target terminal.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getConnectImage"></a>getConnectImage</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.getConnectImage = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Hook to return the <a href="../util/mxImage-js.html#mxImage" class=LClass id=link150 onMouseOver="ShowTip(event, 'tt9', 'link150')" onMouseOut="HideTip('tt9')">mxImage</a> used for the connection icon of the given <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link151 onMouseOver="ShowTip(event, 'tt31', 'link151')" onMouseOut="HideTip('tt31')">mxCellState</a>. This implementation returns <a href="#mxConnectionHandler.connectImage" class=LVariable id=link152 onMouseOver="ShowTip(event, 'tt8', 'link152')" onMouseOut="HideTip('tt8')">connectImage</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link153 onMouseOver="ShowTip(event, 'tt31', 'link153')" onMouseOut="HideTip('tt31')">mxCellState</a> whose connect image should be returned.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isMoveIconToFrontForState"></a>isMoveIconToFrontForState</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isMoveIconToFrontForState = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true if the state has a HTML label in the graph’s container, otherwise it returns <a href="#mxConnectionHandler.moveIconFront" class=LVariable id=link154 onMouseOver="ShowTip(event, 'tt6', 'link154')" onMouseOut="HideTip('tt6')">moveIconFront</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link155 onMouseOver="ShowTip(event, 'tt31', 'link155')" onMouseOut="HideTip('tt31')">mxCellState</a> whose connect icons should be returned.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createIcons"></a>createIcons</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.createIcons = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Creates the array <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link156 onMouseOver="ShowTip(event, 'tt54', 'link156')" onMouseOut="HideTip('tt54')">mxImageShapes</a> that represent the connect icons for the given <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link157 onMouseOver="ShowTip(event, 'tt31', 'link157')" onMouseOut="HideTip('tt31')">mxCellState</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link158 onMouseOver="ShowTip(event, 'tt31', 'link158')" onMouseOut="HideTip('tt31')">mxCellState</a> whose connect icons should be returned.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.redrawIcons"></a>redrawIcons</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.redrawIcons = function(</td><td class=PParameter nowrap>icons,</td></tr><tr><td></td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Redraws the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link159 onMouseOver="ShowTip(event, 'tt54', 'link159')" onMouseOut="HideTip('tt54')">mxImageShapes</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>icons</td><td class=CDLDescription>Optional array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link160 onMouseOver="ShowTip(event, 'tt54', 'link160')" onMouseOut="HideTip('tt54')">mxImageShapes</a> to be redrawn.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.redrawIcons"></a>redrawIcons</h3><div class=CBody><p>Redraws the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link161 onMouseOver="ShowTip(event, 'tt54', 'link161')" onMouseOut="HideTip('tt54')">mxImageShapes</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>icons</td><td class=CDLDescription>Optional array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link162 onMouseOver="ShowTip(event, 'tt54', 'link162')" onMouseOut="HideTip('tt54')">mxImageShapes</a> to be redrawn.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.destroyIcons"></a>destroyIcons</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.destroyIcons = function(</td><td class=PParameter nowrap>icons</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Destroys the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link163 onMouseOver="ShowTip(event, 'tt54', 'link163')" onMouseOut="HideTip('tt54')">mxImageShapes</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>icons</td><td class=CDLDescription>Optional array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link164 onMouseOver="ShowTip(event, 'tt54', 'link164')" onMouseOut="HideTip('tt54')">mxImageShapes</a> to be destroyed.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isStartEvent"></a>isStartEvent</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isStartEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true if the given mouse down event should start this handler. The This implementation returns true if the event does not force marquee selection, and the currentConstraint and currentFocus of the <a href="#mxConnectionHandler.constraintHandler" class=LVariable id=link165 onMouseOver="ShowTip(event, 'tt16', 'link165')" onMouseOut="HideTip('tt16')">constraintHandler</a> are not null, or <previous> and <a href="#mxConnectionHandler.error" class=LVariable id=link166 onMouseOver="ShowTip(event, 'tt18', 'link166')" onMouseOut="HideTip('tt18')">error</a> are not null and <icons> is null or <icons> and <icon> are not null.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mouseDown"></a>mouseDown</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.mouseDown = function(</td><td class=PParameter nowrap>sender,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Handles the event by initiating a new connection.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.tapAndHold"></a>tapAndHold</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.tapAndHold = function(</td><td class=PParameter nowrap>me,</td></tr><tr><td></td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Handles the <a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link167 onMouseOver="ShowTip(event, 'tt60', 'link167')" onMouseOut="HideTip('tt60')">mxMouseEvent</a> by highlighting the <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link168 onMouseOver="ShowTip(event, 'tt31', 'link168')" onMouseOut="HideTip('tt31')">mxCellState</a>.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>me</td><td class=CDLDescription><a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link169 onMouseOver="ShowTip(event, 'tt60', 'link169')" onMouseOut="HideTip('tt60')">mxMouseEvent</a> that represents the touch event.</td></tr><tr><td class=CDLEntry>state</td><td class=CDLDescription>Optional <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link170 onMouseOver="ShowTip(event, 'tt31', 'link170')" onMouseOut="HideTip('tt31')">mxCellState</a> that is associated with the event.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isImmediateConnectSource"></a>isImmediateConnectSource</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isImmediateConnectSource = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true if a tap on the given source state should immediately start connecting. This implementation returns true if the state is not movable in the graph.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createEdgeState"></a>createEdgeState</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.createEdgeState = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Hook to return an <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link171 onMouseOver="ShowTip(event, 'tt31', 'link171')" onMouseOut="HideTip('tt31')">mxCellState</a> which may be used during the preview. This implementation returns null.</p><h4 class=CHeading>Use the following code to create a preview for an existing edge style</h4><p>[code] graph.connectionHandler.createEdgeState = function(me) { var edge = graph.createEdge(null, null, null, null, null, ‘edgeStyle=elbowEdgeStyle’);</p><p>return new mxCellState(this.graph.view, edge, this.graph.getCellStyle(edge)); }; [/code]</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.updateCurrentState"></a>updateCurrentState</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.updateCurrentState = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Updates the current state for a given mouse move event by using the <a href="#mxConnectionHandler.marker" class=LVariable id=link172 onMouseOver="ShowTip(event, 'tt15', 'link172')" onMouseOut="HideTip('tt15')">marker</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.convertWaypoint"></a>convertWaypoint</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.convertWaypoint = function(</td><td class=PParameter nowrap>point</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Converts the given point from screen coordinates to model coordinates.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mouseMove"></a>mouseMove</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.mouseMove = function(</td><td class=PParameter nowrap>sender,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Handles the event by updating the preview edge or by highlighting a possible source or target terminal.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getTargetPerimeterPoint"></a>getTargetPerimeterPoint</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.getTargetPerimeterPoint = function(</td><td class=PParameter nowrap>state,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns the perimeter point for the given target state.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link173 onMouseOver="ShowTip(event, 'tt31', 'link173')" onMouseOut="HideTip('tt31')">mxCellState</a> that represents the target cell state.</td></tr><tr><td class=CDLEntry>me</td><td class=CDLDescription><a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link174 onMouseOver="ShowTip(event, 'tt60', 'link174')" onMouseOut="HideTip('tt60')">mxMouseEvent</a> that represents the mouse move.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getSourcePerimeterPoint"></a>getSourcePerimeterPoint</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.getSourcePerimeterPoint = function(</td><td class=PParameter nowrap>state,</td></tr><tr><td></td><td class=PParameter nowrap>next,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Hook to update the icon position(s) based on a mouseOver event. This is an empty implementation.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link175 onMouseOver="ShowTip(event, 'tt31', 'link175')" onMouseOut="HideTip('tt31')">mxCellState</a> that represents the target cell state.</td></tr><tr><td class=CDLEntry>next</td><td class=CDLDescription><a href="../util/mxPoint-js.html#mxPoint" class=LClass id=link176 onMouseOver="ShowTip(event, 'tt28', 'link176')" onMouseOut="HideTip('tt28')">mxPoint</a> that represents the next point along the previewed edge.</td></tr><tr><td class=CDLEntry>me</td><td class=CDLDescription><a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link177 onMouseOver="ShowTip(event, 'tt60', 'link177')" onMouseOut="HideTip('tt60')">mxMouseEvent</a> that represents the mouse move.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.updateIcons"></a>updateIcons</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.updateIcons = function(</td><td class=PParameter nowrap>state,</td></tr><tr><td></td><td class=PParameter nowrap>icons,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Hook to update the icon position(s) based on a mouseOver event. This is an empty implementation.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>state</td><td class=CDLDescription><a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link178 onMouseOver="ShowTip(event, 'tt31', 'link178')" onMouseOut="HideTip('tt31')">mxCellState</a> under the mouse.</td></tr><tr><td class=CDLEntry>icons</td><td class=CDLDescription>Array of currently displayed icons.</td></tr><tr><td class=CDLEntry>me</td><td class=CDLDescription><a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link179 onMouseOver="ShowTip(event, 'tt60', 'link179')" onMouseOut="HideTip('tt60')">mxMouseEvent</a> that contains the mouse event.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.isStopEvent"></a>isStopEvent</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.isStopEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns true if the given mouse up event should stop this handler. The connection will be created if <a href="#mxConnectionHandler.error" class=LVariable id=link180 onMouseOver="ShowTip(event, 'tt18', 'link180')" onMouseOut="HideTip('tt18')">error</a> is null. Note that this is only called if <a href="#mxConnectionHandler.waypointsEnabled" class=LVariable id=link181 onMouseOver="ShowTip(event, 'tt19', 'link181')" onMouseOut="HideTip('tt19')">waypointsEnabled</a> is true. This implemtation returns true if there is a cell state in the given event.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.addWaypoint"></a>addWaypoint</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.addWaypointForEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Adds the waypoint for the given event to <waypoints>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.mouseUp"></a>mouseUp</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.mouseUp = function(</td><td class=PParameter nowrap>sender,</td></tr><tr><td></td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Handles the event by inserting the new connection.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.reset"></a>reset</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.reset = function()</td></tr></table></blockquote><p>Resets the state of this handler.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.drawPreview"></a>drawPreview</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.drawPreview = function()</td></tr></table></blockquote><p>Redraws the preview edge using the color and width returned by <a href="#mxConnectionHandler.getEdgeColor" class=LFunction id=link182 onMouseOver="ShowTip(event, 'tt74', 'link182')" onMouseOut="HideTip('tt74')">getEdgeColor</a> and <a href="#mxConnectionHandler.getEdgeWidth" class=LFunction id=link183 onMouseOver="ShowTip(event, 'tt75', 'link183')" onMouseOut="HideTip('tt75')">getEdgeWidth</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getEdgeColor"></a>getEdgeColor</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.getEdgeColor = function(</td><td class=PParameter nowrap>valid</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns the color used to draw the preview edge. This returns green if there is no edge validation error and red otherwise.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>valid</td><td class=CDLDescription>Boolean indicating if the color for a valid edge should be returned.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getEdgeWidth"></a>getEdgeWidth</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.getEdgeWidth = function(</td><td class=PParameter nowrap>valid</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Returns the width used to draw the preview edge. This returns 3 if there is no edge validation error and 1 otherwise.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>valid</td><td class=CDLDescription>Boolean indicating if the width for a valid edge should be returned.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.connect"></a>connect</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.connect = function(</td><td class=PParameter nowrap>source,</td></tr><tr><td></td><td class=PParameter nowrap>target,</td></tr><tr><td></td><td class=PParameter nowrap>evt,</td></tr><tr><td></td><td class=PParameter nowrap>dropTarget</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Connects the given source and target using a new edge. This implementation uses <a href="#mxConnectionHandler.createEdge" class=LFunction id=link184 onMouseOver="ShowTip(event, 'tt79', 'link184')" onMouseOut="HideTip('tt79')">createEdge</a> to create the edge.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>source</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link185 onMouseOver="ShowTip(event, 'tt84', 'link185')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the source terminal.</td></tr><tr><td class=CDLEntry>target</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link186 onMouseOver="ShowTip(event, 'tt84', 'link186')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the target terminal.</td></tr><tr><td class=CDLEntry>evt</td><td class=CDLDescription>Mousedown event of the connect gesture.</td></tr><tr><td class=CDLEntry>dropTarget</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link187 onMouseOver="ShowTip(event, 'tt84', 'link187')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the cell under the mouse when it was released.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.selectCells"></a>selectCells</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.selectCells = function(</td><td class=PParameter nowrap>edge,</td></tr><tr><td></td><td class=PParameter nowrap>target</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Selects the given edge after adding a new connection. The target argument contains the target vertex if one has been inserted.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.insertEdge"></a>insertEdge</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.insertEdge = function(</td><td class=PParameter nowrap>parent,</td></tr><tr><td></td><td class=PParameter nowrap>id,</td></tr><tr><td></td><td class=PParameter nowrap>value,</td></tr><tr><td></td><td class=PParameter nowrap>source,</td></tr><tr><td></td><td class=PParameter nowrap>target,</td></tr><tr><td></td><td class=PParameter nowrap>style</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Creates, inserts and returns the new edge for the given parameters. This implementation does only use <a href="#mxConnectionHandler.createEdge" class=LFunction id=link188 onMouseOver="ShowTip(event, 'tt79', 'link188')" onMouseOut="HideTip('tt79')">createEdge</a> if <a href="#mxConnectionHandler.factoryMethod" class=LVariable id=link189 onMouseOver="ShowTip(event, 'tt5', 'link189')" onMouseOut="HideTip('tt5')">factoryMethod</a> is defined, otherwise <a href="../view/mxGraph-js.html#mxGraph.insertEdge" class=LFunction id=link190 onMouseOver="ShowTip(event, 'tt89', 'link190')" onMouseOut="HideTip('tt89')">mxGraph.insertEdge</a> will be used.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createTargetVertex"></a>createTargetVertex</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.createTargetVertex = function(</td><td class=PParameter nowrap>evt,</td></tr><tr><td></td><td class=PParameter nowrap>source</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Hook method for creating new vertices on the fly if no target was under the mouse. This is only called if <a href="#mxConnectionHandler.createTarget" class=LVariable id=link191 onMouseOver="ShowTip(event, 'tt13', 'link191')" onMouseOut="HideTip('tt13')">createTarget</a> is true and returns null.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>evt</td><td class=CDLDescription>Mousedown event of the connect gesture.</td></tr><tr><td class=CDLEntry>source</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link192 onMouseOver="ShowTip(event, 'tt84', 'link192')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the source terminal.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.getAlignmentTolerance"></a>getAlignmentTolerance</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.getAlignmentTolerance = function()</td></tr></table></blockquote><p>Returns the tolerance for aligning new targets to sources.</p></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.createEdge"></a>createEdge</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.createEdge = function(</td><td class=PParameter nowrap>value,</td></tr><tr><td></td><td class=PParameter nowrap>source,</td></tr><tr><td></td><td class=PParameter nowrap>target,</td></tr><tr><td></td><td class=PParameter nowrap>style</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Creates and returns a new edge using <a href="#mxConnectionHandler.factoryMethod" class=LVariable id=link193 onMouseOver="ShowTip(event, 'tt5', 'link193')" onMouseOut="HideTip('tt5')">factoryMethod</a> if one exists. If no factory method is defined, then a new default edge is returned. The source and target arguments are informal, the actual connection is setup later by the caller of this function.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>value</td><td class=CDLDescription>Value to be used for creating the edge.</td></tr><tr><td class=CDLEntry>source</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link194 onMouseOver="ShowTip(event, 'tt84', 'link194')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the source terminal.</td></tr><tr><td class=CDLEntry>target</td><td class=CDLDescription><a href="../model/mxCell-js.html#mxCell" class=LClass id=link195 onMouseOver="ShowTip(event, 'tt84', 'link195')" onMouseOut="HideTip('tt84')">mxCell</a> that represents the target terminal.</td></tr><tr><td class=CDLEntry>style</td><td class=CDLDescription>Optional style from the preview edge.</td></tr></table></div></div></div>
|
||
|
|
|
||
|
|
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.destroy"></a>destroy</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.destroy = function()</td></tr></table></blockquote><p>Destroys the handler and all its resources and DOM nodes. This should be called on all instances. It is called automatically for the built-in instance created for each <a href="../view/mxGraph-js.html#mxGraph" class=LClass id=link196 onMouseOver="ShowTip(event, 'tt4', 'link196')" onMouseOut="HideTip('tt4')">mxGraph</a>.</p></div></div></div>
|
||
|
|
|
||
|
|
</div><!--Content-->
|
||
|
|
|
||
|
|
|
||
|
|
<div id=Footer><a href="http://www.naturaldocs.org">Generated by Natural Docs</a></div><!--Footer-->
|
||
|
|
|
||
|
|
|
||
|
|
<div id=Menu><div class=MEntry><div class=MFile><a href="../index-txt.html">API Specification</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent1')">Editor</a><div class=MGroupContent id=MGroupContent1><div class=MEntry><div class=MFile><a href="../editor/mxDefaultKeyHandler-js.html">mxDefaultKeyHandler</a></div></div><div class=MEntry><div class=MFile><a href="../editor/mxDefaultPopupMenu-js.html">mxDefaultPopupMenu</a></div></div><div class=MEntry><div class=MFile><a href="../editor/mxDefaultToolbar-js.html">mxDefaultToolbar</a></div></div><div class=MEntry><div class=MFile><a href="../editor/mxEditor-js.html">mxEditor</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent2')">Handler</a><div class=MGroupContent id=MGroupContent2><div class=MEntry><div class=MFile><a href="mxCellHighlight-js.html">mxCellHighlight</a></div></div><div class=MEntry><div class=MFile><a href="mxCellMarker-js.html">mxCellMarker</a></div></div><div class=MEntry><div class=MFile><a href="mxCellTracker-js.html">mxCellTracker</a></div></div><div class=MEntry><div class=MFile id=MSelected>mxConnectionHandler</div></div><div class=MEntry><div class=MFile><a href="mxConstraintHandler-js.html">mxConstraintHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxEdgeHandler-js.html">mxEdgeHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxEdgeSegmentHandler-js.html">mxEdgeSegmentHandler.js</a></div></div><div class=MEntry><div class=MFile><a href="mxElbowEdgeHandler-js.html">mxElbowEdgeHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxGraphHandler-js.html">mxGraphHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxKeyHandler-js.html">mxKeyHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxPanningHandler-js.html">mxPanningHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxRubberband-js.html">mxRubberband</a></div></div><div class=MEntry><div class=MFile><a href="mxSelectionCellsHandler-js.html">mxSelectionCellsHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxTooltipHandler-js.html">mxTooltipHandler</a></div></div><div class=MEntry><div class=MFile><a href="mxVertexHandler-js.html">mxVertexHandler</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent3')">Io</a><div class=MGroupContent id=MGroupContent3><div class=MEntry><div class=MFile><a href="../io/mxCellCodec-js.html">mxCellCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxChildChangeCodec-js.html">mxChildChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxCodec-js.html">mxCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxCodecRegistry-js.html">mxCodecRegistry</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxDefaultKeyHandlerCodec-js.html">mxDefaultKeyHandlerCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxDefaultPopupMenuCodec-js.html">mxDefaultPopupMenuCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxDefaultToolbarCodec-js.html">mxDefaultToolbarCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxEditorCodec-js.html">mxEditorCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxGenericChangeCodec-js.html">mxGenericChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxGraphCodec-js.html">mxGraphCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxGraphViewCodec-js.html">mxGraphViewCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxModelCodec-js.html">mxModelCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxObjectCodec-js.html">mxObjectCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxRootChangeCodec-js.html">mxRootChangeCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxStylesheetCodec-js.html">mxStyleshee
|
||
|
|
var searchPanel = new SearchPanel("searchPanel", "HTML", "../../search");
|
||
|
|
--></script><div id=MSearchPanel class=MSearchPanelInactive><input type=text id=MSearchField value=Search onFocus="searchPanel.OnSearchFieldFocus(true)" onBlur="searchPanel.OnSearchFieldFocus(false)" onKeyUp="searchPanel.OnSearchFieldChange()"><select id=MSearchType onFocus="searchPanel.OnSearchTypeFocus(true)" onBlur="searchPanel.OnSearchTypeFocus(false)" onChange="searchPanel.OnSearchTypeChange()"><option id=MSearchEverything selected value="General">Everything</option><option value="Classes">Classes</option><option value="Cookies">Cookies</option><option value="Events">Events</option><option value="Files">Files</option><option value="Functions">Functions</option><option value="Variables">Variables</option></select></div><script language=JavaScript><!--
|
||
|
|
HideAllBut([2], 13);// --></script></div><!--Menu-->
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<!--START_ND_TOOLTIPS-->
|
||
|
|
<div class=CToolTip id="tt1"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>mxConnectionHandler.prototype.connect = function(</td><td class=PParameter nowrap>source,</td></tr><tr><td></td><td class=PParameter nowrap>target,</td></tr><tr><td></td><td class=PParameter nowrap>evt,</td></tr><tr><td></td><td class=PParameter nowrap>dropTarget</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Connects the given source and target using a new edge. </div></div><div class=CToolTip id="tt2"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>function mxConnectionHandler(</td><td class=PParameter nowrap>graph,</td></tr><tr><td></td><td class=PParameter nowrap>factoryMethod</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Constructs an event handler that connects vertices using the specified factory method to create the new edges. </div></div><div class=CToolTip id="tt3"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.graph</td></tr></table></blockquote>Reference to the enclosing mxGraph.</div></div><div class=CToolTip id="tt4"><div class=CClass>Extends mxEventSource to implement a graph component for the browser. </div></div><div class=CToolTip id="tt5"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.factoryMethod</td></tr></table></blockquote>Function that is used for creating new edges. </div></div><div class=CToolTip id="tt6"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.moveIconFront</td></tr></table></blockquote>Specifies if icons should be displayed inside the graph container instead of the overlay pane. </div></div><div class=CToolTip id="tt7"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.moveIconBack</td></tr></table></blockquote>Specifies if icons should be moved to the back of the overlay pane. </div></div><div class=CToolTip id="tt8"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.connectImage</td></tr></table></blockquote>mxImage that is used to trigger the creation of a new connection. </div></div><div class=CToolTip id="tt9"><div class=CClass>Encapsulates the URL, width and height of an image.</div></div><div class=CToolTip id="tt10"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.targetConnectImage</td></tr></table></blockquote>Specifies if the connect icon should be centered on the target state while connections are being previewed. </div></div><div class=CToolTip id="tt11"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.enabled</td></tr></table></blockquote>Specifies if events are handled. </div></div><div class=CToolTip id="tt12"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.select</td></tr></table></blockquote>Specifies if new edges should be selected. </div></div><div class=CToolTip id="tt13"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createTarget</td></tr></table></blockquote>Specifies if createTargetVertex should be called if no target was under the mouse for the new connecti
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<div id=MSearchResultsWindow><iframe src="" frameborder=0 name=MSearchResults id=MSearchResults></iframe><a href="javascript:searchPanel.CloseResultsWindow()" id=MSearchResultsWindowClose>Close</a></div>
|
||
|
|
|
||
|
|
|
||
|
|
<script language=JavaScript><!--
|
||
|
|
if (browserType) {if (browserVer) {document.write("</div>"); }document.write("</div>");}// --></script></body></html>
|