blockly 8.0.5 → 9.0.0-beta.0

package/core/{block_dragger.js → block_dragger.ts}

@@ -7,91 +7,70 @@
 /**
  * @fileoverview Methods for dragging a block visually.
  */
-'use strict';
 
 /**
  * Methods for dragging a block visually.
  * @class
  */
-goog.module('Blockly.BlockDragger');
-
-const blockAnimation = goog.require('Blockly.blockAnimations');
-const bumpObjects = goog.require('Blockly.bumpObjects');
-const common = goog.require('Blockly.common');
-const dom = goog.require('Blockly.utils.dom');
-const eventUtils = goog.require('Blockly.Events.utils');
-const registry = goog.require('Blockly.registry');
-/* eslint-disable-next-line no-unused-vars */
-const {BlockMove} = goog.requireType('Blockly.Events.BlockMove');
-/* eslint-disable-next-line no-unused-vars */
-const {BlockSvg} = goog.requireType('Blockly.BlockSvg');
-const {Coordinate} = goog.require('Blockly.utils.Coordinate');
-/* eslint-disable-next-line no-unused-vars */
-const {IBlockDragger} = goog.require('Blockly.IBlockDragger');
-/* eslint-disable-next-line no-unused-vars */
-const {IDragTarget} = goog.requireType('Blockly.IDragTarget');
-const {InsertionMarkerManager} = goog.require('Blockly.InsertionMarkerManager');
-/* eslint-disable-next-line no-unused-vars */
-const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
-/** @suppress {extraRequire} */
-goog.require('Blockly.Events.BlockDrag');
-/** @suppress {extraRequire} */
-goog.require('Blockly.Events.BlockMove');
+import * as goog from '../closure/goog/goog.js';
+goog.declareModuleId('Blockly.BlockDragger');
+
+// Unused import preserved for side-effects. Remove if unneeded.
+import './events/events_block_drag.js';
+
+import * as blockAnimation from './block_animations.js';
+import type {BlockSvg} from './block_svg.js';
+import * as bumpObjects from './bump_objects.js';
+import * as common from './common.js';
+import type {BlockMove} from './events/events_block_move.js';
+import * as eventUtils from './events/utils.js';
+import type {Icon} from './icon.js';
+import {InsertionMarkerManager} from './insertion_marker_manager.js';
+import type {IBlockDragger} from './interfaces/i_block_dragger.js';
+import type {IDragTarget} from './interfaces/i_drag_target.js';
+import * as registry from './registry.js';
+import {Coordinate} from './utils/coordinate.js';
+import * as dom from './utils/dom.js';
+import type {WorkspaceSvg} from './workspace_svg.js';
 
 
 /**
  * Class for a block dragger.  It moves blocks around the workspace when they
  * are being dragged by a mouse or touch.
- * @implements {IBlockDragger}
  * @alias Blockly.BlockDragger
  */
