maxGraph/docs/js-api/files/handler/mxConnectionHandler-js.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.&nbsp; Uses &lt;mxTerminalMarker&gt; 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.&nbsp; This handler is built-into &lt;mxGraph.connectionHandler&gt; and enabled using <a href="../view/mxGraph-js.html#mxGraph.setConnectable" class=LFunction id=link102 onMouseOver="ShowTip(event, 'tt82', 'link102')" onMouseOut="HideTip('tt82')">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, 'tt78', 'link103')" onMouseOut="HideTip('tt78')">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>.&nbsp; The new edge is created using <a href="#mxConnectionHandler.createEdge" class=LFunction id=link105 onMouseOver="ShowTip(event, 'tt80', 'link105')" onMouseOut="HideTip('tt80')">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 &ldquo;highlight-paradigm&rdquo; for indicating if a cell is being used as a source or target terminal, as seen in MS Visio and other products.&nbsp; 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, 'tt83', 'link107')" onMouseOut="HideTip('tt83')">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.&nbsp; 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.&nbsp; In addition, <a href="../util/mxConstants-js.html#mxConstants.MIN_HOTSPOT_SIZE" class=LVariable id=link108 onMouseOver="ShowTip(event, 'tt84', 'link108')" onMouseOut="HideTip('tt84')">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.&nbsp; 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, 'tt54', 'link109')" onMouseOut="HideTip('tt54')">createIcons</a> hook with a default implementation that allows to create one icon to be used to trigger new connections.&nbsp; If this icon is specified, then new connections can only be created if the image is clicked while the cell is being highlighted.&nbsp; The <a href="#mxConnectionHandler.createIcons" class=LFunction id=link110 onMouseOver="ShowTip(event, 'tt54', 'link110')" onMouseOut="HideTip('tt54')">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, 'tt55', 'link111')" onMouseOut="HideTip('tt55')">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 &ldquo;connect image&rdquo; 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 = new mxImage('images/green-dot.gif', 14, 14);</pre></blockquote><p>This will use the green-dot.gif with a width and height of 14 pixels as the image to trigger new connections.&nbsp; In createIcons the icon field of the handler will be set in order to remember the icon that has been clicked for creating the new connection.&nbsp; This field will be available under selectedIcon in the connect method, which may be overridden to take the icon that triggered the new connection into account.&nbsp; This is useful if more than one icon may be used to create a connection.</p><!--START_ND_SUMMARY--><div class=Summary><div class=STitle>Summary</div><div class=SBorder><table border=0 cellspacing=0 cellpadding=0 class=STable><tr class="SMain"><td class=SEntry><a href="#mxConnectionHandler" >mxConnectionHandler</a></td><td class=SDescription>Graph event handler that creates new connections. </td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#mxConnectionHandler.Events" >Events</a></td><td class=SDescription></td></tr><tr class="SEvent SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.mxEvent.CONNECT" >mxEvent.<wbr>CONNECT</a></td><td class=SDescription>Fires between begin- and endUpdate in <a href="#mxConnectionHandler.connect" class=LFunction id=link1 onMouseOver="ShowTip(event, 'tt1', 'link1')" onMouseOut="HideTip('tt1')">connect</a>. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.mxConnectionHandler" id=link2 onMouseOver="ShowTip(event, 'tt2', 'link2')" onMouseOut="HideTip('tt2')">mxConnectionHandler</a></td><td class=SDescription>Constructs an event handler that connects vertices using the specified factory method to create the new edges. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.graph" id=link3 onMouseOver="ShowTip(event, 'tt3', 'link3')" onMouseOut="HideTip('tt3')">graph</a></td><td class=SDescription>Reference to the enclosing <a href="../view/mxGraph-js.html#mxGraph" class=LClass id=link4 onMouseOver="ShowTip(event, 'tt4', 'link4')" onMouseOut="HideTip('tt4')">mxGraph</a>.</td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.factoryMethod" id=link5 onMouseOver="ShowTip(event, 'tt5', 'link5')" onMouseOut="HideTip('tt5')">factoryMethod</a></td><td class=SDescription>Function that is used for creating new edges. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.moveIconFront" id=link6 onMouseOver="ShowTip(event, 'tt6', 'link6')" onMouseOut="HideTip('tt6')">moveIconFront</a></td><td class=SDescription>Specifies if icons should be displayed inside the graph container instead of the overlay pane. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.moveIconBack" id=link7 onMouseOver="ShowTip(event, 'tt7', 'link7')" onMouseOut="HideTip('tt7')">moveIconBack</a></td><td class=SDescription>Specifies if icons should be moved to the back of the overlay pane. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.connectImage" id=link8 onMouseOver="ShowTip(event, 'tt8', 'link8')" onMouseOut="HideTip('tt8')">connectImage</a></td><td class=SDescription><a href="../util/mxImage-js.html#mxImage" class=LClass id=link9 onMouseOver="ShowTip(event, 'tt9', 'link9')" onMouseOut="HideTip('tt9')">mxImage</a> that is used to trigger the creation of a new connection. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.targetConnectImage" id=link10 onMouseOver="ShowTip(event, 'tt10', 'link10')" onMouseOut="HideTip('tt10')">targetConnectImage</a></td><td class=SDescription>Specifies if the connect icon should be centered on the target state while connections are being previewed. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.enabled" id=link11 onMouseOver="ShowTip(event, 'tt11', 'link11')" onMouseOut="HideTip('tt11')">enabled</a></td><td class=SDescription>Specifies if events are handled. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.select" id=link12 onMouseOver="ShowTip(event, 'tt12', 'link12')" onMouseOut="HideTip('tt12')">select</a></td><td class=SDescription>Specifies if new edges should be selected. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.createTarget" id=link13 onMouseOver="ShowTip(event, 'tt13', 'link13')" onMouseOut="HideTip('tt13')">createTarget</a></td><td class=SDescription>Specifies if <a href="#mxConnectionHandler.createTargetVertex" class=LFunction id=link14 onMouseOver="ShowTip(event, 'tt14', 'link14')" onMouseOut="HideTip('tt14')">createTargetVertex</a> should be called if no target was under the mouse for the new connection. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.marker" id=link15 onMouseOver="ShowTip(event, 'tt15', 'link15')" onMouseOut="HideTip('tt15')">marker</a></td><td class=SDescription>Holds the &lt;mxTerminalMarker&gt; used for finding source and target cells.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.constraintHandler" id=link16 onMouseOver="ShowTip(event, 'tt16', 'link16')" onMouseOut="HideTip('tt16')">constraintHandler</a></td><td class=SDescription>Holds the <a href="mxConstraintHandler-js.html#mxConstraintHandler" class=LClass id=link17 onMouseOver="ShowTip(event, 'tt17', 'link17')" onMouseOut="HideTip('tt17')">mxConstraintHandler</a> used for drawing and highlighting constraints.</td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.error" id=link18 onMouseOver="ShowTip(event, 'tt18', 'link18')" onMouseOut="HideTip('tt18')">error</a></td><td class=SDescription>Holds the current validation error while connections are being created.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.waypointsEnabled" id=link19 onMouseOver="ShowTip(event, 'tt19', 'link19')" onMouseOut="HideTip('tt19')">waypointsEnabled</a></td><td class=SDescription>Specifies if single clicks should add waypoints on the new edge. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.tapAndHoldEnabled" id=link20 onMouseOver="ShowTip(event, 'tt20', 'link20')" onMouseOut="HideTip('tt20')">tapAndHoldEnabled</a></td><td class=SDescription>Specifies if tap and hold should be used for starting connections on touch-based devices. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.tapAndHoldDelay" id=link21 onMouseOver="ShowTip(event, 'tt21', 'link21')" onMouseOut="HideTip('tt21')">tapAndHoldDelay</a></td><td class=SDescription>Specifies the time for a tap and hold. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.tapAndHoldInProgress" id=link22 onMouseOver="ShowTip(event, 'tt22', 'link22')" onMouseOut="HideTip('tt22')">tapAndHoldInProgress</a></td><td class=SDescription>True if the timer for tap and hold events is running.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.tapAndHoldValid" id=link23 onMouseOver="ShowTip(event, 'tt23', 'link23')" onMouseOut="HideTip('tt23')">tapAndHoldValid</a></td><td class=SDescription>True as long as the timer is running and the touch events stay within the given <a href="#mxConnectionHandler.tapAndHoldTolerance" class=LVariable id=link24 onMouseOver="ShowTip(event, 'tt24', 'link24')" onMouseOut="HideTip('tt24')">tapAndHoldTolerance</a>.</td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.tapAndHoldTolerance" id=link25 onMouseOver="ShowTip(event, 'tt24', 'link25')" onMouseOut="HideTip('tt24')">tapAndHoldTolerance</a></td><td class=SDescription>Specifies the tolerance for a tap and hold. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.initialTouchX" id=link26 onMouseOver="ShowTip(event, 'tt25', 'link26')" onMouseOut="HideTip('tt25')">initialTouchX</a></td><td class=SDescription>Holds the x-coordinate of the intial touch event for tap and hold.</td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.initialTouchY" id=link27 onMouseOver="ShowTip(event, 'tt26', 'link27')" onMouseOut="HideTip('tt26')">initialTouchY</a></td><td class=SDescription>Holds the y-coordinate of the intial touch event for tap and hold.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.ignoreMouseDown" id=link28 onMouseOver="ShowTip(event, 'tt27', 'link28')" onMouseOut="HideTip('tt27')">ignoreMouseDown</a></td><td class=SDescription>Specifies if the connection handler should ignore the state of the mouse button when highlighting the source. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.first" id=link29 onMouseOver="ShowTip(event, 'tt28', 'link29')" onMouseOut="HideTip('tt28')">first</a></td><td class=SDescription>Holds the <a href="../util/mxPoint-js.html#mxPoint" class=LClass id=link30 onMouseOver="ShowTip(event, 'tt29', 'link30')" onMouseOut="HideTip('tt29')">mxPoint</a> where the mouseDown took place while the handler is active.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.connectIconOffset" id=link31 onMouseOver="ShowTip(event, 'tt30', 'link31')" onMouseOut="HideTip('tt30')">connectIconOffset</a></td><td class=SDescription>Holds the offset for connect icons during connection preview. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.edgeState" id=link32 onMouseOver="ShowTip(event, 'tt31', 'link32')" onMouseOut="HideTip('tt31')">edgeState</a></td><td class=SDescription>Optional <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link33 onMouseOver="ShowTip(event, 'tt32', 'link33')" onMouseOut="HideTip('tt32')">mxCellState</a> that represents the preview edge while the handler is active. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.changeHandler" id=link34 onMouseOver="ShowTip(event, 'tt33', 'link34')" onMouseOut="HideTip('tt33')">changeHandler</a></td><td class=SDescription>Holds the change event listener for later removal.</td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.drillHandler" id=link35 onMouseOver="ShowTip(event, 'tt34', 'link35')" onMouseOut="HideTip('tt34')">drillHandler</a></td><td class=SDescription>Holds the drill event listener for later removal.</td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.mouseDownCounter" id=link36 onMouseOver="ShowTip(event, 'tt35', 'link36')" onMouseOut="HideTip('tt35')">mouseDownCounter</a></td><td class=SDescription>Counts the number of mouseDown events since the start. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#mxConnectionHandler.movePreviewAway" id=link37 onMouseOver="ShowTip(event, 'tt36', 'link37')" onMouseOut="HideTip('tt36')">movePreviewAway</a></td><td class=SDescription>Switch to enable moving the preview away from the mousepointer. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isEnabled" id=link38 onMouseOver="ShowTip(event, 'tt37', 'link38')" onMouseOut="HideTip('tt37')">isEnabled</a></td><td class=SDescription>Returns true if events are handled. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.setEnabled" id=link39 onMouseOver="ShowTip(event, 'tt38', 'link39')" onMouseOut="HideTip('tt38')">setEnabled</a></td><td class=SDescription>Enables or disables event handling. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isCreateTarget" id=link40 onMouseOver="ShowTip(event, 'tt39', 'link40')" onMouseOut="HideTip('tt39')">isCreateTarget</a></td><td class=SDescription>Returns <a href="#mxConnectionHandler.createTarget" class=LVariable id=link41 onMouseOver="ShowTip(event, 'tt13', 'link41')" onMouseOut="HideTip('tt13')">createTarget</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.setCreateTarget" id=link42 onMouseOver="ShowTip(event, 'tt40', 'link42')" onMouseOut="HideTip('tt40')">setCreateTarget</a></td><td class=SDescription>Sets <a href="#mxConnectionHandler.createTarget" class=LVariable id=link43 onMouseOver="ShowTip(event, 'tt13', 'link43')" onMouseOut="HideTip('tt13')">createTarget</a>.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.createShape" id=link44 onMouseOver="ShowTip(event, 'tt41', 'link44')" onMouseOut="HideTip('tt41')">createShape</a></td><td class=SDescription>Creates the preview shape for new connections.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.init" id=link45 onMouseOver="ShowTip(event, 'tt42', 'link45')" onMouseOut="HideTip('tt42')">init</a></td><td class=SDescription>Initializes the shapes required for this connection handler. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isConnectableCell" id=link46 onMouseOver="ShowTip(event, 'tt43', 'link46')" onMouseOut="HideTip('tt43')">isConnectableCell</a></td><td class=SDescription>Returns true if the given cell is connectable. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.createMarker" id=link47 onMouseOver="ShowTip(event, 'tt44', 'link47')" onMouseOut="HideTip('tt44')">createMarker</a></td><td class=SDescription>Creates and returns the <a href="mxCellMarker-js.html#mxCellMarker" class=LClass id=link48 onMouseOver="ShowTip(event, 'tt45', 'link48')" onMouseOut="HideTip('tt45')">mxCellMarker</a> used in <a href="#mxConnectionHandler.marker" class=LVariable id=link49 onMouseOver="ShowTip(event, 'tt15', 'link49')" onMouseOut="HideTip('tt15')">marker</a>.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.start" id=link50 onMouseOver="ShowTip(event, 'tt46', 'link50')" onMouseOut="HideTip('tt46')">start</a></td><td class=SDescription>Starts a new connection for the given state and coordinates.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.isConnecting" id=link51 onMouseOver="ShowTip(event, 'tt47', 'link51')" onMouseOut="HideTip('tt47')">isConnecting</a></td><td class=SDescription>Returns true if the source terminal has been clicked and a new connection is currently being previewed.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isValidSource" id=link52 onMouseOver="ShowTip(event, 'tt48', 'link52')" onMouseOut="HideTip('tt48')">isValidSource</a></td><td class=SDescription>Returns <a href="../view/mxGraph-js.html#mxGraph.isValidSource" class=LFunction id=link53 onMouseOver="ShowTip(event, 'tt49', 'link53')" onMouseOut="HideTip('tt49')">mxGraph.isValidSource</a> for the given source terminal.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.isValidTarget" id=link54 onMouseOver="ShowTip(event, 'tt50', 'link54')" onMouseOut="HideTip('tt50')">isValidTarget</a></td><td class=SDescription>Returns true. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.validateConnection" id=link55 onMouseOver="ShowTip(event, 'tt51', 'link55')" onMouseOut="HideTip('tt51')">validateConnection</a></td><td class=SDescription>Returns the error message or an empty string if the connection for the given source target pair is not valid. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.getConnectImage" id=link56 onMouseOver="ShowTip(event, 'tt52', 'link56')" onMouseOut="HideTip('tt52')">getConnectImage</a></td><td class=SDescription>Hook to return the <a href="../util/mxImage-js.html#mxImage" class=LClass id=link57 onMouseOver="ShowTip(event, 'tt9', 'link57')" onMouseOut="HideTip('tt9')">mxImage</a> used for the connection icon of the given <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link58 onMouseOver="ShowTip(event, 'tt32', 'link58')" onMouseOut="HideTip('tt32')">mxCellState</a>. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isMoveIconToFrontForState" id=link59 onMouseOver="ShowTip(event, 'tt53', 'link59')" onMouseOut="HideTip('tt53')">isMoveIconToFrontForState</a></td><td class=SDescription>Returns true if the state has a HTML label in the graph&rsquo;s container, otherwise it returns <a href="#mxConnectionHandler.moveIconFront" class=LVariable id=link60 onMouseOver="ShowTip(event, 'tt6', 'link60')" onMouseOut="HideTip('tt6')">moveIconFront</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.createIcons" id=link61 onMouseOver="ShowTip(event, 'tt54', 'link61')" onMouseOut="HideTip('tt54')">createIcons</a></td><td class=SDescription>Creates the array <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link62 onMouseOver="ShowTip(event, 'tt55', 'link62')" onMouseOut="HideTip('tt55')">mxImageShapes</a> that represent the connect icons for the given <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link63 onMouseOver="ShowTip(event, 'tt32', 'link63')" onMouseOut="HideTip('tt32')">mxCellState</a>.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.redrawIcons" id=link64 onMouseOver="ShowTip(event, 'tt56', 'link64')" onMouseOut="HideTip('tt56')">redrawIcons</a></td><td class=SDescription>Redraws the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link65 onMouseOver="ShowTip(event, 'tt55', 'link65')" onMouseOut="HideTip('tt55')">mxImageShapes</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.redrawIcons" >redrawIcons</a></td><td class=SDescription>Redraws the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link66 onMouseOver="ShowTip(event, 'tt55', 'link66')" onMouseOut="HideTip('tt55')">mxImageShapes</a>.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.destroyIcons" id=link67 onMouseOver="ShowTip(event, 'tt57', 'link67')" onMouseOut="HideTip('tt57')">destroyIcons</a></td><td class=SDescription>Destroys the given array of <a href="../shape/mxImageShape-js.html#mxImageShape" class=LClass id=link68 onMouseOver="ShowTip(event, 'tt55', 'link68')" onMouseOut="HideTip('tt55')">mxImageShapes</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.isStartEvent" id=link69 onMouseOver="ShowTip(event, 'tt58', 'link69')" onMouseOut="HideTip('tt58')">isStartEvent</a></td><td class=SDescription>Returns true if the given mouse down event should start this handler. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.mouseDown" id=link70 onMouseOver="ShowTip(event, 'tt59', 'link70')" onMouseOut="HideTip('tt59')">mouseDown</a></td><td class=SDescription>Handles the event by initiating a new connection.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.tapAndHold" id=link71 onMouseOver="ShowTip(event, 'tt60', 'link71')" onMouseOut="HideTip('tt60')">tapAndHold</a></td><td class=SDescription>Handles the <a href="../util/mxMouseEvent-js.html#mxMouseEvent" class=LClass id=link72 onMouseOver="ShowTip(event, 'tt61', 'link72')" onMouseOut="HideTip('tt61')">mxMouseEvent</a> by highlighting the <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link73 onMouseOver="ShowTip(event, 'tt32', 'link73')" onMouseOut="HideTip('tt32')">mxCellState</a>.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isImmediateConnectSource" id=link74 onMouseOver="ShowTip(event, 'tt62', 'link74')" onMouseOut="HideTip('tt62')">isImmediateConnectSource</a></td><td class=SDescription>Returns true if a tap on the given source state should immediately start connecting. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.createEdgeState" id=link75 onMouseOver="ShowTip(event, 'tt63', 'link75')" onMouseOut="HideTip('tt63')">createEdgeState</a></td><td class=SDescription>Hook to return an <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link76 onMouseOver="ShowTip(event, 'tt32', 'link76')" onMouseOut="HideTip('tt32')">mxCellState</a> which may be used during the preview. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.updateCurrentState" id=link77 onMouseOver="ShowTip(event, 'tt64', 'link77')" onMouseOut="HideTip('tt64')">updateCurrentState</a></td><td class=SDescription>Updates the current state for a given mouse move event by using the <a href="#mxConnectionHandler.marker" class=LVariable id=link78 onMouseOver="ShowTip(event, 'tt15', 'link78')" onMouseOut="HideTip('tt15')">marker</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.convertWaypoint" id=link79 onMouseOver="ShowTip(event, 'tt65', 'link79')" onMouseOut="HideTip('tt65')">convertWaypoint</a></td><td class=SDescription>Converts the given point from screen coordinates to model coordinates.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.mouseMove" id=link80 onMouseOver="ShowTip(event, 'tt66', 'link80')" onMouseOut="HideTip('tt66')">mouseMove</a></td><td class=SDescription>Handles the event by updating the preview edge or by highlighting a possible source or target terminal.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.getTargetPerimeterPoint" id=link81 onMouseOver="ShowTip(event, 'tt67', 'link81')" onMouseOut="HideTip('tt67')">getTargetPerimeterPoint</a></td><td class=SDescription>Returns the perimeter point for the given target state.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.getSourcePerimeterPoint" id=link82 onMouseOver="ShowTip(event, 'tt68', 'link82')" onMouseOut="HideTip('tt68')">getSourcePerimeterPoint</a></td><td class=SDescription>Hook to update the icon position(s) based on a mouseOver event. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.updateIcons" id=link83 onMouseOver="ShowTip(event, 'tt69', 'link83')" onMouseOut="HideTip('tt69')">updateIcons</a></td><td class=SDescription>Hook to update the icon position(s) based on a mouseOver event. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.isStopEvent" id=link84 onMouseOver="ShowTip(event, 'tt70', 'link84')" onMouseOut="HideTip('tt70')">isStopEvent</a></td><td class=SDescription>Returns true if the given mouse up event should stop this handler. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.addWaypoint" id=link85 onMouseOver="ShowTip(event, 'tt71', 'link85')" onMouseOut="HideTip('tt71')">addWaypoint</a></td><td class=SDescription>Adds the waypoint for the given event to &lt;waypoints&gt;.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.mouseUp" id=link86 onMouseOver="ShowTip(event, 'tt72', 'link86')" onMouseOut="HideTip('tt72')">mouseUp</a></td><td class=SDescription>Handles the event by inserting the new connection.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.reset" id=link87 onMouseOver="ShowTip(event, 'tt73', 'link87')" onMouseOut="HideTip('tt73')">reset</a></td><td class=SDescription>Resets the state of this handler.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.drawPreview" id=link88 onMouseOver="ShowTip(event, 'tt74', 'link88')" onMouseOut="HideTip('tt74')">drawPreview</a></td><td class=SDescription>Redraws the preview edge using the color and width returned by <a href="#mxConnectionHandler.getEdgeColor" class=LFunction id=link89 onMouseOver="ShowTip(event, 'tt75', 'link89')" onMouseOut="HideTip('tt75')">getEdgeColor</a> and <a href="#mxConnectionHandler.getEdgeWidth" class=LFunction id=link90 onMouseOver="ShowTip(event, 'tt76', 'link90')" onMouseOut="HideTip('tt76')">getEdgeWidth</a>.</td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.getEdgeColor" id=link91 onMouseOver="ShowTip(event, 'tt75', 'link91')" onMouseOut="HideTip('tt75')">getEdgeColor</a></td><td class=SDescription>Returns the color used to draw the preview edge. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.getEdgeWidth" id=link92 onMouseOver="ShowTip(event, 'tt76', 'link92')" onMouseOut="HideTip('tt76')">getEdgeWidth</a></td><td class=SDescription>Returns the width used to draw the preview edge. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.connect" id=link93 onMouseOver="ShowTip(event, 'tt1', 'link93')" onMouseOut="HideTip('tt1')">connect</a></td><td class=SDescription>Connects the given source and target using a new edge. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.selectCells" id=link94 onMouseOver="ShowTip(event, 'tt77', 'link94')" onMouseOut="HideTip('tt77')">selectCells</a></td><td class=SDescription>Selects the given edge after adding a new connection. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.insertEdge" id=link95 onMouseOver="ShowTip(event, 'tt78', 'link95')" onMouseOut="HideTip('tt78')">insertEdge</a></td><td class=SDescription>Creates, inserts and returns the new edge for the given parameters. </td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.createTargetVertex" id=link96 onMouseOver="ShowTip(event, 'tt14', 'link96')" onMouseOut="HideTip('tt14')">createTargetVertex</a></td><td class=SDescription>Hook method for creating new vertices on the fly if no target was under the mouse. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.getAlignmentTolerance" id=link97 onMouseOver="ShowTip(event, 'tt79', 'link97')" onMouseOut="HideTip('tt79')">getAlignmentTolerance</a></td><td class=SDescription>Returns the tolerance for aligning new targets to sources.</td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#mxConnectionHandler.createEdge" id=link98 onMouseOver="ShowTip(event, 'tt80', 'link98')" onMouseOut="HideTip('tt80')">createEdge</a></td><td class=SDescription>Creates and returns a new edge using <a href="#mxConnectionHandler.factoryMethod" class=LVariable id=link99 onMouseOver="ShowTip(event, 'tt5', 'link99')" onMouseOut="HideTip('tt5')">factoryMethod</a> if one exists. </td></tr><tr class="SFunction SIndent2"><td class=SEntry><a href="#mxConnectionHandler.destroy" id=link100 onMouseOver="ShowTip(event, 'tt81', 'link100')" onMouseOut="HideTip('tt81')">destroy</a></td><td class=SDescription>Destroys the handler and all its resources and DOM nodes. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>
<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>.&nbsp; The &lt;code&gt;cell&lt;/code&gt; property contains the inserted edge, the &lt;code&gt;event&lt;/code&gt; and &lt;code&gt;target&lt;/code&gt; 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.&nbsp; Modify &lt;mxConstants.ACTIVE_REGION&gt; 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.&nbsp; The function takes the source and target <a href="../model/mxCell-js.html#mxCell" class=LClass id=link116 onMouseOver="ShowTip(event, 'tt85', 'link116')" onMouseOut="HideTip('tt85')">mxCell</a> as the first and second argument and an optional cell style from the preview as the third argument.&nbsp; It returns the <a href="../model/mxCell-js.html#mxCell" class=LClass id=link117 onMouseOver="ShowTip(event, 'tt85', 'link117')" onMouseOut="HideTip('tt85')">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.&nbsp; The function takes the source and target <a href="../model/mxCell-js.html#mxCell" class=LClass id=link119 onMouseOver="ShowTip(event, 'tt85', 'link119')" onMouseOut="HideTip('tt85')">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, 'tt85', 'link120')" onMouseOut="HideTip('tt85')">mxCell</a> that represents the edge.&nbsp; This is used in <a href="#mxConnectionHandler.createEdge" class=LFunction id=link121 onMouseOver="ShowTip(event, 'tt80', 'link121')" onMouseOut="HideTip('tt80')">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.&nbsp; This is used for HTML labels on vertices which hide the connect icon.&nbsp; 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.&nbsp; 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.&nbsp; This can be set to true if the icons of the connection handler conflict with other handles, such as the vertex label move handle.&nbsp; 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.&nbsp; This is used in <a href="#mxConnectionHandler.createIcons" class=LFunction id=link124 onMouseOver="ShowTip(event, 'tt54', 'link124')" onMouseOut="HideTip('tt54')">createIcons</a>.&nbsp; 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.&nbsp; 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.&nbsp; 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.&nbsp; 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.&nbsp; 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.&nbsp; 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 &lt;mxTerminalMarker&gt; 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.&nbsp; 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.&nbsp; 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.&nbsp; 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.&nbsp; Default is 4 pixels.</p></div></div></div>
<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="mxConnectionHandler.initialTouchX"></a>initialTouchX</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.initialTouchX</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.&nbsp; 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, 'tt29', 'link130')" onMouseOut="HideTip('tt29')">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.&nbsp; Default is mxPoint(0, <a href="../util/mxConstants-js.html#mxConstants.TOOLTIP_VERTICAL_OFFSET" class=LVariable id=link131 onMouseOver="ShowTip(event, 'tt86', 'link131')" onMouseOut="HideTip('tt86')">mxConstants.TOOLTIP_VERTICAL_OFFSET</a>).&nbsp; 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, 'tt32', 'link132')" onMouseOut="HideTip('tt32')">mxCellState</a> that represents the preview edge while the handler is active.&nbsp; This is created in <a href="#mxConnectionHandler.createEdgeState" class=LFunction id=link133 onMouseOver="ShowTip(event, 'tt63', 'link133')" onMouseOut="HideTip('tt63')">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.&nbsp; 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.&nbsp; 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.&nbsp; Default is the value of <a href="../mxClient-js.html#mxClient.IS_IE" class=LVariable id=link134 onMouseOver="ShowTip(event, 'tt87', 'link134')" onMouseOut="HideTip('tt87')">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.&nbsp; 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.&nbsp; 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.&nbsp; This should be invoked if &lt;mxGraph.container&gt; 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.&nbsp; This is a hook to disable floating connections.&nbsp; 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, 'tt45', 'link139')" onMouseOut="HideTip('tt45')">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, 'tt49', 'link141')" onMouseOut="HideTip('tt49')">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, 'tt85', 'link142')" onMouseOut="HideTip('tt85')">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.&nbsp; The call to <a href="../view/mxGraph-js.html#mxGraph.isValidTarget" class=LFunction id=link143 onMouseOver="ShowTip(event, 'tt88', 'link143')" onMouseOut="HideTip('tt88')">mxGraph.isValidTarget</a> is implicit by calling <a href="../view/mxGraph-js.html#mxGraph.getEdgeValidationError" class=LFunction id=link144 onMouseOver="ShowTip(event, 'tt89', 'link144')" onMouseOut="HideTip('tt89')">mxGraph.getEdgeValidationError</a> in <a href="#mxConnectionHandler.validateConnection" class=LFunction id=link145 onMouseOver="ShowTip(event, 'tt51', 'link145')" onMouseOut="HideTip('tt51')">validateConnection</a>.&nbsp; 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, 'tt85', 'link146')" onMouseOut="HideTip('tt85')">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.&nbsp; Otherwise it returns null.&nbsp; This implementation uses <a href="../view/mxGraph-js.html#mxGraph.getEdgeValidationError" class=LFunction id=link147 onMouseOver="ShowTip(event, 'tt89', 'link147')" onMouseOut="HideTip('tt89')">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, 'tt85', 'link148')" onMouseOut="HideTip('tt85')">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, 'tt85', 'link149')" onMouseOut="HideTip('tt85')">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, 'tt32', 'link151')" onMouseOut="HideTip('tt32')">mxCellState</a>.&nbsp; 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, 'tt32', 'link153')" onMouseOut="HideTip('tt32')">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&rsquo;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, 'tt32', 'link155')" onMouseOut="HideTip('tt32')">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, 'tt55', 'link156')" onMouseOut="HideTip('tt55')">mxImageShapes</a> that represent the connect icons for the given <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link157 onMouseOver="ShowTip(event, 'tt32', 'link157')" onMouseOut="HideTip('tt32')">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, 'tt32', 'link158')" onMouseOut="HideTip('tt32')">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, 'tt55', 'link159')" onMouseOut="HideTip('tt55')">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, 'tt55', 'link160')" onMouseOut="HideTip('tt55')">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, 'tt55', 'link161')" onMouseOut="HideTip('tt55')">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, 'tt55', 'link162')" onMouseOut="HideTip('tt55')">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, 'tt55', 'link163')" onMouseOut="HideTip('tt55')">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, 'tt55', 'link164')" onMouseOut="HideTip('tt55')">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.&nbsp; 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 &lt;previous&gt; and <a href="#mxConnectionHandler.error" class=LVariable id=link166 onMouseOver="ShowTip(event, 'tt18', 'link166')" onMouseOut="HideTip('tt18')">error</a> are not null and &lt;icons&gt; is null or &lt;icons&gt; and &lt;icon&gt; 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, 'tt61', 'link167')" onMouseOut="HideTip('tt61')">mxMouseEvent</a> by highlighting the <a href="../view/mxCellState-js.html#mxCellState" class=LClass id=link168 onMouseOver="ShowTip(event, 'tt32', 'link168')" onMouseOut="HideTip('tt32')">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, 'tt61', 'link169')" onMouseOut="HideTip('tt61')">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, 'tt32', 'link170')" onMouseOut="HideTip('tt32')">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.&nbsp; 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, 'tt32', 'link171')" onMouseOut="HideTip('tt32')">mxCellState</a> which may be used during the preview.&nbsp; 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, &lsquo;edgeStyle=elbowEdgeStyle&rsquo;);</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, 'tt32', 'link173')" onMouseOut="HideTip('tt32')">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, 'tt61', 'link174')" onMouseOut="HideTip('tt61')">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.&nbsp; 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, 'tt32', 'link175')" onMouseOut="HideTip('tt32')">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, 'tt29', 'link176')" onMouseOut="HideTip('tt29')">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, 'tt61', 'link177')" onMouseOut="HideTip('tt61')">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.&nbsp; 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, 'tt32', 'link178')" onMouseOut="HideTip('tt32')">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, 'tt61', 'link179')" onMouseOut="HideTip('tt61')">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.&nbsp; 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.&nbsp; 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.&nbsp; 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 &lt;waypoints&gt;.</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, 'tt75', 'link182')" onMouseOut="HideTip('tt75')">getEdgeColor</a> and <a href="#mxConnectionHandler.getEdgeWidth" class=LFunction id=link183 onMouseOver="ShowTip(event, 'tt76', 'link183')" onMouseOut="HideTip('tt76')">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.&nbsp; 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.&nbsp; 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.&nbsp; This implementation uses <a href="#mxConnectionHandler.createEdge" class=LFunction id=link184 onMouseOver="ShowTip(event, 'tt80', 'link184')" onMouseOut="HideTip('tt80')">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, 'tt85', 'link185')" onMouseOut="HideTip('tt85')">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, 'tt85', 'link186')" onMouseOut="HideTip('tt85')">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, 'tt85', 'link187')" onMouseOut="HideTip('tt85')">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.&nbsp; 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.&nbsp; This implementation does only use <a href="#mxConnectionHandler.createEdge" class=LFunction id=link188 onMouseOver="ShowTip(event, 'tt80', 'link188')" onMouseOut="HideTip('tt80')">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, 'tt90', 'link190')" onMouseOut="HideTip('tt90')">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.&nbsp; 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, 'tt85', 'link192')" onMouseOut="HideTip('tt85')">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.&nbsp; If no factory method is defined, then a new default edge is returned.&nbsp; 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, 'tt85', 'link194')" onMouseOut="HideTip('tt85')">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, 'tt85', 'link195')" onMouseOut="HideTip('tt85')">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.&nbsp; This should be called on all instances.&nbsp; 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">mxStylesheetCodec</a></div></div><div class=MEntry><div class=MFile><a href="../io/mxTerminalChangeCodec-js.html">mxTerminalChangeCodec</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent7')">Layout</a><div class=MGroupContent id=MGroupContent7><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent6')">Hierarchical</a><div class=MGroupContent id=MGroupContent6><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent4')">Model</a><div class=MGroupContent id=MGroupContent4><div class=MEntry><div class=MFile><a href="../layout/hierarchical/model/mxGraphAbstractHierarchyCell-js.html">mxGraphAbstractHierarchyCell</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/model/mxGraphHierarchyEdge-js.html">mxGraphHierarchyEdge</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/model/mxGraphHierarchyModel-js.html">mxGraphHierarchyModel</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/model/mxGraphHierarchyNode-js.html">mxGraphHierarchyNode</a></div></div></div></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/mxHierarchicalLayout-js.html">mxHierarchicalLayout</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent5')">Stage</a><div class=MGroupContent id=MGroupContent5><div class=MEntry><div class=MFile><a href="../layout/hierarchical/stage/mxCoordinateAssignment-js.html">mxCoordinateAssignment</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/stage/mxHierarchicalLayoutStage-js.html">mxHierarchicalLayoutStage</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/stage/mxMedianHybridCrossingReduction-js.html">mxMedianHybridCrossingReduction</a></div></div><div class=MEntry><div class=MFile><a href="../layout/hierarchical/stage/mxMinimumCycleRemover-js.html">mxMinimumCycleRemover</a></div></div></div></div></div></div></div></div><div class=MEntry><div class=MFile><a href="../layout/mxCircleLayout-js.html">mxCircleLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxCompactTreeLayout-js.html">mxCompactTreeLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxCompositeLayout-js.html">mxCompositeLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxEdgeLabelLayout-js.html">mxEdgeLabelLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxFastOrganicLayout-js.html">mxFastOrganicLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxGraphLayout-js.html">mxGraphLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxParallelEdgeLayout-js.html">mxParallelEdgeLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxPartitionLayout-js.html">mxPartitionLayout</a></div></div><div class=MEntry><div class=MFile><a href="../layout/mxStackLayout-js.html">mxStackLayout</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent8')">Model</a><div class=MGroupContent id=MGroupContent8><div class=MEntry><div class=MFile><a href="../model/mxCell-js.html">mxCell</a></div></div><div class=MEntry><div class=MFile><a href="../model/mxCellPath-js.html">mxCellPath</a></div></div><div class=MEntry><div class=MFile><a href="../model/mxGeometry-js.html">mxGeometry</a></div></div><div class=MEntry><div class=MFile><a href="../model/mxGraphModel-js.html">mxGraphModel</a></div></div></div></div></div><div class=MEntry><div class=MFile><a href="../mxClient-js.html">mxClient</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent9')">Shape</a><div class=MGroupContent id=MGroupContent9><div class=MEntry><div class=MFile><a href="../shape/mxActor-js.html">mxActor</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxArrow-js.html">mxArrow</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxCloud-js.html">mxCloud</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxConnector-js.html">mxConnector</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxCylinder-js.html">mxCylinder</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxDoubleEllipse-js.html">mxDoubleEllipse</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxEllipse-js.html">mxEllipse</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxHexagon-js.html">mxHexagon</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxImageShape-js.html">mxImageShape</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxLabel-js.html">mxLabel</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxLine-js.html">mxLine</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxMarker-js.html">mxMarker</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxPolyline-js.html">mxPolyline</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxRectangleShape-js.html">mxRectangleShape</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxRhombus-js.html">mxRhombus</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxShape-js.html">mxShape</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxStencil-js.html">mxStencil</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxStencilRegistry-js.html">mxStencilRegistry</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxStencilShape-js.html">mxStencilShape</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxSwimlane-js.html">mxSwimlane</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxText-js.html">mxText</a></div></div><div class=MEntry><div class=MFile><a href="../shape/mxTriangle-js.html">mxTriangle</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent10')">Util</a><div class=MGroupContent id=MGroupContent10><div class=MEntry><div class=MFile><a href="../util/mxAnimation-js.html">mxAnimation</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxAutoSaveManager-js.html">mxAutoSaveManager</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxClipboard-js.html">mxClipboard</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxConstants-js.html">mxConstants</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxDictionary-js.html">mxDictionary</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxDivResizer-js.html">mxDivResizer</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxDragSource-js.html">mxDragSource</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxEffects-js.html">mxEffects</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxEvent-js.html">mxEvent</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxEventObject-js.html">mxEventObject</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxEventSource-js.html">mxEventSource</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxForm-js.html">mxForm</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxGuide-js.html">mxGuide</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxImage-js.html">mxImage</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxImageBundle-js.html">mxImageBundle</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxImageExport-js.html">mxImageExport</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxLog-js.html">mxLog</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxMorphing-js.html">mxMorphing</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxMouseEvent-js.html">mxMouseEvent</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxObjectIdentity-js.html">mxObjectIdentity</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxPanningManager-js.html">mxPanningManager</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxPath-js.html">mxPath</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxPoint-js.html">mxPoint</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxPopupMenu-js.html">mxPopupMenu</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxRectangle-js.html">mxRectangle</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxResources-js.html">mxResources</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxSession-js.html">mxSession</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxSvgCanvas2D-js.html">mxSvgCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxToolbar-js.html">mxToolbar</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxUndoableEdit-js.html">mxUndoableEdit</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxUndoManager-js.html">mxUndoManager</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxUrlConverter-js.html">mxUrlConverter</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxUtils-js.html">mxUtils</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxWindow-js.html">mxWindow</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxXmlCanvas2D-js.html">mxXmlCanvas2D</a></div></div><div class=MEntry><div class=MFile><a href="../util/mxXmlRequest-js.html">mxXmlRequest</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent11')">View</a><div class=MGroupContent id=MGroupContent11><div class=MEntry><div class=MFile><a href="../view/mxCellEditor-js.html">mxCellEditor</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxCellOverlay-js.html">mxCellOverlay</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxCellRenderer-js.html">mxCellRenderer</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxCellState-js.html">mxCellState</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxCellStatePreview-js.html">mxCellStatePreview</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxConnectionConstraint-js.html">mxConnectionConstraint</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxEdgeStyle-js.html">mxEdgeStyle</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxGraph-js.html">mxGraph</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxGraphSelectionModel-js.html">mxGraphSelectionModel</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxGraphView-js.html">mxGraphView</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxLayoutManager-js.html">mxLayoutManager</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxMultiplicity-js.html">mxMultiplicity</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxOutline-js.html">mxOutline</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxPerimeter-js.html">mxPerimeter</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxPrintPreview-js.html">mxPrintPreview</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxSpaceManager-js.html">mxSpaceManager</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxStyleRegistry-js.html">mxStyleRegistry</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxStylesheet-js.html">mxStylesheet</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxSwimlaneManager-js.html">mxSwimlaneManager</a></div></div><div class=MEntry><div class=MFile><a href="../view/mxTemporaryCellStates-js.html">mxTemporaryCellStates</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent12')">Index</a><div class=MGroupContent id=MGroupContent12><div class=MEntry><div class=MIndex><a href="../../index/General.html">Everything</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Classes.html">Classes</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Cookies.html">Cookies</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Events.html">Events</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Files.html">Files</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Functions.html">Functions</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Variables.html">Variables</a></div></div></div></div></div><script type="text/javascript"><!--
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 connection. </div></div><div class=CToolTip id="tt14"><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.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>Hook method for creating new vertices on the fly if no target was under the mouse. </div></div><div class=CToolTip id="tt15"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.marker</td></tr></table></blockquote>Holds the mxTerminalMarker used for finding source and target cells.</div></div><div class=CToolTip id="tt16"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.constraintHandler</td></tr></table></blockquote>Holds the mxConstraintHandler used for drawing and highlighting constraints.</div></div><div class=CToolTip id="tt17"><div class=CClass>Handles constraints on connection targets. </div></div><div class=CToolTip id="tt18"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.error</td></tr></table></blockquote>Holds the current validation error while connections are being created.</div></div><div class=CToolTip id="tt19"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.waypointsEnabled</td></tr></table></blockquote>Specifies if single clicks should add waypoints on the new edge. </div></div><div class=CToolTip id="tt20"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldEnabled</td></tr></table></blockquote>Specifies if tap and hold should be used for starting connections on touch-based devices. </div></div><div class=CToolTip id="tt21"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldDelay</td></tr></table></blockquote>Specifies the time for a tap and hold. </div></div><div class=CToolTip id="tt22"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldInProgress</td></tr></table></blockquote>True if the timer for tap and hold events is running.</div></div><div class=CToolTip id="tt23"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldValid</td></tr></table></blockquote>True as long as the timer is running and the touch events stay within the given tapAndHoldTolerance.</div></div><div class=CToolTip id="tt24"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.tapAndHoldTolerance</td></tr></table></blockquote>Specifies the tolerance for a tap and hold. </div></div><div class=CToolTip id="tt25"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.initialTouchX</td></tr></table></blockquote>Holds the x-coordinate of the intial touch event for tap and hold.</div></div><div class=CToolTip id="tt26"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.initialTouchY</td></tr></table></blockquote>Holds the y-coordinate of the intial touch event for tap and hold.</div></div><div class=CToolTip id="tt27"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.ignoreMouseDown</td></tr></table></blockquote>Specifies if the connection handler should ignore the state of the mouse button when highlighting the source. </div></div><div class=CToolTip id="tt28"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.first</td></tr></table></blockquote>Holds the mxPoint where the mouseDown took place while the handler is active.</div></div><div class=CToolTip id="tt29"><div class=CClass>Implements a 2-dimensional vector with double precision coordinates.</div></div><div class=CToolTip id="tt30"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.connectIconOffset</td></tr></table></blockquote>Holds the offset for connect icons during connection preview. </div></div><div class=CToolTip id="tt31"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.edgeState</td></tr></table></blockquote>Optional mxCellState that represents the preview edge while the handler is active. </div></div><div class=CToolTip id="tt32"><div class=CClass>Represents the current state of a cell in a given mxGraphView.</div></div><div class=CToolTip id="tt33"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.changeHandler</td></tr></table></blockquote>Holds the change event listener for later removal.</div></div><div class=CToolTip id="tt34"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.drillHandler</td></tr></table></blockquote>Holds the drill event listener for later removal.</div></div><div class=CToolTip id="tt35"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.mouseDownCounter</td></tr></table></blockquote>Counts the number of mouseDown events since the start. </div></div><div class=CToolTip id="tt36"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.movePreviewAway</td></tr></table></blockquote>Switch to enable moving the preview away from the mousepointer. </div></div><div class=CToolTip id="tt37"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isEnabled = function()</td></tr></table></blockquote>Returns true if events are handled. </div></div><div class=CToolTip id="tt38"><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.setEnabled = function(</td><td class=PParameter nowrap>enabled</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Enables or disables event handling. </div></div><div class=CToolTip id="tt39"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isCreateTarget = function()</td></tr></table></blockquote>Returns createTarget.</div></div><div class=CToolTip id="tt40"><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.setCreateTarget = function(</td><td class=PParameter nowrap>value</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Sets createTarget.</div></div><div class=CToolTip id="tt41"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createShape = function()</td></tr></table></blockquote>Creates the preview shape for new connections.</div></div><div class=CToolTip id="tt42"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.init = function()</td></tr></table></blockquote>Initializes the shapes required for this connection handler. </div></div><div class=CToolTip id="tt43"><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.isConnectableCell = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if the given cell is connectable. </div></div><div class=CToolTip id="tt44"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.createMarker = function()</td></tr></table></blockquote>Creates and returns the mxCellMarker used in marker.</div></div><div class=CToolTip id="tt45"><div class=CClass>A helper class to process mouse locations and highlight cells.</div></div><div class=CToolTip id="tt46"><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.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>Starts a new connection for the given state and coordinates.</div></div><div class=CToolTip id="tt47"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.isConnecting = function()</td></tr></table></blockquote>Returns true if the source terminal has been clicked and a new connection is currently being previewed.</div></div><div class=CToolTip id="tt48"><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.isValidSource = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns mxGraph.isValidSource for the given source terminal.</div></div><div class=CToolTip id="tt49"><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>mxGraph.prototype.isValidSource = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if the given cell is a valid source for new connections. </div></div><div class=CToolTip id="tt50"><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.isValidTarget = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true. </div></div><div class=CToolTip id="tt51"><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.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>Returns the error message or an empty string if the connection for the given source target pair is not valid. </div></div><div class=CToolTip id="tt52"><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.getConnectImage = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Hook to return the mxImage used for the connection icon of the given mxCellState. </div></div><div class=CToolTip id="tt53"><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.isMoveIconToFrontForState = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if the state has a HTML label in the graph&rsquo;s container, otherwise it returns moveIconFront.</div></div><div class=CToolTip id="tt54"><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.createIcons = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Creates the array mxImageShapes that represent the connect icons for the given mxCellState.</div></div><div class=CToolTip id="tt55"><div class=CClass>Extends mxShape to implement an image shape. </div></div><div class=CToolTip id="tt56"><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.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>Redraws the given array of mxImageShapes.</div></div><div class=CToolTip id="tt57"><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.destroyIcons = function(</td><td class=PParameter nowrap>icons</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Destroys the given array of mxImageShapes.</div></div><div class=CToolTip id="tt58"><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.isStartEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if the given mouse down event should start this handler. </div></div><div class=CToolTip id="tt59"><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.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>Handles the event by initiating a new connection.</div></div><div class=CToolTip id="tt60"><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.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>Handles the mxMouseEvent by highlighting the mxCellState.</div></div><div class=CToolTip id="tt61"><div class=CClass>Base class for all mouse events in mxGraph. </div></div><div class=CToolTip id="tt62"><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.isImmediateConnectSource = function(</td><td class=PParameter nowrap>state</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if a tap on the given source state should immediately start connecting. </div></div><div class=CToolTip id="tt63"><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.createEdgeState = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Hook to return an mxCellState which may be used during the preview. </div></div><div class=CToolTip id="tt64"><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.updateCurrentState = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Updates the current state for a given mouse move event by using the marker.</div></div><div class=CToolTip id="tt65"><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.convertWaypoint = function(</td><td class=PParameter nowrap>point</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Converts the given point from screen coordinates to model coordinates.</div></div><div class=CToolTip id="tt66"><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.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>Handles the event by updating the preview edge or by highlighting a possible source or target terminal.</div></div><div class=CToolTip id="tt67"><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.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>Returns the perimeter point for the given target state.</div></div><div class=CToolTip id="tt68"><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.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>Hook to update the icon position(s) based on a mouseOver event. </div></div><div class=CToolTip id="tt69"><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.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>Hook to update the icon position(s) based on a mouseOver event. </div></div><div class=CToolTip id="tt70"><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.isStopEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns true if the given mouse up event should stop this handler. </div></div><div class=CToolTip id="tt71"><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.addWaypointForEvent = function(</td><td class=PParameter nowrap>me</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Adds the waypoint for the given event to waypoints.</div></div><div class=CToolTip id="tt72"><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.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>Handles the event by inserting the new connection.</div></div><div class=CToolTip id="tt73"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.reset = function()</td></tr></table></blockquote>Resets the state of this handler.</div></div><div class=CToolTip id="tt74"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.drawPreview = function()</td></tr></table></blockquote>Redraws the preview edge using the color and width returned by getEdgeColor and getEdgeWidth.</div></div><div class=CToolTip id="tt75"><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.getEdgeColor = function(</td><td class=PParameter nowrap>valid</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns the color used to draw the preview edge. </div></div><div class=CToolTip id="tt76"><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.getEdgeWidth = function(</td><td class=PParameter nowrap>valid</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns the width used to draw the preview edge. </div></div><div class=CToolTip id="tt77"><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.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>Selects the given edge after adding a new connection. </div></div><div class=CToolTip id="tt78"><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.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>Creates, inserts and returns the new edge for the given parameters. </div></div><div class=CToolTip id="tt79"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.getAlignmentTolerance = function()</td></tr></table></blockquote>Returns the tolerance for aligning new targets to sources.</div></div><div class=CToolTip id="tt80"><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.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>Creates and returns a new edge using factoryMethod if one exists. </div></div><div class=CToolTip id="tt81"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>mxConnectionHandler.prototype.destroy = function()</td></tr></table></blockquote>Destroys the handler and all its resources and DOM nodes. </div></div><div class=CToolTip id="tt82"><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>mxGraph.prototype.setConnectable = function(</td><td class=PParameter nowrap>connectable</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Specifies if the graph should allow new connections. </div></div><div class=CToolTip id="tt83"><div class=CVariable>Defines the portion of the cell which is to be used as a connectable region. </div></div><div class=CToolTip id="tt84"><div class=CVariable>Defines the minimum size in pixels of the portion of the cell which is to be used as a connectable region. </div></div><div class=CToolTip id="tt85"><div class=CClass>Cells are the elements of the graph model. </div></div><div class=CToolTip id="tt86"><div class=CVariable>Defines the vertical offset for the tooltip. </div></div><div class=CToolTip id="tt87"><div class=CVariable><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>IS_IE: navigator.userAgent.indexOf(</td><td class=PParameter nowrap>'MSIE'</td><td class=PAfterParameters nowrap>) &gt;</td></tr></table></td></tr></table></blockquote>True if the current browser is Internet Explorer.</div></div><div class=CToolTip id="tt88"><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>mxGraph.prototype.isValidTarget = function(</td><td class=PParameter nowrap>cell</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Returns isValidSource for the given cell. </div></div><div class=CToolTip id="tt89"><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>mxGraph.prototype.getEdgeValidationError = function(</td><td class=PParameter nowrap>edge,</td></tr><tr><td></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>Returns the validation error message to be displayed when inserting or changing an edges&rsquo; connectivity. </div></div><div class=CToolTip id="tt90"><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>mxGraph.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>Adds a new edge into the given parent mxCell using value as the user object and the given source and target as the terminals of the new edge. </div></div><!--END_ND_TOOLTIPS-->
<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>