blockly 8.0.4 → 8.0.5-beta.0

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

@@ -8,21 +8,20 @@
  * @fileoverview The class extends Gesture to support pinch to zoom
  * for both pointer and touch events.
  */
-'use strict';
 
 /**
  * The class extends Gesture to support pinch to zoom
  * for both pointer and touch events.
  * @class
  */
-goog.module('Blockly.TouchGesture');
+import * as goog from '../closure/goog/goog.js';
+goog.declareModuleId('Blockly.TouchGesture');
 
-const Touch = goog.require('Blockly.Touch');
-const browserEvents = goog.require('Blockly.browserEvents');
-const {Coordinate} = goog.require('Blockly.utils.Coordinate');
-const {Gesture} = goog.require('Blockly.Gesture');
-/* eslint-disable-next-line no-unused-vars */
-const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
+import * as browserEvents from './browser_events.js';
+import {Gesture} from './gesture.js';
+import * as Touch from './touch.js';
+import {Coordinate} from './utils/coordinate.js';
+import type {WorkspaceSvg} from './workspace_svg.js';
 
 
 /*
@@ -30,88 +29,53 @@ const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
  * events.  "End" refers to touchend, mouseup, and pointerend events.
  */
 
-
-/**
- * A multiplier used to convert the gesture scale to a zoom in delta.
- * @const
- */
+/** A multiplier used to convert the gesture scale to a zoom in delta. */
 const ZOOM_IN_MULTIPLIER = 5;
 
-/**
- * A multiplier used to convert the gesture scale to a zoom out delta.
- * @const
- */
+/** A multiplier used to convert the gesture scale to a zoom out delta. */
 const ZOOM_OUT_MULTIPLIER = 6;
 
 /**
  * Class for one gesture.
- * @extends {Gesture}
  * @alias Blockly.TouchGesture
  */