-const BlockDragger = class {
+export class BlockDragger implements IBlockDragger {
+  /** The top block in the stack that is being dragged. */
+  protected draggingBlock_: BlockSvg;
+  protected draggedConnectionManager_: InsertionMarkerManager;
+
+  /** The workspace on which the block is being dragged. */
+  protected workspace_: WorkspaceSvg;
+
+  /** Which drag area the mouse pointer is over, if any. */
+  private dragTarget_: IDragTarget|null = null;
+
+  /** Whether the block would be deleted if dropped immediately. */
+  protected wouldDeleteBlock_ = false;
+  protected startXY_: Coordinate;
+  protected dragIconData_: IconPositionData[];
+
   /**
-   * @param {!BlockSvg} block The block to drag.
-   * @param {!WorkspaceSvg} workspace The workspace to drag on.
+   * @param block The block to drag.
+   * @param workspace The workspace to drag on.
    */
-  constructor(block, workspace) {
-    /**
-     * The top block in the stack that is being dragged.
-     * @type {!BlockSvg}
-     * @protected
-     */
+  constructor(block: BlockSvg, workspace: WorkspaceSvg) {
     this.draggingBlock_ = block;
 
-    /**
-     * The workspace on which the block is being dragged.
-     * @type {!WorkspaceSvg}
-     * @protected
-     */
-    this.workspace_ = workspace;
-
-    /**
-     * Object that keeps track of connections on dragged blocks.
-     * @type {!InsertionMarkerManager}
-     * @protected
-     */
+    /** Object that keeps track of connections on dragged blocks. */
     this.draggedConnectionManager_ =
         new InsertionMarkerManager(this.draggingBlock_);
 
-    /**
-     * Which drag area the mouse pointer is over, if any.
-     * @type {?IDragTarget}
-     * @private
-     */
-    this.dragTarget_ = null;
-
-    /**
-     * Whether the block would be deleted if dropped immediately.
-     * @type {boolean}
-     * @protected
-     */
-    this.wouldDeleteBlock_ = false;
+    this.workspace_ = workspace;
 
     /**
      * The location of the top left corner of the dragging block at the
      * beginning of the drag in workspace coordinates.
-     * @type {!Coordinate}
-     * @protected
      */
     this.startXY_ = this.draggingBlock_.getRelativeToSurfaceXY();
 
@@ -99,15 +78,13 @@ const BlockDragger = class {
      * A list of all of the icons (comment, warning, and mutator) that are
      * on this block and its descendants.  Moving an icon moves the bubble that
      * extends from it if that bubble is open.
-     * @type {Array<!Object>}
-     * @protected
      */
     this.dragIconData_ = initIconData(block);
   }
 
   /**
    * Sever all links from this object.
-   * @package
+   * @internal
    */
   dispose() {
     this.dragIconData_.length = 0;
@@ -119,13 +96,11 @@ const BlockDragger = class {
 
   /**
    * Start dragging a block.  This includes moving it to the drag surface.
-   * @param {!Coordinate} currentDragDeltaXY How far the pointer has
-   *     moved from the position at mouse down, in pixel units.
-   * @param {boolean} healStack Whether or not to heal the stack after
-   *     disconnecting.
-   * @public
+   * @param currentDragDeltaXY How far the pointer has moved from the position
+   *     at mouse down, in pixel units.
+   * @param healStack Whether or not to heal the stack after disconnecting.
    */
-  startDrag(currentDragDeltaXY, healStack) {
+  startDrag(currentDragDeltaXY: Coordinate, healStack: boolean) {
     if (!eventUtils.getGroup()) {
       eventUtils.setGroup(true);
     }
@@ -157,27 +132,24 @@ const BlockDragger = class {
 
   /**
    * Whether or not we should disconnect the block when a drag is started.
-   * @param {boolean} healStack Whether or not to heal the stack after
-   *     disconnecting.
-   * @return {boolean} True to disconnect the block, false otherwise.
-   * @protected
+   * @param healStack Whether or not to heal the stack after disconnecting.
+   * @return True to disconnect the block, false otherwise.
    */
-  shouldDisconnect_(healStack) {
+  protected shouldDisconnect_(healStack: boolean): boolean {
     return !!(
         this.draggingBlock_.getParent() ||
-        (healStack && this.draggingBlock_.nextConnection &&
-         this.draggingBlock_.nextConnection.targetBlock()));
+        healStack && this.draggingBlock_.nextConnection &&
+            this.draggingBlock_.nextConnection.targetBlock());
   }
 
   /**
    * Disconnects the block and moves it to a new location.
-   * @param {boolean} healStack Whether or not to heal the stack after
-   *     disconnecting.
-   * @param {!Coordinate} currentDragDeltaXY How far the pointer has
-   *     moved from the position at mouse down, in pixel units.
-   * @protected
+   * @param healStack Whether or not to heal the stack after disconnecting.
+   * @param currentDragDeltaXY How far the pointer has moved from the position
+   *     at mouse down, in pixel units.
    */
-  disconnectBlock_(healStack, currentDragDeltaXY) {
+  protected disconnectBlock_(
+      healStack: boolean, currentDragDeltaXY: Coordinate) {
     this.draggingBlock_.unplug(healStack);
     const delta = this.pixelsToWorkspaceUnits_(currentDragDeltaXY);
     const newLoc = Coordinate.sum(this.startXY_, delta);
@@ -187,25 +159,21 @@ const BlockDragger = class {
     this.draggedConnectionManager_.updateAvailableConnections();
   }
 
-  /**
-   * Fire a UI event at the start of a block drag.
-   * @protected
-   */
-  fireDragStartEvent_() {
-    const event = new (eventUtils.get(eventUtils.BLOCK_DRAG))(
-        this.draggingBlock_, true, this.draggingBlock_.getDescendants(false));
+  /** Fire a UI event at the start of a block drag. */
+  protected fireDragStartEvent_() {
+    const event = new (eventUtils.get(eventUtils.BLOCK_DRAG))!
+        (this.draggingBlock_, true, this.draggingBlock_.getDescendants(false));
     eventUtils.fire(event);
   }
 
   /**
    * Execute a step of block dragging, based on the given event.  Update the
    * display accordingly.
-   * @param {!Event} e The most recent move event.
-   * @param {!Coordinate} currentDragDeltaXY How far the pointer has
-   *     moved from the position at the start of the drag, in pixel units.
-   * @public
+   * @param e The most recent move event.
+   * @param currentDragDeltaXY How far the pointer has moved from the position
+   *     at the start of the drag, in pixel units.
    */
-  drag(e, currentDragDeltaXY) {
+  drag(e: Event, currentDragDeltaXY: Coordinate) {
     const delta = this.pixelsToWorkspaceUnits_(currentDragDeltaXY);
     const newLoc = Coordinate.sum(this.startXY_, delta);
     this.draggingBlock_.moveDuringDrag(newLoc);
@@ -233,12 +201,11 @@ const BlockDragger = class {
 
   /**
    * Finish a block drag and put the block back on the workspace.
-   * @param {!Event} e The mouseup/touchend event.
-   * @param {!Coordinate} currentDragDeltaXY How far the pointer has
-   *     moved from the position at the start of the drag, in pixel units.
-   * @public
+   * @param e The mouseup/touchend event.
+   * @param currentDragDeltaXY How far the pointer has moved from the position
+   *     at the start of the drag, in pixel units.
    */
-  endDrag(e, currentDragDeltaXY) {
+  endDrag(e: Event, currentDragDeltaXY: Coordinate) {
     // Make sure internal state is fresh.
     this.drag(e, currentDragDeltaXY);
     this.dragIconData_ = [];
@@ -250,10 +217,8 @@ const BlockDragger = class {
 
     const preventMove = !!this.dragTarget_ &&
         this.dragTarget_.shouldPreventMove(this.draggingBlock_);
-    /** @type {Coordinate} */
-    let newLoc;
-    /** @type {Coordinate} */
-    let delta;
+    let newLoc: Coordinate;
+    let delta: Coordinate|null = null;
     if (preventMove) {
       newLoc = this.startXY_;
     } else {
@@ -289,29 +254,28 @@ const BlockDragger = class {
 
   /**
    * Calculates the drag delta and new location values after a block is dragged.
-   * @param {!Coordinate} currentDragDeltaXY How far the pointer has
-   *     moved from the start of the drag, in pixel units.
-   * @return {{delta: !Coordinate, newLocation:
-   *     !Coordinate}} New location after drag. delta is in
-   *     workspace units. newLocation is the new coordinate where the block
-   * should end up.
-   * @protected
+   * @param currentDragDeltaXY How far the pointer has moved from the start of
+   *     the drag, in pixel units.
+   * @return New location after drag. delta is in workspace units. newLocation
+   *     is the new coordinate where the block should end up.
    */
-  getNewLocationAfterDrag_(currentDragDeltaXY) {
-    const newValues = {};
-    newValues.delta = this.pixelsToWorkspaceUnits_(currentDragDeltaXY);
-    newValues.newLocation = Coordinate.sum(this.startXY_, newValues.delta);
-    return newValues;
+  protected getNewLocationAfterDrag_(currentDragDeltaXY: Coordinate):
+      {delta: Coordinate, newLocation: Coordinate} {
+    const delta = this.pixelsToWorkspaceUnits_(currentDragDeltaXY);
+    const newLocation = Coordinate.sum(this.startXY_, delta);
+    return {
+      delta,
+      newLocation,
+    };
   }
 
   /**
    * May delete the dragging block, if allowed. If `this.wouldDeleteBlock_` is
    * not true, the block will not be deleted. This should be called at the end
    * of a block drag.
-   * @return {boolean} True if the block was deleted.
-   * @protected
+   * @return True if the block was deleted.
    */
-  maybeDeleteBlock_() {
+  protected maybeDeleteBlock_(): boolean {
     if (this.wouldDeleteBlock_) {
       // Fire a move event, so we know where to go back to for an undo.
       this.fireMoveEvent_();
@@ -324,11 +288,10 @@ const BlockDragger = class {
 
   /**
    * Updates the necessary information to place a block at a certain location.
-   * @param {!Coordinate} delta The change in location from where
-   *     the block started the drag to where it ended the drag.
-   * @protected
+   * @param delta The change in location from where the block started the drag
+   *     to where it ended the drag.
    */
-  updateBlockAfterMove_(delta) {
+  protected updateBlockAfterMove_(delta: Coordinate) {
     this.draggingBlock_.moveConnections(delta.x, delta.y);
     this.fireMoveEvent_();
     if (this.draggedConnectionManager_.wouldConnectBlock()) {
@@ -340,13 +303,10 @@ const BlockDragger = class {
     this.draggingBlock_.scheduleSnapAndBump();
   }
 
-  /**
-   * Fire a UI event at the end of a block drag.
-   * @protected
-   */
-  fireDragEndEvent_() {
-    const event = new (eventUtils.get(eventUtils.BLOCK_DRAG))(
-        this.draggingBlock_, false, this.draggingBlock_.getDescendants(false));
+  /** Fire a UI event at the end of a block drag. */
+  protected fireDragEndEvent_() {
+    const event = new (eventUtils.get(eventUtils.BLOCK_DRAG))!
+        (this.draggingBlock_, false, this.draggingBlock_.getDescendants(false));
     eventUtils.fire(event);
   }
 
@@ -354,32 +314,38 @@ const BlockDragger = class {
    * Adds or removes the style of the cursor for the toolbox.
    * This is what changes the cursor to display an x when a deletable block is
    * held over the toolbox.
-   * @param {boolean} isEnd True if we are at the end of a drag, false
-   *     otherwise.
-   * @protected
+   * @param isEnd True if we are at the end of a drag, false otherwise.
    */
-  updateToolboxStyle_(isEnd) {
+  protected updateToolboxStyle_(isEnd: boolean) {
     const toolbox = this.workspace_.getToolbox();
 
     if (toolbox) {
       const style = this.draggingBlock_.isDeletable() ? 'blocklyToolboxDelete' :
                                                         'blocklyToolboxGrab';
 
-      if (isEnd && typeof toolbox.removeStyle === 'function') {
-        toolbox.removeStyle(style);
-      } else if (!isEnd && typeof toolbox.addStyle === 'function') {
-        toolbox.addStyle(style);
+      // AnyDuringMigration because:  Property 'removeStyle' does not exist on
+      // type 'IToolbox'.
+      if (isEnd &&
+          typeof (toolbox as AnyDuringMigration).removeStyle === 'function') {
+        // AnyDuringMigration because:  Property 'removeStyle' does not exist on
+        // type 'IToolbox'.
+        (toolbox as AnyDuringMigration).removeStyle(style);
+        // AnyDuringMigration because:  Property 'addStyle' does not exist on
+        // type 'IToolbox'.
+      } else if (
+          !isEnd &&
+          typeof (toolbox as AnyDuringMigration).addStyle === 'function') {
+        // AnyDuringMigration because:  Property 'addStyle' does not exist on
+        // type 'IToolbox'.
+        (toolbox as AnyDuringMigration).addStyle(style);
       }
     }
   }
 
-  /**
-   * Fire a move event at the end of a block drag.
-   * @protected
-   */
-  fireMoveEvent_() {
-    const event = /** @type {!BlockMove} */
-        (new (eventUtils.get(eventUtils.BLOCK_MOVE))(this.draggingBlock_));
+  /** Fire a move event at the end of a block drag. */
+  protected fireMoveEvent_() {
+    const event = new (eventUtils.get(eventUtils.BLOCK_MOVE))!
+        (this.draggingBlock_) as BlockMove;
     event.oldCoordinate = this.startXY_;
     event.recordNew();
     eventUtils.fire(event);
@@ -388,9 +354,8 @@ const BlockDragger = class {
   /**
    * Update the cursor (and possibly the trash can lid) to reflect whether the
    * dragging block would be deleted if released immediately.
-   * @protected
    */
-  updateCursorDuringBlockDrag_() {
+  protected updateCursorDuringBlockDrag_() {
     this.draggingBlock_.setDeleteStyle(this.wouldDeleteBlock_);
   }
 
@@ -399,13 +364,10 @@ const BlockDragger = class {
    * correction for mutator workspaces.
    * This function does not consider differing origins.  It simply scales the
    * input's x and y values.
-   * @param {!Coordinate} pixelCoord A coordinate with x and y
-   *     values in CSS pixel units.
-   * @return {!Coordinate} The input coordinate divided by the
-   *     workspace scale.
-   * @protected
+   * @param pixelCoord A coordinate with x and y values in CSS pixel units.
+   * @return The input coordinate divided by the workspace scale.
    */
-  pixelsToWorkspaceUnits_(pixelCoord) {
+  protected pixelsToWorkspaceUnits_(pixelCoord: Coordinate): Coordinate {
     const result = new Coordinate(
         pixelCoord.x / this.workspace_.scale,
         pixelCoord.y / this.workspace_.scale);
@@ -413,7 +375,7 @@ const BlockDragger = class {
       // If we're in a mutator, its scale is always 1, purely because of some
       // oddities in our rendering optimizations.  The actual scale is the same
       // as the scale on the parent workspace. Fix that for dragging.
-      const mainScale = this.workspace_.options.parentWorkspace.scale;
+      const mainScale = this.workspace_.options.parentWorkspace!.scale;
       result.scale(1 / mainScale);
     }
     return result;
@@ -421,11 +383,10 @@ const BlockDragger = class {
 
   /**
    * Move all of the icons connected to this drag.
-   * @param {!Coordinate} dxy How far to move the icons from their
-   *     original positions, in workspace units.
-   * @protected
+   * @param dxy How far to move the icons from their original positions, in
+   *     workspace units.
    */
-  dragIcons_(dxy) {
+  protected dragIcons_(dxy: Coordinate) {
     // Moving icons moves their associated bubbles.
     for (let i = 0; i < this.dragIconData_.length; i++) {
       const data = this.dragIconData_[i];
@@ -436,11 +397,9 @@ const BlockDragger = class {
   /**
    * Get a list of the insertion markers that currently exist.  Drags have 0, 1,
    * or 2 insertion markers.
-   * @return {!Array<!BlockSvg>} A possibly empty list of insertion
-   *     marker blocks.
-   * @public
+   * @return A possibly empty list of insertion marker blocks.
    */
-  getInsertionMarkers() {
+  getInsertionMarkers(): BlockSvg[] {
     // No insertion markers with the old style of dragged connection managers.
     if (this.draggedConnectionManager_ &&
         this.draggedConnectionManager_.getInsertionMarkers) {
@@ -448,37 +407,41 @@ const BlockDragger = class {
     }
     return [];
   }
-};
+}
+
+/** Data about the position of a given icon. */
+export interface IconPositionData {
+  location: Coordinate;
+  icon: Icon;
+}
 
 /**
  * Make a list of all of the icons (comment, warning, and mutator) that are
  * on this block and its descendants.  Moving an icon moves the bubble that
  * extends from it if that bubble is open.
- * @param {!BlockSvg} block The root block that is being dragged.
- * @return {!Array<!Object>} The list of all icons and their locations.
+ * @param block The root block that is being dragged.
+ * @return The list of all icons and their locations.
  */
-const initIconData = function(block) {
+function initIconData(block: BlockSvg): IconPositionData[] {
   // Build a list of icons that need to be moved and where they started.
   const dragIconData = [];
-  const descendants =
-      /** @type {!Array<!BlockSvg>} */ (block.getDescendants(false));
+  const descendants = (block.getDescendants(false));
 
-  for (let i = 0, descendant; (descendant = descendants[i]); i++) {
+  for (let i = 0, descendant; descendant = descendants[i]; i++) {
     const icons = descendant.getIcons();
     for (let j = 0; j < icons.length; j++) {
       const data = {
         // Coordinate with x and y properties (workspace
         // coordinates).
-        location: icons[j].getIconLocation(),
-        // Blockly.Icon
+        location: icons[j].getIconLocation(),  // Blockly.Icon
         icon: icons[j],
       };
       dragIconData.push(data);
     }
   }
-  return dragIconData;
-};
+  // AnyDuringMigration because:  Type '{ location: Coordinate | null; icon:
+  // Icon; }[]' is not assignable to type 'IconPositionData[]'.
+  return dragIconData as AnyDuringMigration;
+}
 
 registry.register(registry.Type.BLOCK_DRAGGER, registry.DEFAULT, BlockDragger);
-
-exports.BlockDragger = BlockDragger;