feat: scroll moving block into view (#451)

* feat: scroll moving block into view

* chore: tweak doc and format mover.ts

* feat: add padding param (def to 0) for mover scroll into view

* fix: correct default padding to 10 for move scroll to view

* fix: bypass get cur block when move scroll into view

The issue is that scrollBoundsIntoView in scrollCurrentBlockIntoView is not taking effect because it has already been called via getCurrentBlock (which eventually calls scrollBoundsIntoView in the call stack). To bypass getCurrentBlock, a new class variable for current block is set and reset for a move.

* feat: set constrained move block spacing to 100

* Revert "feat: set constrained move block spacing to 100"

This reverts commit 420c224.

* Revert "fix: bypass get cur block when move scroll into view"

This reverts commit 9657acd.

Author: microbit-grace

src/actions/mover.ts

@@ -145,6 +145,8 @@ export class Mover {
     this.unpatchWorkspace(workspace);
     this.unpatchDragStrategy(info.block);
     this.moves.delete(workspace);
+    // Delay scroll until after block has finished moving.
+    setTimeout(() => this.scrollCurrentBlockIntoView(workspace), 0);
     return true;
   }
 
@@ -176,6 +178,8 @@ export class Mover {
     this.unpatchWorkspace(workspace);
     this.unpatchDragStrategy(info.block);
     this.moves.delete(workspace);
+    // Delay scroll until after block has finished moving.
+    setTimeout(() => this.scrollCurrentBlockIntoView(workspace), 0);
     return true;
   }
 
@@ -198,6 +202,7 @@ export class Mover {
     );
 
     info.updateTotalDelta();
+    this.scrollCurrentBlockIntoView(workspace);
     return true;
   }
 
@@ -219,6 +224,7 @@ export class Mover {
     info.totalDelta.y += y * UNCONSTRAINED_MOVE_DISTANCE * workspace.scale;
 
     info.dragger.onDrag(info.fakePointerEvent('pointermove'), info.totalDelta);
+    this.scrollCurrentBlockIntoView(workspace);
     return true;
   }
 
@@ -308,6 +314,23 @@ export class Mover {
       this.oldDragStrategy = null;
     }
   }
+
+  /**
+   * Scrolls the current block into view if one exists.
+   *
+   * @param workspace The workspace to get current block from.
+   * @param padding Amount of spacing to put between the bounds and the edge of
+   *     the workspace's viewport.
+   */
+  private scrollCurrentBlockIntoView(workspace: WorkspaceSvg, padding = 10) {
+    const blockToView = this.getCurrentBlock(workspace);
+    if (blockToView) {
+      workspace.scrollBoundsIntoView(
+        blockToView.getBoundingRectangleWithoutChildren(),
+        padding,
+      );
+    }
+  }
 }
 
 /**