blockly 8.0.5 → 9.0.0-beta.0

package/core/renderers/common/i_path_object.d.ts

@@ -0,0 +1,117 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { BlockStyle } from '../../theme.js';
+import type { ConstantProvider } from './constants.js';
+/**
+ * An interface for a block's path object.
+ * @param _root The root SVG element.
+ * @param _constants The renderer's constants.
+ * @alias Blockly.blockRendering.IPathObject
+ */
+export interface IPathObject {
+    /** The primary path of the block. */
+    svgPath: SVGElement;
+    /** The renderer's constant provider. */
+    constants: ConstantProvider;
+    /** The primary path of the block. */
+    style: BlockStyle;
+    /**
+     * Holds the cursors SVG element when the cursor is attached to the block.
+     * This is null if there is no cursor on the block.
+     */
+    cursorSvg: SVGElement;
+    /**
+     * Holds the markers SVG element when the marker is attached to the block.
+     * This is null if there is no marker on the block.
+     */
+    markerSvg: SVGElement;
+    /**
+     * Set the path generated by the renderer onto the respective SVG element.
+     * @param pathString The path.
+     * @internal
+     */
+    setPath: any;
+    /**
+     * Apply the stored colours to the block's path, taking into account whether
+     * the paths belong to a shadow block.
+     * @param block The source block.
+     * @internal
+     */
+    applyColour: any;
+    /**
+     * Update the style.
+     * @param blockStyle The block style to use.
+     * @internal
+     */
+    setStyle: any;
+    /**
+     * Flip the SVG paths in RTL.
+     * @internal
+     */
+    flipRTL: () => void;
+    /**
+     * Add the cursor SVG to this block's SVG group.
+     * @param cursorSvg The SVG root of the cursor to be added to the block SVG
+     *     group.
+     * @internal
+     */
+    setCursorSvg: any;
+    /**
+     * Add the marker SVG to this block's SVG group.
+     * @param markerSvg The SVG root of the marker to be added to the block SVG
+     *     group.
+     * @internal
+     */
+    setMarkerSvg: any;
+    /**
+     * Set whether the block shows a highlight or not.  Block highlighting is
+     * often used to visually mark blocks currently being executed.
+     * @param highlighted True if highlighted.
+     * @internal
+     */
+    updateHighlighted: any;
+    /**
+     * Add or remove styling showing that a block is selected.
+     * @param enable True if selection is enabled, false otherwise.
+     * @internal
+     */
+    updateSelected: any;
+    /**
+     * Add or remove styling showing that a block is dragged over a delete area.
+     * @param enable True if the block is being dragged over a delete area, false
+     *     otherwise.
+     * @internal
+     */
+    updateDraggingDelete: any;
+    /**
+     * Add or remove styling showing that a block is an insertion marker.
+     * @param enable True if the block is an insertion marker, false otherwise.
+     * @internal
+     */
+    updateInsertionMarker: any;
+    /**
+     * Add or remove styling showing that a block is movable.
+     * @param enable True if the block is movable, false otherwise.
+     * @internal
+     */
+    updateMovable: any;
+    /**
+     * Add or remove styling that shows that if the dragging block is dropped,
+     * this block will be replaced.  If a shadow block, it will disappear.
+     * Otherwise it will bump.
+     * @param enable True if styling should be added.
+     * @internal
+     */
+    updateReplacementFade: any;
+    /**
+     * Add or remove styling that shows that if the dragging block is dropped,
+     * this block will be connected to the input.
+     * @param conn The connection on the input to highlight.
+     * @param enable True if styling should be added.
+     * @internal
+     */
+    updateShapeForInputHighlight: any;
+}

package/core/renderers/common/i_path_object.ts

