1 | /*
|
2 | * Copyright (C) 1998-2021 by Northwoods Software Corporation. All Rights Reserved.
|
3 | */
|
4 | /*
|
5 | * This is an extension and not part of the main GoJS library.
|
6 | * Note that the API for this class may change with any version, even point releases.
|
7 | * If you intend to use an extension in production, you should copy the code to your own source directory.
|
8 | * Extensions can be found in the GoJS kit under the extensions or extensionsTS folders.
|
9 | * See the Extensions intro page (https://gojs.net/latest/intro/extensions.html) for more information.
|
10 | */
|
11 | import * as go from '../release/go-module.js';
|
12 | /**
|
13 | * The NodeLabelDraggingTool class lets the user move a label on a Node.
|
14 | *
|
15 | * This tool only works when the Node has a label (any GraphObject) marked with
|
16 | * { _isNodeLabel: true } that is positioned in a Spot Panel.
|
17 | * It works by modifying that label's {@link GraphObject#alignment} property to have an
|
18 | * offset from the center of the panel.
|
19 | *
|
20 | * If you want to experiment with this extension, try the <a href="../../extensionsJSM/NodeLabelDragging.html">Node Label Dragging</a> sample.
|
21 | * @category Tool Extension
|
22 | */
|
23 | export class NodeLabelDraggingTool extends go.Tool {
|
24 | /**
|
25 | * Constructs a NodeLabelDraggingTool and sets the name for the tool.
|
26 | */
|
27 | constructor() {
|
28 | super();
|
29 | /**
|
30 | * The label being dragged.
|
31 | */
|
32 | this.label = null;
|
33 | this._offset = new go.Point(); // of the mouse relative to the center of the label object
|
34 | this._originalAlignment = go.Spot.Default;
|
35 | this._originalCenter = new go.Point();
|
36 | this.name = 'NodeLabelDragging';
|
37 | }
|
38 | /**
|
39 | * From the GraphObject at the mouse point, search up the visual tree until we get to
|
40 | * an object that has the "_isNodeLabel" property set to true, that is in a Spot Panel,
|
41 | * and that is not the first element of that Panel (i.e. not the main element of the panel).
|
42 | * @return {GraphObject} This returns null if no such label is at the mouse down point.
|
43 | */
|
44 | findLabel() {
|
45 | const diagram = this.diagram;
|
46 | const e = diagram.firstInput;
|
47 | let elt = diagram.findObjectAt(e.documentPoint, null, null);
|
48 | if (elt === null || !(elt.part instanceof go.Node))
|
49 | return null;
|
50 | while (elt.panel !== null) {
|
51 | if (elt['_isNodeLabel'] && elt.panel.type === go.Panel.Spot && elt.panel.findMainElement() !== elt)
|
52 | return elt;
|
53 | elt = elt.panel;
|
54 | }
|
55 | return null;
|
56 | }
|
57 | /**
|
58 | * This tool can only start if the mouse has moved enough so that it is not a click,
|
59 | * and if the mouse down point is on a GraphObject "label" in a Spot Panel,
|
60 | * as determined by findLabel().
|
61 | */
|
62 | canStart() {
|
63 | if (!super.canStart())
|
64 | return false;
|
65 | const diagram = this.diagram;
|
66 | // require left button & that it has moved far enough away from the mouse down point, so it isn't a click
|
67 | const e = diagram.lastInput;
|
68 | if (!e.left)
|
69 | return false;
|
70 | if (!this.isBeyondDragSize())
|
71 | return false;
|
72 | return this.findLabel() !== null;
|
73 | }
|
74 | /**
|
75 | * Start a transaction, call {@link findLabel} and remember it as the "label" property,
|
76 | * and remember the original value for the label's {@link GraphObject#alignment} property.
|
77 | */
|
78 | doActivate() {
|
79 | this.startTransaction('Shifted Label');
|
80 | this.label = this.findLabel();
|
81 | if (this.label !== null) {
|
82 | // compute the offset of the mouse-down point relative to the center of the label
|
83 | this._offset = this.diagram.firstInput.documentPoint.copy().subtract(this.label.getDocumentPoint(go.Spot.Center));
|
84 | this._originalAlignment = this.label.alignment.copy();
|
85 | const panel = this.label.panel;
|
86 | if (panel !== null) {
|
87 | const main = panel.findMainElement();
|
88 | if (main !== null)
|
89 | this._originalCenter = main.getDocumentPoint(go.Spot.Center);
|
90 | }
|
91 | }
|
92 | super.doActivate();
|
93 | }
|
94 | /**
|
95 | * Stop any ongoing transaction.
|
96 | */
|
97 | doDeactivate() {
|
98 | super.doDeactivate();
|
99 | this.stopTransaction();
|
100 | }
|
101 | /**
|
102 | * Clear any reference to a label element.
|
103 | */
|
104 | doStop() {
|
105 | this.label = null;
|
106 | super.doStop();
|
107 | }
|
108 | /**
|
109 | * Restore the label's original value for GraphObject.alignment.
|
110 | */
|
111 | doCancel() {
|
112 | if (this.label !== null) {
|
113 | this.label.alignment = this._originalAlignment;
|
114 | }
|
115 | super.doCancel();
|
116 | }
|
117 | /**
|
118 | * During the drag, call updateAlignment in order to set the {@link GraphObject#alignment} of the label.
|
119 | */
|
120 | doMouseMove() {
|
121 | if (!this.isActive)
|
122 | return;
|
123 | this.updateAlignment();
|
124 | }
|
125 | /**
|
126 | * At the end of the drag, update the alignment of the label and finish the tool,
|
127 | * completing a transaction.
|
128 | */
|
129 | doMouseUp() {
|
130 | if (!this.isActive)
|
131 | return;
|
132 | this.updateAlignment();
|
133 | this.transactionResult = 'Shifted Label';
|
134 | this.stopTool();
|
135 | }
|
136 | /**
|
137 | * Save the label's {@link GraphObject#alignment} as an absolute offset from the center of the Spot Panel
|
138 | * that the label is in.
|
139 | */
|
140 | updateAlignment() {
|
141 | if (this.label === null)
|
142 | return;
|
143 | const last = this.diagram.lastInput.documentPoint;
|
144 | const cntr = this._originalCenter;
|
145 | this.label.alignment = new go.Spot(0.5, 0.5, last.x - this._offset.x - cntr.x, last.y - this._offset.y - cntr.y);
|
146 | }
|
147 | }
|