Adding keyboard accessibility to RelinkingTool

GoJS
1

I’m spiking adding some keyboard accessibility to our implementation of the GoJS canvas. So far I’ve no issues with the CommandHandler. I’ve moved on to the RelinkingTool now, and this is giving me some issues. Everything I look at backend seems to be as I expect, but nothing changes on the diagram.

I’ve extended RelinkingTool into a subclass which currently adds a targetNode property (to cater for navigating between nodes, but not implemented yet) and overrides doKeyDown(), with a call to the super.doKeyDown() at its end.
I trigger the RelinkingTool from the Command Handler (assuming from node to simplify and remove conditional stuff):

				relinkTool.originalLink = this.selectedLink;
				relinkTool.isForwards = false;
				diagram.currentTool = relinkTool;
				relinkTool.doActivate();
				relinkTool.targetNode = relinkTool.originalFromNode;
				relinkTool.targetPort = relinkTool.originalFromPort;
				return;

Then within KeyboardRelinkingTool.doKeyDown:
Select the port using its count:

        ports = new go.List(this.targetNode.ports.filter(port => port.fromLinkable));
        let index = null;
        switch (input.key) {
            case '1':
                index = 0;
                break;
            // etc.
        }
        if (index !== null && index < ports.size) {
            this.targetPort = ports.get(index);
            // Not sure if this necessary but nothing happens either way,
            this.portTargeted(this.targetNode,
                                  this.targetPort,
                                  this.temporaryFromNode,
                                  this.temporaryFromPort,
                                  this.isForwards);
            }
            return;

When I log the port list and the selectred port, all seems as expected. When I log the result of isValidLink after portTargeted() I get what I expect (ie: true unless the targetPort is the same as the originialFromPort).
To confirm the change:

            const disconnectedPort :go.GraphObject = this. originalFromPort;
            const result :boolean = this.reconnectLink(this.originalLink,
                               this.targetNode,
                               this.targetPort,
                               this.isForwards);
            console.log("RECONNECTED: " + result);  // Always true
            diagram.raiseDiagramEvent('LinkRelinked',
                                      this.originalLink,
                                      disconnectedPort);
            this.doDeactivate();
            diagram.currentTool = diagram.defaultTool;
            return;

However, despite getting a true from reconnectLink() nothing changes in the diagram and the link remains unlatered for subsequent attempts. With the mouse everything works as expected still.
What am I missing or doing wrong?

Nicholas

2

I suspect you want to completely finish setting up the RelinkingTool before activating it.

You need to set the Tool.transactionResult property to a non-null value so that the transaction is not rolled-back. Set it just before raising the “LinkRelinked” DiagramEvent.

Call Tool.stopTool to finish the tool’s operation, instead of calling doDeactivate and resetting the Diagram.currentTool. (doDeactivate will be called automatically, if needed, during the change of current tool.)

3

Thanks. I didn’t get back to it today and am on vacation next week, so I’ll try these suggestions when I get back.

4

That got the relinking working successfully. I did have to set the initial targets after calling doActivate(), however, as they wound up reset otherwise.

I’m not getting intermediate temporary links drawn currently, which would be nice and match our current mouse behaviour.