@@ -0,0 +1,161 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview The interface for an object that owns a block's rendering SVG
+ * elements.
+ */
+
+/**
+ * The interface for an object that owns a block's rendering SVG
+ * elements.
+ * @namespace Blockly.blockRendering.IPathObject
+ */
+import * as goog from '../../../closure/goog/goog.js';
+goog.declareModuleId('Blockly.blockRendering.IPathObject');
+
+/* eslint-disable-next-line no-unused-vars */
+// Unused import preserved for side-effects. Remove if unneeded.
+// import '../../block_svg.js';
+/* eslint-disable-next-line no-unused-vars */
+// Unused import preserved for side-effects. Remove if unneeded.
+// import '../../connection.js';
+/* eslint-disable-next-line no-unused-vars */
+// Unused import preserved for side-effects. Remove if unneeded.
+// import '../../theme.js';
+
+import type {BlockStyle} from '../../theme.js';
+
+import type {ConstantProvider} from './constants.js';
+
+
+/**
+ * An interface for a block's path object.
+ * @param _root The root SVG element.
+ * @param _constants The renderer's constants.
+ * @alias Blockly.blockRendering.IPathObject
+ */
+export interface IPathObject {
+  /** The primary path of the block. */
+  svgPath: SVGElement;
+
+  /** The renderer's constant provider. */
+  constants: ConstantProvider;
+
+  /** The primary path of the block. */
+  style: BlockStyle;
+
+  /**
+   * Holds the cursors SVG element when the cursor is attached to the block.
+   * This is null if there is no cursor on the block.
+   */
+  cursorSvg: SVGElement;
+
+  /**
+   * Holds the markers SVG element when the marker is attached to the block.
+   * This is null if there is no marker on the block.
+   */
+  markerSvg: SVGElement;
+
+  /**
+   * Set the path generated by the renderer onto the respective SVG element.
+   * @param pathString The path.
+   * @internal
+   */
+  setPath: AnyDuringMigration;
+
+  /**
+   * Apply the stored colours to the block's path, taking into account whether
+   * the paths belong to a shadow block.
+   * @param block The source block.
+   * @internal
+   */
+  applyColour: AnyDuringMigration;
+
+  /**
+   * Update the style.
+   * @param blockStyle The block style to use.
+   * @internal
+   */
+  setStyle: AnyDuringMigration;
+
+  /**
+   * Flip the SVG paths in RTL.
+   * @internal
+   */
+  flipRTL: () => void;
+
+  /**
+   * Add the cursor SVG to this block's SVG group.
+   * @param cursorSvg The SVG root of the cursor to be added to the block SVG
+   *     group.
+   * @internal
+   */
+  setCursorSvg: AnyDuringMigration;
+
+  /**
+   * Add the marker SVG to this block's SVG group.
+   * @param markerSvg The SVG root of the marker to be added to the block SVG
+   *     group.
+   * @internal
+   */
+  setMarkerSvg: AnyDuringMigration;
+
+  /**
+   * Set whether the block shows a highlight or not.  Block highlighting is
+   * often used to visually mark blocks currently being executed.
+   * @param highlighted True if highlighted.
+   * @internal
+   */
+  updateHighlighted: AnyDuringMigration;
+
+  /**
+   * Add or remove styling showing that a block is selected.
+   * @param enable True if selection is enabled, false otherwise.
+   * @internal
+   */
+  updateSelected: AnyDuringMigration;
+
+  /**
+   * Add or remove styling showing that a block is dragged over a delete area.
+   * @param enable True if the block is being dragged over a delete area, false
+   *     otherwise.
+   * @internal
+   */
+  updateDraggingDelete: AnyDuringMigration;
+
+  /**
+   * Add or remove styling showing that a block is an insertion marker.
+   * @param enable True if the block is an insertion marker, false otherwise.
+   * @internal
+   */
+  updateInsertionMarker: AnyDuringMigration;
+
+  /**
+   * Add or remove styling showing that a block is movable.
+   * @param enable True if the block is movable, false otherwise.
+   * @internal
+   */
+  updateMovable: AnyDuringMigration;
+
+  /**
+   * Add or remove styling that shows that if the dragging block is dropped,
+   * this block will be replaced.  If a shadow block, it will disappear.
+   * Otherwise it will bump.
+   * @param enable True if styling should be added.
+   * @internal
+   */
+  updateReplacementFade: AnyDuringMigration;
+
+  /**
+   * Add or remove styling that shows that if the dragging block is dropped,
+   * this block will be connected to the input.
+   * @param conn The connection on the input to highlight.
+   * @param enable True if styling should be added.
+   * @internal
+   */
+  updateShapeForInputHighlight: AnyDuringMigration;
+}

package/core/renderers/common/info.d.ts

