UNPKG

markgojs

Version:

Interactive diagrams, charts, and graphs, such as trees, flowcharts, orgcharts, UML, BPMN, or business diagrams

1,521 lines (500 loc) 105 kB
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>GoJS&reg; Tool Class</title> <script src="../../assets/js/jquery.min.js"></script> <script src="../../assets/js/bootstrap.min.js"></script> <script src="../../assets/js/highlight.js"></script> <script src="../../assets/js/api.js"></script> <script src="../../assets/js/fuse.min.js"></script> <link href="../../assets/css/bootstrap.min.css" rel="stylesheet" > <!-- custom CSS after bootstrap --> <link href="../../assets/css/main.css" rel="stylesheet" type="text/css"/> <link href="../../assets/css/api.css" rel="stylesheet" type="text/css"/> <!--<link rel="stylesheet" href="../../assets/css/api.css" type="text/css" media="all" />--> <link rel="stylesheet" href="../../assets/css/highlight.css" type="text/css" media="all" /> </head> <body> <!-- non-fixed navbar --> <nav id="non-fixed-nav" class="navbar navbar-inverse navbar-top"> <div class="container-fluid"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#navbar"> <a id="toplogo" class="navbar-brand" href="../../index.html">GoJS</a> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> </div> </div> <div id="navbar" class="navbar-collapse collapse"> <ul class="nav navbar-nav navbar-right"> <li><a href="../../index.html">Home</a></li> <li><a href="../../learn/index.html">Learn</a></li> <li><a href="../../samples/index.html">Samples</a></li> <li><a href="../../intro/index.html">Intro</a></li> <li><a href="../../api/index.html">API</a></li> <li><a href="https://www.nwoods.com/components/evalform.htm">Register</a></li> <li><a href="../../download.html">Download</a></li> <li><a href="https://forum.nwoods.com/c/gojs">Forum</a></li> <li><a href="https://www.nwoods.com/contact.html" onclick="ga('send','event','Outbound Link','click','contact');">Contact</a></li> <li class="buy"><a href="https://www.nwoods.com/sales/index.html" onclick="ga('send','event','Outbound Link','click','buy');">Buy</a></li> <li class="activate"><a href="https://www.nwoods.com/app/activate.aspx?sku=gojs">Activate</a></li> </ul> </div><!--/.nav-collapse --> </div> </nav> <div class="container-fluid"> <!-- ============================== classes index ============================ --> <div id="navindex" class="col-md-2"> <!-- begin publish.classesIndex --> <!-- <div><a href="../index.html">GoJS Class Index</a></div> --> <div class="sidebar-nav"> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#DiagramNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#DiagramNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Diagram Classes</span> </div> </div> <div id="DiagramNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/Adornment.html" class="linkConstructor">Adornment</a></li> <li><a href="../symbols/AnimationManager.html" class="linkConstructor">AnimationManager</a></li> <li><a href="../symbols/CommandHandler.html" class="linkConstructor">CommandHandler</a></li> <li><a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a></li> <li><a href="../symbols/DiagramEvent.html" class="linkConstructor">DiagramEvent</a></li> <li><a href="../symbols/GraphObject.html" class="linkConstructor">GraphObject</a></li> <li><a href="../symbols/Group.html" class="linkConstructor">Group</a></li> <li><a href="../symbols/InputEvent.html" class="linkConstructor">InputEvent</a></li> <li><a href="../symbols/Layer.html" class="linkConstructor">Layer</a></li> <li><a href="../symbols/Link.html" class="linkConstructor">Link</a></li> <li><a href="../symbols/Node.html" class="linkConstructor">Node</a></li> <li><a href="../symbols/Overview.html" class="linkConstructor">Overview</a></li> <li><a href="../symbols/Palette.html" class="linkConstructor">Palette</a></li> <li><a href="../symbols/Panel.html" class="linkConstructor">Panel</a></li> <li><a href="../symbols/Part.html" class="linkConstructor">Part</a></li> <li><a href="../symbols/Picture.html" class="linkConstructor">Picture</a></li> <li><a href="../symbols/Placeholder.html" class="linkConstructor">Placeholder</a></li> <li><a href="../symbols/RowColumnDefinition.html" class="linkConstructor">RowColumnDefinition</a></li> <li><a href="../symbols/Shape.html" class="linkConstructor">Shape</a></li> <li><a href="../symbols/TextBlock.html" class="linkConstructor">TextBlock</a></li> </ul> </div> </div> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#GeometryNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#GeometryNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Geometry Classes</span> </div> </div> <div id="GeometryNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/Brush.html" class="linkConstructor">Brush</a></li> <li><a href="../symbols/Geometry.html" class="linkConstructor">Geometry</a></li> <li><a href="../symbols/Margin.html" class="linkConstructor">Margin</a></li> <li><a href="../symbols/PathFigure.html" class="linkConstructor">PathFigure</a></li> <li><a href="../symbols/PathSegment.html" class="linkConstructor">PathSegment</a></li> <li><a href="../symbols/Point.html" class="linkConstructor">Point</a></li> <li><a href="../symbols/Rect.html" class="linkConstructor">Rect</a></li> <li><a href="../symbols/Size.html" class="linkConstructor">Size</a></li> <li><a href="../symbols/Spot.html" class="linkConstructor">Spot</a></li> </ul> </div> </div> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#ModelNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ModelNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Model Classes</span> </div> </div> <div id="ModelNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/Binding.html" class="linkConstructor">Binding</a></li> <li><a href="../symbols/ChangedEvent.html" class="linkConstructor">ChangedEvent</a></li> <li><a href="../symbols/GraphLinksModel.html" class="linkConstructor">GraphLinksModel</a></li> <li><a href="../symbols/Model.html" class="linkConstructor">Model</a></li> <li><a href="../symbols/Transaction.html" class="linkConstructor">Transaction</a></li> <li><a href="../symbols/TreeModel.html" class="linkConstructor">TreeModel</a></li> <li><a href="../symbols/UndoManager.html" class="linkConstructor">UndoManager</a></li> </ul> </div> </div> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#LayoutNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#LayoutNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Layout Classes</span> </div> </div> <div id="LayoutNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/CircularLayout.html" class="linkConstructor">CircularLayout</a></li> <li><a href="../symbols/ForceDirectedLayout.html" class="linkConstructor">ForceDirectedLayout</a></li> <li><a href="../symbols/GridLayout.html" class="linkConstructor">GridLayout</a></li> <li><a href="../symbols/LayeredDigraphLayout.html" class="linkConstructor">LayeredDigraphLayout</a></li> <li><a href="../symbols/Layout.html" class="linkConstructor">Layout</a></li> <li><a href="../symbols/LayoutNetwork.html" class="linkConstructor">LayoutNetwork</a></li> <li><a href="../symbols/TreeLayout.html" class="linkConstructor">TreeLayout</a></li> </ul> </div> </div> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#ToolNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ToolNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Tool Classes</span> </div> </div> <div id="ToolNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/ActionTool.html" class="linkConstructor">ActionTool</a></li> <li><a href="../symbols/ClickCreatingTool.html" class="linkConstructor">ClickCreatingTool</a></li> <li><a href="../symbols/ClickSelectingTool.html" class="linkConstructor">ClickSelectingTool</a></li> <li><a href="../symbols/ContextMenuTool.html" class="linkConstructor">ContextMenuTool</a></li> <li><a href="../symbols/DraggingTool.html" class="linkConstructor">DraggingTool</a></li> <li><a href="../symbols/DragSelectingTool.html" class="linkConstructor">DragSelectingTool</a></li> <li><a href="../symbols/HTMLInfo.html" class="linkConstructor">HTMLInfo</a></li> <li><a href="../symbols/LinkingBaseTool.html" class="linkConstructor">LinkingBaseTool</a></li> <li><a href="../symbols/LinkingTool.html" class="linkConstructor">LinkingTool</a></li> <li><a href="../symbols/LinkReshapingTool.html" class="linkConstructor">LinkReshapingTool</a></li> <li><a href="../symbols/PanningTool.html" class="linkConstructor">PanningTool</a></li> <li><a href="../symbols/RelinkingTool.html" class="linkConstructor">RelinkingTool</a></li> <li><a href="../symbols/ResizingTool.html" class="linkConstructor">ResizingTool</a></li> <li><a href="../symbols/RotatingTool.html" class="linkConstructor">RotatingTool</a></li> <li><a href="../symbols/TextEditingTool.html" class="linkConstructor">TextEditingTool</a></li> <li><a href="../symbols/Tool.html" class="linkConstructor">Tool</a></li> <li><a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a></li> </ul> </div> </div> <div class="navbar navbar-default" role="navigation"> <div class="navbar-header"> <div class="navheader-container"> <div class="navheader-collapse" data-toggle="collapse" data-target="#CollectionNavbar"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#CollectionNavbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <span class="navbar-brand">Collection Classes</span> </div> </div> <div id="CollectionNavbar" class="navbar-collapse collapse sidebar-navbar-collapse"> <ul class="classList nav navbar-nav"> <li><a href="../symbols/Iterable.html" class="linkConstructor">Iterable</a></li> <li><a href="../symbols/Iterator.html" class="linkConstructor">Iterator</a></li> <li><a href="../symbols/List.html" class="linkConstructor">List</a></li> <li><a href="../symbols/Map.html" class="linkConstructor">Map</a></li> <li><a href="../symbols/Set.html" class="linkConstructor">Set</a></li> </ul> </div> </div> </div> <!-- /class="sidebar-nav --> <!-- end publish.classesIndex --> </div> <div id="contentBody" class="col-md-10"> <div class="searchsumm"> <div class="table-wrap"> <div class="table-cell" id="apisearch" data-base="../"> <div class="title">Search API</div> <div class="field"> <label for="search-field" class="search-icon"></label> <input id="search-field" type="text" /> </div> <ul class="results"> <li class="state loading">Preparing search index...</li> <li class="state failure">The search index is not available</li> </ul> </div> <div class="table-cell" id="apisumm"> <input type="checkbox" id="showsumms" /> <label class="apisumms" for="showsumms">Show Summaries</label> </div> </div> </div> <!-- ============================== header ================================= --> <div id="header" class="fineprint"> <b>GoJS</b>&reg; Diagramming Components<br/>version 1.8.36 for JavaScript/HTML<br/>by <a href="https://www.nwoods.com/">Northwoods Software&reg;</a> </div> <!-- ============================== class title ============================ --> <h2 class="classTitle"> Class Tool </h2> <!-- ============================== class summary ========================== --> <p class="classsummary"> Tools handle mouse, keyboard, and touch events. The currently running tool, <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a>, receives all input events from the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> via canonicalized <a href="../symbols/InputEvent.html" class="linkConstructor">InputEvent</a>s. <p class="boxrun"> For more discussion, see <a href="../../intro/tools.html">Introduction to Tools</a>. See samples that make use of tools in the <a href="../../samples/index.html#tools">samples index</a>. <p> Most tools are "mode-less" tools that are managed by the <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a>, which chooses the current tool based on the kind and position of the mouse event and the parts in the diagram. The <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a> has properties holding instances of most of the pre-defined <a href="../symbols/Tool.html" class="linkConstructor">Tool</a> classes. These classes include: <ul> <li>In the <a href="../symbols/ToolManager.html#mouseDownTools" class="linkProperty">ToolManager.mouseDownTools</a> <a href="../symbols/List.html" class="linkConstructor">List</a>: <ul> <li><a href="../symbols/ActionTool.html" class="linkConstructor">ActionTool</a></li> <li><a href="../symbols/RelinkingTool.html" class="linkConstructor">RelinkingTool</a></li> <li><a href="../symbols/LinkReshapingTool.html" class="linkConstructor">LinkReshapingTool</a></li> <li><a href="../symbols/ResizingTool.html" class="linkConstructor">ResizingTool</a></li> <li><a href="../symbols/RotatingTool.html" class="linkConstructor">RotatingTool</a></li> </ul> </li> <li>In the <a href="../symbols/ToolManager.html#mouseMoveTools" class="linkProperty">ToolManager.mouseMoveTools</a> <a href="../symbols/List.html" class="linkConstructor">List</a>: <ul> <li><a href="../symbols/LinkingTool.html" class="linkConstructor">LinkingTool</a></li> <li><a href="../symbols/DraggingTool.html" class="linkConstructor">DraggingTool</a></li> <li><a href="../symbols/DragSelectingTool.html" class="linkConstructor">DragSelectingTool</a></li> <li><a href="../symbols/PanningTool.html" class="linkConstructor">PanningTool</a></li> </ul> </li> <li>In the <a href="../symbols/ToolManager.html#mouseUpTools" class="linkProperty">ToolManager.mouseUpTools</a> <a href="../symbols/List.html" class="linkConstructor">List</a>: <ul> <li><a href="../symbols/ContextMenuTool.html" class="linkConstructor">ContextMenuTool</a></li> <li><a href="../symbols/TextEditingTool.html" class="linkConstructor">TextEditingTool</a></li> <li><a href="../symbols/ClickCreatingTool.html" class="linkConstructor">ClickCreatingTool</a></li> <li><a href="../symbols/ClickSelectingTool.html" class="linkConstructor">ClickSelectingTool</a></li> </ul> </li> </ul> The ToolManager chooses a tool to run as the diagram's current tool by finding in its lists of tools the first tool whose <a href="../symbols/Tool.html#canStart" class="linkMethod">canStart</a> method returns true. The ToolManager then sets <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> to be that tool. <p> A tool is in the "running" state when it is the value of <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a>. The <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> property setter will call <a href="../symbols/Tool.html#doStop" class="linkMethod">doStop</a> on the old tool and then call <a href="../symbols/Tool.html#doStart" class="linkMethod">doStart</a> on the new tool. <p> A tool can then go into the "active" state once it decides it can actually do something. This happens with a call to <a href="../symbols/Tool.html#doActivate" class="linkMethod">doActivate</a>, normally called by the ToolManager. Later it is deactivated (<a href="../symbols/Tool.html#doDeactivate" class="linkMethod">doDeactivate</a>) and then stopped. <a href="../symbols/Tool.html#isActive" class="linkProperty">isActive</a> should be true when the tool is "active". Often tools should ignore certain common events, such as calls to <a href="../symbols/Tool.html#doMouseMove" class="linkMethod">doMouseMove</a>, unless the tool <a href="../symbols/Tool.html#isActive" class="linkProperty">isActive</a>. <p> You can prevent a "mode-less" tool (i.e. one managed by the <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a>) from being started by the ToolManager by setting <a href="../symbols/Tool.html#isEnabled" class="linkProperty">isEnabled</a> to false. <p> You can also go into a particular "mode" by setting <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> explicitly, thereby circumventing the normal operation of the <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a>. This ignores the <a href="../symbols/Tool.html#isEnabled" class="linkProperty">isEnabled</a> property and does not call the <a href="../symbols/Tool.html#canStart" class="linkMethod">canStart</a> predicate. The behavior will depend on the tool -- not all of the predefined tools support operating as a "modal" tool. <p> Tools cannot be shared amongst multiple Diagrams. <p> If you define a Tool subclass, you may override any of the methods whose names start with "do" and any other methods that are documented to be overridable, such as <a href="../symbols/Tool.html#canStart" class="linkMethod">canStart</a>. However you must seriously consider calling the base method in order to gets its default behavior. There may be situations where not calling the base method may cause subtle bugs. But that depends on the method and the tool. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call the base method. </p> <!-- ============================== constructor summary ==================== --> <h2 id="constructor" class="summaryCaption"> Constructor <span class="nodetails"> Summary</span><span class="details"> Details</span></h2> <div class="table-responsive"> <table class="summaryTable table table-bordered table-condensed" summary="A summary of the constructor documented in the class Tool."> <thead> <tr> <th scope="col" class="name">Name</th> <th scope="col" class="description">Description</th> </tr> </thead> <tbody> <tr> <td class="name" > <div class="name"> Tool() </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>Don't construct this directly -- this is an abstract class. </div> </td> </tr> </tbody> </table> </div><!-- class="table-responsive">--> <!-- ============================== properties summary ===================== --> <h2 class="summaryCaption">Properties<span class="nodetails"> Summary</span><span class="details"> Details</span></h2> <div class="table-responsive"> <table class="summaryTable table table-bordered table-condensed" summary="A summary of the properties documented in the class Tool."> <thead> <tr> <th scope="col" class="name">Name, Value Type</th> <th scope="col" class="description">Description</th> </tr> </thead> <tbody> <tr id="diagram" > <td class="name"> <div class="name"> diagram </div> <div class="attributes"> <span class="light">{<a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a>}</span> </div> </td> <td class="description"> <div class="description"> <!--newp <p> --> <p>This read-only property returns the <a href="../symbols/Diagram.html" class="linkConstructor">Diagram</a> that owns this tool and for which this tool is handling input events. </div> </td> </tr> <tr id="isActive" > <td class="name"> <div class="name"> isActive </div> <div class="attributes"> <span class="light">{boolean}</span> </div> </td> <td class="description"> <div class="description"> <!--newp <p> --> <p>Gets or sets whether this tool is started and is actively doing something.<span class="nodetails" id="xpropisActive"><a class="morelink" onclick="hst('propisActive')">More...</a></span> <span class="details" id="propisActive"> </span><div class="details" id="dpropisActive"><p> You can set this to true after your tool is started (i.e. when it is the <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> and <a href="../symbols/Tool.html#doStart" class="linkMethod">doStart</a> had been called), but when it is not yet in a state that it is actually "doing" something, because it is waiting for the right circumstances. This is typically only important when the tool is used in a modal fashion. <p> The default value is false. This is normally set by <a href="../symbols/Tool.html#doActivate" class="linkMethod">doActivate</a> and <a href="../symbols/Tool.html#doDeactivate" class="linkMethod">doDeactivate</a>.</div> </div> </td> </tr> <tr id="isEnabled" > <td class="name"> <div class="name"> isEnabled </div> <div class="attributes"> <span class="light">{boolean}</span> </div> </td> <td class="description"> <div class="description"> <!--newp <p> --> <p>Gets or sets whether this tool can be started by a mouse event.<span class="nodetails" id="xpropisEnabled"><a class="morelink" onclick="hst('propisEnabled')">More...</a></span> <span class="details" id="propisEnabled"> </span><div class="details" id="dpropisEnabled"><p> Set this to false to prevent <a href="../symbols/Tool.html#canStart" class="linkMethod">canStart</a> from returning true. Setting this property to false should prevent this tool from being used in a mode-less fashion by the <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a> with a mouse down/move/up event. However, even when this property is false, this tool can still be used in a modal fashion: it can still be started by explicitly setting the <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> property to this tool. <p> The default value is true.</div> </div> </td> </tr> <tr id="name" > <td class="name"> <div class="name"> name </div> <div class="attributes"> <span class="light">{string}</span> </div> </td> <td class="description"> <div class="description"> <!--newp <p> --> <p>Gets or sets the name of this tool.<span class="nodetails" id="xpropname"><a class="morelink" onclick="hst('propname')">More...</a></span> <span class="details" id="propname"> The default name is an empty string, but the constructor for each instance of a subclass of Tool will initialize it appropriately. For example, the name of the <a href="../symbols/DragSelectingTool.html" class="linkConstructor">DragSelectingTool</a> is "DragSelecting". </span><div class="details" id="dpropname"><p> This name is sometimes used by tools that use <a href="../symbols/Adornment.html" class="linkConstructor">Adornment</a>s as the <a href="../symbols/Part.html#category" class="linkProperty">Part.category</a> for their Adornments. It is also sometimes used by tools that conduct transactions as the transaction name.</div> </div> </td> </tr> <tr id="transactionResult" > <td class="name"> <div class="name"> transactionResult </div> <div class="attributes"> <span class="light">{string|null}</span> </div> </td> <td class="description"> <div class="description"> <!--newp <p> --> <p>Gets or sets the name of the transaction to be committed by <a href="../symbols/Tool.html#stopTransaction" class="linkMethod">stopTransaction</a>; if null, the transaction will be rolled back.<span class="nodetails" id="xproptransactionResult"><a class="morelink" onclick="hst('proptransactionResult')">More...</a></span> <span class="details" id="proptransactionResult"> </span><div class="details" id="dproptransactionResult"><p> If this is non-null at the time of a call to <a href="../symbols/Tool.html#stopTransaction" class="linkMethod">stopTransaction</a>, it calls <a href="../symbols/Diagram.html#commitTransaction" class="linkMethod">Diagram.commitTransaction</a> with this transaction name; if this is null at that time, it calls <a href="../symbols/Diagram.html#rollbackTransaction" class="linkMethod">Diagram.rollbackTransaction</a>. <p> The default value is null; <a href="../symbols/Tool.html#startTransaction" class="linkMethod">startTransaction</a> will also set this to null. Because a value of null when <a href="../symbols/Tool.html#stopTransaction" class="linkMethod">stopTransaction</a> is called will rollback the transaction, it is important that your code sets this property to a non-null value when it thinks it has succeeded. <p> This property exists so that no matter what execution path occurs to end the usage of a tool, any ongoing transaction can be properly committed or rolled-back.</div> </div> </td> </tr> </tbody> </table> </div><!-- class="table-responsive">--> <!-- ============================== methods summary ======================== --> <h2 class="summaryCaption">Method <span class="nodetails"> Summary</span><span class="details"> Details</span></h2> <div class="table-responsive"> <table class="summaryTable table table-bordered table-condensed" summary="A summary of the methods documented in the class Tool."> <thead> <tr> <th scope="col" class="name">Name, Return Type</th> <th scope="col" class="description">Description</th> </tr> </thead> <tbody> <tr id="cancelWaitAfter"> <td class="name"> <div class="name"> cancelWaitAfter() </div> <div class="attributes"> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>This is called to cancel any running "WaitAfter" timer.<span class="nodetails" id="xmethcancelWaitAfter"><a class="morelink" onclick="hst('methcancelWaitAfter')">More...</a></span> <span class="details" id="methcancelWaitAfter"> </span><div class="details" id="dmethcancelWaitAfter"><p> This is called when a tool is stopped. <p> This method is rarely overridden. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</div> </div> </td> </tr> <tr id="canStart"> <td class="name"> <div class="name"> canStart() </div> <div class="attributes"> <span class="light">{boolean}</span> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>This predicate is used by the <a href="../symbols/ToolManager.html" class="linkConstructor">ToolManager</a> to decide if this tool can be started mode-lessly by mouse and touch events.<span class="nodetails" id="xmethcanStart"><a class="morelink" onclick="hst('methcanStart')">More...</a></span> <span class="details" id="methcanStart"> Implementations of this method can look at <a href="../symbols/Diagram.html#lastInput" class="linkProperty">Diagram.lastInput</a> to get the mouse event and input state. </span><div class="details" id="dmethcanStart"><p> By default this method returns <a href="../symbols/Tool.html#isEnabled" class="linkProperty">isEnabled</a>. This method may be overridden. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</div> <dl class="detailList"> <dt class="heading">Returns:</dt> <dt><span class="light fixedFont">{boolean}</span> true if <a href="../symbols/Tool.html#isEnabled" class="linkProperty">isEnabled</a> is true and if the <a href="../symbols/Diagram.html#toolManager" class="linkProperty">Diagram.toolManager</a> can make this tool the <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> and then call the <a href="../symbols/Tool.html#doStart" class="linkMethod">doStart</a> method.</dt> </dl> </div> </td> </tr> <tr id="canStartMultiTouch"> <td class="name"> <div class="name"> canStartMultiTouch() </div> <div class="attributes"> <span class="light">{boolean}</span> <span class="since" title="since">1.5</span> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>Called by <a href="../symbols/ToolManager.html#doMouseDown" class="linkMethod">ToolManager.doMouseDown</a> and <a href="../symbols/ToolManager.html#doMouseMove" class="linkMethod">ToolManager.doMouseMove</a>, this method determines whether or not to allow pinch zooming from a multi-touch event.<span class="nodetails" id="xmethcanStartMultiTouch"><a class="morelink" onclick="hst('methcanStartMultiTouch')">More...</a></span> <span class="details" id="methcanStartMultiTouch"> By default this predicate just returns true. This method may be overridden. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</span> </p><div class="seealso">See also: <ul class="seealsolist"> <li><a href="../symbols/Tool.html#standardPinchZoomStart" class="linkMethod">standardPinchZoomStart</a></li> <li><a href="../symbols/Tool.html#standardPinchZoomMove" class="linkMethod">standardPinchZoomMove</a></li> </ul></div> <dl class="detailList"> <dt class="heading">Returns:</dt> <dt><span class="light fixedFont">{boolean}</span> </dt> </dl> </div> </td> </tr> <tr id="doActivate"> <td class="name"> <div class="name"> doActivate() </div> <div class="attributes"> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>The Diagram calls this method after setting <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a>, to make the new tool active.<span class="nodetails" id="xmethdoActivate"><a class="morelink" onclick="hst('methdoActivate')">More...</a></span> <span class="details" id="methdoActivate"> This should set <a href="../symbols/Tool.html#isActive" class="linkProperty">isActive</a> to true. Overrides of this method might call <a href="../symbols/Tool.html#startTransaction" class="linkMethod">startTransaction</a>, if this tool's activity involves modification of the model. Implementations of this method can look at <a href="../symbols/Diagram.html#lastInput" class="linkProperty">Diagram.lastInput</a> to get the mouse event and input state. </span><div class="details" id="dmethdoActivate"><p> You should call this method only after setting <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> to the Tool that you want to activate. <p> By default this only sets <a href="../symbols/Tool.html#isActive" class="linkProperty">isActive</a> to true. This method may be overridden. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</div> </div> </td> </tr> <tr id="doCancel"> <td class="name"> <div class="name"> doCancel() </div> <div class="attributes"> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>The diagram will call this method when the user wishes to cancel the current tool's operation.<span class="nodetails" id="xmethdoCancel"><a class="morelink" onclick="hst('methdoCancel')">More...</a></span> <span class="details" id="methdoCancel"> Typically this is called when the user hits the ESCAPE key. This should restore the original state of what was modified by this tool, and then it should call <a href="../symbols/Tool.html#stopTool" class="linkMethod">stopTool</a>. This method is not responsible for cleaning up any side-effects that should be performed by <a href="../symbols/Tool.html#doDeactivate" class="linkMethod">doDeactivate</a> and/or <a href="../symbols/Tool.html#doStop" class="linkMethod">doStop</a>, which will always be called whether the tool stops normally or abnormally. </span><div class="details" id="dmethdoCancel"><p> By default this method just calls <a href="../symbols/Tool.html#stopTool" class="linkMethod">stopTool</a>. You will want to override this method even in tools that call <a href="../symbols/Tool.html#startTransaction" class="linkMethod">startTransaction</a> and <a href="../symbols/Tool.html#stopTransaction" class="linkMethod">stopTransaction</a>, because the <a href="../symbols/UndoManager.html" class="linkConstructor">UndoManager</a> might not be enabled. This method may be overridden. Please read the Introduction page on <a href="../../intro/extensions.html">Extensions</a> for how to override methods and how to call this base method.</div> </div> </td> </tr> <tr id="doDeactivate"> <td class="name"> <div class="name"> doDeactivate() </div> <div class="attributes"> </div> </td> <td class="description"> <div class="description"> <!--newp--><p><p>The Diagram calls this method on the old tool when <a href="../symbols/Diagram.html#currentTool" class="linkProperty">Diagram.currentTool</a> is set to a new tool.<span class="nodetails" id="xmethdoDeactivate"><a class="morelink" onclick="hst('methdoDeactivate')">More...</a></span> <span class="details" id="methdoDeactivate"> This needs to set <a href="../symbols/Tool.html#isActive" class="linkProperty">is