Allow shift or option key to control grid snapping

GoJS
1

In the Guided dragging tool the shift key is used to determine whether to snap to the guideline or not:

GuidedDraggingTool.prototype.doDropOnto = function(/*pt, obj */) {
…

// snaps only when the mouse is released without shift modifier
var e = this.diagram.lastInput;
var snap = this.isGuidelineSnapEnabled && !e.shift;
this.showHorizontalMatches(part, this.isGuidelineEnabled, snap);
this.showVerticalMatches(part, this.isGuidelineEnabled, snap);
}

I’d like to add this same feature to control (e.g. disable or toggle) the normal snapping that’s available when dragging and resizing (i.e. when draggingTool.isGridEnabled == true).

Is this possible? Is the dragging tool code available for modification?

Thank you

2

You could override computeMove to temporarily set the value of isGridSnapEnabled

Something like:

myDiagram.toolManager.draggingTool.computeMove = function(n, newloc, draggedparts, result) {
  var e = this.diagram.lastInput;
  var oldsnap = this.isGridSnapEnabled;
  if (e.shift) this.isGridSnapEnabled = e.shift;
  // call default functionality
  go.DraggingTool.prototype.computeMove.call(this, n, newloc, draggedparts, result);
  this.isGridSnapEnabled = oldsnap; // maybe restore the value?
}

I wrote that by hand so there may be typos

3

You did forget to return the Point returned by the base method.

    myDiagram.toolManager.draggingTool.computeMove = function(n, newloc, draggedparts, result) {
      var e = this.diagram.lastInput;
      var oldsnap = this.isGridSnapEnabled;
      if (e.shift) this.isGridSnapEnabled = false;
      // call default functionality
      var result = go.DraggingTool.prototype.computeMove.call(this, n, newloc, draggedparts, result);
      this.isGridSnapEnabled = oldsnap; // restore the original value
      return result;
    }

Now when DraggingTool.isGridSnapEnabled is true, the behavior is the same as before. But when holding down the Shift key, grid snapping is disabled. That’s true for copying as well as moving.

4

I’ve used above code to achieve something similar, but without luck so far.
I’d like to turn on grid snapping on alt key, but when user does resizing of a part.
Code simply does not work, but I see that breakpoints are hit and isGridSnapEnabled is set to right value.

I did minor changes to code: computeMove to computeResize etc. Please find it below.

CustomResizeTool.prototype.computeResize = function () {
  var e = this.diagram.lastInput;
  var oldSnap = this.isGridSnapEnabled;
  var result;
  if (e.alt)
    this.isGridSnapEnabled = e.alt;

  result = go.ResizingTool.prototype.computeResize.apply(this, arguments);
  this.isGridSnapEnabled = oldSnap;
  return result;
};

I’ve made other test and I did a code which sets isGridSnapEnabled before ResizingTool is activated. In this scenario everything works fine.
Steps:

  1. I hit alt key
  2. I do resize
  3. Snap works fine

But when I release alt key while doing resize it does not work correctly too.

Steps:

  1. I hit alt key
  2. I do resize
  3. I release alt key
  4. Snap is enabled, but should be disabled
5

This requires some investigation. I’ll look into it later this morning.

6

Yes, it’s true that it only ResizingTool.computeCellSize checks ResizingTool.isGridSnapEnabled, and that it only calls that method when the tool is activated.

But you have the right idea for doing it continually: overriding ResizingTool.computeResize. What you need to do is pass the desired Size as the cell size in the call to the super method.

    function CustomResizingTool() {
      go.ResizingTool.call(this);
    }
    go.Diagram.inherit(CustomResizingTool, go.ResizingTool);

    CustomResizingTool.prototype.computeResize = function(newPoint, spot, min, max, cell, reshape) {
      if (this.diagram.lastInput.control) cell = this.diagram.grid.gridCellSize;
      return go.ResizingTool.prototype.computeResize.call(this, newPoint, spot, min, max, cell, reshape);
    };

My code uses InputEvent.control instead of InputEvent.shift because the Shift modifier is already used to limit changing the aspect ratio.