-class TouchGesture extends Gesture {
-  /**
-   * @param {!Event} e The event that kicked off this gesture.
-   * @param {!WorkspaceSvg} creatorWorkspace The workspace that created
-   *     this gesture and has a reference to it.
-   */
-  constructor(e, creatorWorkspace) {
-    super(e, creatorWorkspace);
+export class TouchGesture extends Gesture {
+  /** Boolean for whether or not this gesture is a multi-touch gesture. */
+  private isMultiTouch_ = false;
 
-    /**
-     * Boolean for whether or not this gesture is a multi-touch gesture.
-     * @type {boolean}
-     * @private
-     */
-    this.isMultiTouch_ = false;
+  /** A map of cached points used for tracking multi-touch gestures. */
+  private cachedPoints = new Map<string, Coordinate|null>();
 
-    /**
-     * A map of cached points used for tracking multi-touch gestures.
-     * @type {!Object<number|string, Coordinate>}
-     * @private
-     */
-    this.cachedPoints_ = Object.create(null);
-
-    /**
-     * This is the ratio between the starting distance between the touch points
-     * and the most recent distance between the touch points.
-     * Scales between 0 and 1 mean the most recent zoom was a zoom out.
-     * Scales above 1.0 mean the most recent zoom was a zoom in.
-     * @type {number}
-     * @private
-     */
-    this.previousScale_ = 0;
+  /**
+   * This is the ratio between the starting distance between the touch points
+   * and the most recent distance between the touch points.
+   * Scales between 0 and 1 mean the most recent zoom was a zoom out.
+   * Scales above 1.0 mean the most recent zoom was a zoom in.
+   */
+  private previousScale_ = 0;
 
-    /**
-     * The starting distance between two touch points.
-     * @type {number}
-     * @private
-     */
-    this.startDistance_ = 0;
+  /** The starting distance between two touch points. */
+  private startDistance_ = 0;
 
-    /**
-     * A handle to use to unbind the second touch start or pointer down listener
-     * at the end of a drag.
-     * Opaque data returned from Blockly.bindEventWithChecks_.
-     * @type {?browserEvents.Data}
-     * @private
-     */
-    this.onStartWrapper_ = null;
+  /**
+   * A handle to use to unbind the second touch start or pointer down listener
+   * at the end of a drag.
+   * Opaque data returned from Blockly.bindEventWithChecks_.
+   */
+  private onStartWrapper_: browserEvents.Data|null = null;
 
-    /**
-     * Boolean for whether or not the workspace supports pinch-zoom.
-     * @type {?boolean}
-     * @private
-     */
-    this.isPinchZoomEnabled_ = null;
-  }
+  /** Boolean for whether or not the workspace supports pinch-zoom. */
+  private isPinchZoomEnabled_: boolean|null = null;
+  override onMoveWrapper_: AnyDuringMigration;
+  override onUpWrapper_: AnyDuringMigration;
 
   /**
    * Start a gesture: update the workspace to indicate that a gesture is in
    * progress and bind mousemove and mouseup handlers.
-   * @param {!Event} e A mouse down, touch start or pointer down event.
-   * @package
+   * @param e A mouse down, touch start or pointer down event.
+   * @internal
    */
-  doStart(e) {
+  override doStart(e: MouseEvent) {
     this.isPinchZoomEnabled_ = this.startWorkspace_.options.zoomOptions &&
         this.startWorkspace_.options.zoomOptions.pinch;
     super.doStart(e);
@@ -127,10 +91,10 @@ class TouchGesture extends Gesture {
    * opt_noCaptureIdentifier.
    * In addition, binding a second mouse down event to detect multi-touch
    * events.
-   * @param {!Event} e A mouse down or touch start event.
-   * @package
+   * @param e A mouse down or touch start event.
+   * @internal
    */
-  bindMouseEvents(e) {
+  override bindMouseEvents(e: Event) {
     this.onStartWrapper_ = browserEvents.conditionalBind(
         document, 'mousedown', null, this.handleStart.bind(this),
         /* opt_noCaptureIdentifier */ true);
@@ -147,10 +111,10 @@ class TouchGesture extends Gesture {
 
   /**
    * Handle a mouse down, touch start, or pointer down event.
-   * @param {!Event} e A mouse down, touch start, or pointer down event.
-   * @package
+   * @param e A mouse down, touch start, or pointer down event.
+   * @internal
    */
-  handleStart(e) {
+  handleStart(e: Event) {
     if (this.isDragging()) {
       // A drag has already started, so this can no longer be a pinch-zoom.
       return;
@@ -166,10 +130,10 @@ class TouchGesture extends Gesture {
 
   /**
    * Handle a mouse move, touch move, or pointer move event.
-   * @param {!Event} e A mouse move, touch move, or pointer move event.
-   * @package
+   * @param e A mouse move, touch move, or pointer move event.
+   * @internal
    */
-  handleMove(e) {
+  override handleMove(e: MouseEvent) {
     if (this.isDragging()) {
       // We are in the middle of a drag, only handle the relevant events
       if (Touch.shouldHandleEvent(e)) {
@@ -189,10 +153,10 @@ class TouchGesture extends Gesture {
 
   /**
    * Handle a mouse up, touch end, or pointer up event.
-   * @param {!Event} e A mouse up, touch end, or pointer up event.
-   * @package
+   * @param e A mouse up, touch end, or pointer up event.
+   * @internal
    */
-  handleUp(e) {
+  override handleUp(e: Event) {
     if (Touch.isTouchEvent(e) && !this.isDragging()) {
       this.handleTouchEnd(e);
     }
@@ -211,18 +175,18 @@ class TouchGesture extends Gesture {
 
   /**
    * Whether this gesture is part of a multi-touch gesture.
-   * @return {boolean} Whether this gesture is part of a multi-touch gesture.
-   * @package
+   * @return Whether this gesture is part of a multi-touch gesture.
+   * @internal
    */
-  isMultiTouch() {
+  isMultiTouch(): boolean {
     return this.isMultiTouch_;
   }
 
   /**
    * Sever all links from this object.
-   * @package
+   * @internal
    */
-  dispose() {
+  override dispose() {
     super.dispose();
 
     if (this.onStartWrapper_) {
@@ -233,20 +197,18 @@ class TouchGesture extends Gesture {
   /**
    * Handle a touch start or pointer down event and keep track of current
    * pointers.
-   * @param {!Event} e A touch start, or pointer down event.
-   * @package
+   * @param e A touch start, or pointer down event.
+   * @internal
    */
-  handleTouchStart(e) {
+  handleTouchStart(e: Event) {
     const pointerId = Touch.getTouchIdentifierFromEvent(e);
     // store the pointerId in the current list of pointers
-    this.cachedPoints_[pointerId] = this.getTouchPoint(e);
-    const pointers = Object.keys(this.cachedPoints_);
+    this.cachedPoints.set(pointerId, this.getTouchPoint(e));
+    const pointers = Array.from(this.cachedPoints.keys());
     // If two pointers are down, store info
     if (pointers.length === 2) {
-      const point0 =
-          /** @type {!Coordinate} */ (this.cachedPoints_[pointers[0]]);
-      const point1 =
-          /** @type {!Coordinate} */ (this.cachedPoints_[pointers[1]]);
+      const point0 = (this.cachedPoints.get(pointers[0]))!;
+      const point1 = (this.cachedPoints.get(pointers[1]))!;
       this.startDistance_ = Coordinate.distance(point0, point1);
       this.isMultiTouch_ = true;
       e.preventDefault();
@@ -256,16 +218,15 @@ class TouchGesture extends Gesture {
   /**
    * Handle a touch move or pointer move event and zoom in/out if two pointers
    * are on the screen.
-   * @param {!Event} e A touch move, or pointer move event.
-   * @package
+   * @param e A touch move, or pointer move event.
+   * @internal
    */
-  handleTouchMove(e) {
+  handleTouchMove(e: MouseEvent) {
     const pointerId = Touch.getTouchIdentifierFromEvent(e);
     // Update the cache
-    this.cachedPoints_[pointerId] = this.getTouchPoint(e);
+    this.cachedPoints.set(pointerId, this.getTouchPoint(e));
 
-    const pointers = Object.keys(this.cachedPoints_);
-    if (this.isPinchZoomEnabled_ && pointers.length === 2) {
+    if (this.isPinchZoomEnabled_ && this.cachedPoints.size === 2) {
       this.handlePinch_(e);
     } else {
       super.handleMove(e);
@@ -274,14 +235,13 @@ class TouchGesture extends Gesture {
 
   /**
    * Handle pinch zoom gesture.
-   * @param {!Event} e A touch move, or pointer move event.
-   * @private
+   * @param e A touch move, or pointer move event.
    */
-  handlePinch_(e) {
-    const pointers = Object.keys(this.cachedPoints_);
+  private handlePinch_(e: MouseEvent) {
+    const pointers = Array.from(this.cachedPoints.keys());
     // Calculate the distance between the two pointers
-    const point0 = /** @type {!Coordinate} */ (this.cachedPoints_[pointers[0]]);
-    const point1 = /** @type {!Coordinate} */ (this.cachedPoints_[pointers[1]]);
+    const point0 = (this.cachedPoints.get(pointers[0]))!;
+    const point1 = (this.cachedPoints.get(pointers[1]))!;
     const moveDistance = Coordinate.distance(point0, point1);
     const scale = moveDistance / this.startDistance_;
 
@@ -300,34 +260,36 @@ class TouchGesture extends Gesture {
 
   /**
    * Handle a touch end or pointer end event and end the gesture.
-   * @param {!Event} e A touch end, or pointer end event.
-   * @package
+   * @param e A touch end, or pointer end event.
+   * @internal
    */
-  handleTouchEnd(e) {
+  handleTouchEnd(e: Event) {
     const pointerId = Touch.getTouchIdentifierFromEvent(e);
-    if (this.cachedPoints_[pointerId]) {
-      delete this.cachedPoints_[pointerId];
+    if (this.cachedPoints.has(pointerId)) {
+      this.cachedPoints.delete(pointerId);
     }
-    if (Object.keys(this.cachedPoints_).length < 2) {
-      this.cachedPoints_ = Object.create(null);
+    if (this.cachedPoints.size < 2) {
+      this.cachedPoints.clear();
       this.previousScale_ = 0;
     }
   }
 
   /**
    * Helper function returning the current touch point coordinate.
-   * @param {!Event} e A touch or pointer event.
-   * @return {?Coordinate} The current touch point coordinate
-   * @package
+   * @param e A touch or pointer event.
+   * @return The current touch point coordinate
+   * @internal
    */
-  getTouchPoint(e) {
+  getTouchPoint(e: Event): Coordinate|null {
     if (!this.startWorkspace_) {
       return null;
     }
+    // TODO(#6097): Make types accurate, possibly by refactoring touch handling.
+    const typelessEvent = e as AnyDuringMigration;
     return new Coordinate(
-        (e.changedTouches ? e.changedTouches[0].pageX : e.pageX),
-        (e.changedTouches ? e.changedTouches[0].pageY : e.pageY));
+        typelessEvent.changedTouches ? typelessEvent.changedTouches[0].pageX :
+                                       typelessEvent.pageX,
+        typelessEvent.changedTouches ? typelessEvent.changedTouches[0].pageY :
+                                       typelessEvent.pageY);
   }
 }
-
-exports.TouchGesture = TouchGesture;

package/core/trashcan.d.ts

@@ -0,0 +1,195 @@
+/**
+ * @license
+ * Copyright 2011 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import './events/events_trashcan_open.js';
+import { DeleteArea } from './delete_area.js';
+import type { IAutoHideable } from './interfaces/i_autohideable.js';
+import type { IDraggable } from './interfaces/i_draggable.js';
+import type { IFlyout } from './interfaces/i_flyout.js';
+import type { IPositionable } from './interfaces/i_positionable.js';
+import type { UiMetrics } from './metrics_manager.js';
+import { Rect } from './utils/rect.js';
+import type { WorkspaceSvg } from './workspace_svg.js';
+/**
+ * Class for a trash can.
+ * @alias Blockly.Trashcan
+ */
+export declare class Trashcan extends DeleteArea implements IAutoHideable, IPositionable {
+    private workspace;
+    /**
+     * The unique id for this component that is used to register with the
+     * ComponentManager.
+     */
+    id: string;
+    /**
+     * A list of JSON (stored as strings) representing blocks in the trashcan.
+     */
+    private readonly contents_;
+    /**
+     * The trashcan flyout.
+     * @internal
+     */
+    flyout: IFlyout | null;
+    /** Current open/close state of the lid. */
+    isLidOpen: boolean;
+    /**
+     * The minimum openness of the lid. Used to indicate if the trashcan
+     * contains blocks.
+     */
+    private minOpenness_;
+    /** The SVG group containing the trash can. */
+    private svgGroup_;
+    /** The SVG image element of the trash can lid. */
+    private svgLid_;
+    /** Task ID of opening/closing animation. */
+    private lidTask_;
+    /** Current state of lid opening (0.0 = closed, 1.0 = open). */
+    private lidOpen_;
+    /** Left coordinate of the trash can. */
+    private left_;
+    /** Top coordinate of the trash can. */
+    private top_;
+    /** Whether this trash can has been initialized. */
+    private initialized_;
+    /** @param workspace The workspace to sit in. */
+    constructor(workspace: WorkspaceSvg);
+    /**
+     * Create the trash can elements.
+     * @return The trash can's SVG group.
+     */
+    createDom(): SVGElement;
+    /** Initializes the trash can. */
+    init(): void;
+    /**
+     * Dispose of this trash can.
+     * Unlink from all DOM elements to prevent memory leaks.
+     * @suppress {checkTypes}
+     */
+    dispose(): void;
+    /**
+     * Whether the trashcan has contents.
+     * @return True if the trashcan has contents.
+     */
+    private hasContents_;
+    /**
+     * Returns true if the trashcan contents-flyout is currently open.
+     * @return True if the trashcan contents-flyout is currently open.
+     */
+    contentsIsOpen(): boolean;
+    /** Opens the trashcan flyout. */
+    openFlyout(): void;
+    /** Closes the trashcan flyout. */
+    closeFlyout(): void;
+    /**
+     * Hides the component. Called in WorkspaceSvg.hideChaff.
+     * @param onlyClosePopups Whether only popups should be closed.
+     *     Flyouts should not be closed if this is true.
+     */
+    autoHide(onlyClosePopups: boolean): void;
+    /**
+     * Empties the trashcan's contents. If the contents-flyout is currently open
+     * it will be closed.
+     */
+    emptyContents(): void;
+    /**
+     * Positions the trashcan.
+     * It is positioned in the opposite corner to the corner the
+     * categories/toolbox starts at.
+     * @param metrics The workspace metrics.
+     * @param savedPositions List of rectangles that are already on the workspace.
+     */
+    position(metrics: UiMetrics, savedPositions: Rect[]): void;
+    /**
+     * Returns the bounding rectangle of the UI element in pixel units relative to
+     * the Blockly injection div.
+     * @return The UI elements's bounding box. Null if bounding box should be
+     *     ignored by other UI elements.
+     */
+    getBoundingRectangle(): Rect | null;
+    /**
+     * Returns the bounding rectangle of the drag target area in pixel units
+     * relative to viewport.
+     * @return The component's bounding box. Null if drag target area should be
+     *     ignored.
+     */
+    getClientRect(): Rect | null;
+    /**
+     * Handles when a cursor with a block or bubble is dragged over this drag
+     * target.
+     * @param _dragElement The block or bubble currently being dragged.
+     */
+    onDragOver(_dragElement: IDraggable): void;
+    /**
+     * Handles when a cursor with a block or bubble exits this drag target.
+     * @param _dragElement The block or bubble currently being dragged.
+     */
+    onDragExit(_dragElement: IDraggable): void;
+    /**
+     * Handles when a block or bubble is dropped on this component.
+     * Should not handle delete here.
+     * @param _dragElement The block or bubble currently being dragged.
+     */
+    onDrop(_dragElement: IDraggable): void;
+    /**
+     * Flip the lid open or shut.
+     * @param state True if open.
+     * @internal
+     */
+    setLidOpen(state: boolean): void;
+    /** Rotate the lid open or closed by one step.  Then wait and recurse. */
+    private animateLid_;
+    /**
+     * Set the angle of the trashcan's lid.
+     * @param lidAngle The angle at which to set the lid.
+     */
+    private setLidAngle_;
+    /**
+     * Sets the minimum openness of the trashcan lid. If the lid is currently
+     * closed, this will update lid's position.
+     * @param newMin The new minimum openness of the lid. Should be between 0
+     *     and 1.
+     */
+    private setMinOpenness_;
+    /**
+     * Flip the lid shut.
+     * Called externally after a drag.
+     */
+    closeLid(): void;
+    /** Inspect the contents of the trash. */
+    click(): void;
+    /**
+     * Fires a UI event for trashcan flyout open or close.
+     * @param trashcanOpen Whether the flyout is opening.
+     */
+    private fireUiEvent_;
+    /**
+     * Prevents a workspace scroll and click event if the trashcan has blocks.
+     * @param e A mouse down event.
+     */
+    private blockMouseDownWhenOpenable_;
+    /**
+     * Indicate that the trashcan can be clicked (by opening it) if it has blocks.
+     */
+    private mouseOver_;
+    /**
+     * Close the lid of the trashcan if it was open (Vis. it was indicating it had
+     *    blocks).
+     */
+    private mouseOut_;
+    /**
+     * Handle a BLOCK_DELETE event. Adds deleted blocks oldXml to the content
+     * array.
+     * @param event Workspace event.
+     */
+    private onDelete_;
+    /**
+     * Converts JSON representing a block into text that can be stored in the
+     * content array.
+     * @param json A JSON representation of a block's state.
+     * @return A BlockInfo object corresponding to the JSON, cleaned of all
+     *     unnecessary attributes.
+     */
+    private cleanBlockJson_;
+}