@@ -0,0 +1,194 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { BlockSvg } from '../../block_svg.js';
+import { Input } from '../../input.js';
+import type { Measurable } from '../measurables/base.js';
+import { BottomRow } from '../measurables/bottom_row.js';
+import { Icon } from '../measurables/icon.js';
+import { InputRow } from '../measurables/input_row.js';
+import { OutputConnection } from '../measurables/output_connection.js';
+import type { Row } from '../measurables/row.js';
+import { SpacerRow } from '../measurables/spacer_row.js';
+import { TopRow } from '../measurables/top_row.js';
+import type { ConstantProvider } from './constants.js';
+import type { Renderer } from './renderer.js';
+/**
+ * An object containing all sizing information needed to draw this block.
+ *
+ * This measure pass does not propagate changes to the block (although fields
+ * may choose to rerender when getSize() is called).  However, calling it
+ * repeatedly may be expensive.
+ * @alias Blockly.blockRendering.RenderInfo
+ */
+export declare class RenderInfo {
+    block_: any;
+    protected constants_: ConstantProvider;
+    outputConnection: OutputConnection;
+    isInline: boolean;
+    isCollapsed: boolean;
+    isInsertionMarker: boolean;
+    RTL: boolean;
+    /** The block renderer in use. */
+    protected readonly renderer_: Renderer;
+    /** The height of the rendered block, including child blocks. */
+    height: number;
+    /** The width of the rendered block, including child blocks. */
+    widthWithChildren: number;
+    /**
+     * The width of the rendered block, excluding child blocks.  This is the
+     * right edge of the block when rendered LTR.
+     */
+    width: number;
+    statementEdge: number;
+    /** An array of Row objects containing sizing information. */
+    rows: Row[];
+    /** An array of input rows on the block. */
+    inputRows: InputRow[];
+    /** An array of measurable objects containing hidden icons. */
+    hiddenIcons: Icon[];
+    topRow: TopRow;
+    bottomRow: BottomRow;
+    startX: number;
+    startY: number;
+    /**
+     * @param renderer The renderer in use.
+     * @param block The block to measure.
+     * @internal
+     */
+    constructor(renderer: Renderer, block: BlockSvg);
+    /**
+     * Get the block renderer in use.
+     * @return The block renderer in use.
+     * @internal
+     */
+    getRenderer(): Renderer;
+    /**
+     * Populate and return an object containing all sizing information needed to
+     * draw this block.
+     *
+     * This measure pass does not propagate changes to the block (although fields
+     * may choose to rerender when getSize() is called).  However, calling it
+     * repeatedly may be expensive.
+     * @internal
+     */
+    measure(): void;
+    /**
+     * Create rows of Measurable objects representing all renderable parts of the
+     * block.
+     */
+    protected createRows_(): void;
+    /**
+     * Create all non-spacer elements that belong on the top row.
+     * @internal
+     */
+    populateTopRow_(): void;
+    /**
+     * Create all non-spacer elements that belong on the bottom row.
+     * @internal
+     */
+    populateBottomRow_(): void;
+    /**
+     * Add an input element to the active row, if needed, and record the type of
+     * the input on the row.
+     * @param input The input to record information about.
+     * @param activeRow The row that is currently being populated.
+     */
+    protected addInput_(input: Input, activeRow: Row): void;
+    /**
+     * Decide whether to start a new row between the two Blockly.Inputs.
+     * @param input The first input to consider
+     * @param lastInput The input that follows.
+     * @return True if the next input should be rendered on a new row.
+     */
+    protected shouldStartNewRow_(input: Input, lastInput: Input): boolean;
+    /** Add horizontal spacing between and around elements within each row. */
+    protected addElemSpacing_(): void;
+    /**
+     * Calculate the width of a spacer element in a row based on the previous and
+     * next elements in that row.  For instance, extra padding is added between
+     * two editable fields.
+     * @param prev The element before the spacer.
+     * @param next The element after the spacer.
+     * @return The size of the spacing between the two elements.
+     */
+    protected getInRowSpacing_(prev: Measurable | null, next: Measurable | null): number;
+    /**
+     * Figure out where the right edge of the block and right edge of statement
+     * inputs should be placed.
+     */
+    protected computeBounds_(): void;
+    /**
+     * Extra spacing may be necessary to make sure that the right sides of all
+     * rows line up.  This can only be calculated after a first pass to calculate
+     * the sizes of all rows.
+     */
+    protected alignRowElements_(): void;
+    /**
+     * Calculate the desired width of an input row.
+     * @param _row The input row.
+     * @return The desired width of the input row.
+     */
+    protected getDesiredRowWidth_(_row: Row): number;
+    /**
+     * Modify the given row to add the given amount of padding around its fields.
+     * The exact location of the padding is based on the alignment property of the
+     * last input in the field.
+     * @param row The row to add padding to.
+     * @param missingSpace How much padding to add.
+     */
+    protected addAlignmentPadding_(row: Row, missingSpace: number): void;
+    /**
+     * Align the elements of a statement row based on computed bounds.
+     * Unlike other types of rows, statement rows add space in multiple places.
+     * @param row The statement row to resize.
+     */
+    protected alignStatementRow_(row: InputRow): void;
+    /** Add spacers between rows and set their sizes. */
+    protected addRowSpacing_(): void;
+    /**
+     * Create a spacer row to go between prev and next, and set its size.
+     * @param prev The previous row.
+     * @param next The next row.
+     * @return The newly created spacer row.
+     */
+    protected makeSpacerRow_(prev: Row, next: Row): SpacerRow;
+    /**
+     * Calculate the width of a spacer row.
+     * @param _prev The row before the spacer.
+     * @param _next The row after the spacer.
+     * @return The desired width of the spacer row between these two rows.
+     */
+    protected getSpacerRowWidth_(_prev: Row, _next: Row): number;
+    /**
+     * Calculate the height of a spacer row.
+     * @param _prev The row before the spacer.
+     * @param _next The row after the spacer.
+     * @return The desired height of the spacer row between these two rows.
+     */
+    protected getSpacerRowHeight_(_prev: Row, _next: Row): number;
+    /**
+     * Calculate the centerline of an element in a rendered row.
+     * This base implementation puts the centerline at the middle of the row
+     * vertically, with no special cases.  You will likely need extra logic to
+     * handle (at minimum) top and bottom rows.
+     * @param row The row containing the element.
+     * @param elem The element to place.
+     * @return The desired centerline of the given element, as an offset from the
+     *     top left of the block.
+     */
+    protected getElemCenterline_(row: Row, elem: Measurable): number;
+    /**
+     * Record final position information on elements on the given row, for use in
+     * drawing.  At minimum this records xPos and centerline on each element.
+     * @param row The row containing the elements.
+     */
+    protected recordElemPositions_(row: Row): void;
+    /**
+     * Make any final changes to the rendering information object.  In particular,
+     * store the y position of each row, and record the height of the full block.
+     */
+    protected finalize_(): void;
+}