@blockly/workspace-backpack/dist/backpack.d.ts

A Blockly plugin that adds Backpack support.

/**
 * @license
 * Copyright 2021 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */
/**
 * @fileoverview A backpack that lives on top of the workspace.
 * @author kozbial@google.com (Monica Kozbial)
 */
import * as Blockly from 'blockly/core';
import { BackpackOptions } from './options';
import { Backpackable } from './backpackable';
/**
 * Class for backpack that can be used save blocks from the workspace for
 * future use.
 */
export declare class Backpack extends Blockly.DragTarget implements Blockly.IAutoHideable, Blockly.IPositionable {
    protected workspace_: Blockly.WorkspaceSvg;
    /** The unique id for this component. */
    id: string;
    /**
     * The backpack options, such as which context menus to show, whether to
     * allow opening the backpack when empty and whether to use a different
     * image when the backpack contains blocks.
     */
    private options;
    /** The backpack flyout. Initialized during init. */
    protected flyout_: Blockly.IFlyout | null;
    /** A list of JSON (stored as strings) representing blocks in the backpack. */
    protected contents_: string[];
    /** Array holding info needed to unbind events. Used for disposing. */
    private boundEvents;
    /** Left coordinate of the backpack in pixels. */
    protected left_: number;
    /** Top coordinate of the backpack in pixels. */
    protected top_: number;
    /** Width of the backpack in pixels. Used for clip path. */
    protected readonly WIDTH_ = 40;
    /** Height of the backpack in pixels. Used for clip path. */
    protected readonly HEIGHT_ = 60;
    /** Distance between backpack and bottom/top edge of workspace in pixels. */
    protected readonly MARGIN_VERTICAL_ = 20;
    /** Distance between backpack and right/left edge of workspace in pixels. */
    protected readonly MARGIN_HORIZONTAL_ = 20;
    /** Extent of hotspot on all sides beyond the size of the image in pixels. */
    protected readonly HOTSPOT_MARGIN_ = 10;
    /** The SVG group containing the backpack. */
    protected svgGroup_: SVGElement | null;
    /** The SVG image of the backpack. */
    protected svgImg_: SVGImageElement | null;
    /** Top offset for backpack svg in pixels. */
    private spriteTop;
    /** Left offset for backpack svg in pixels. */
    private spriteLeft;
    /** Width/Height of svg in pixels. */
    private readonly spriteSize;
    /** Whether or not the plugin has been initialized. */
    protected initialized_: boolean;
    /**
     * Constructor for a backpack.
     *
     * @param workspace_ The target workspace that
     *     the backpack will be added to.
     * @param backpackOptions The backpack options to use.
     */
    constructor(workspace_: Blockly.WorkspaceSvg, backpackOptions?: BackpackOptions);
    /**
     * Registers serializer if options.skipSerializerRegistration is false
     * and it hasn't been registered already.
     */
    private registerSerializer;
    /**
     * Initializes the backpack.
     */
    init(): void;
    /**
     * Disposes of workspace search.
     * Unlink from all DOM elements and remove all event listeners
     * to prevent memory leaks.
     */
    dispose(): void;
    /**
     * Creates and initializes the flyout and inserts it into the dom.
     */
    protected initFlyout(): void;
    /**
     * Creates DOM for UI element.
     */
    protected createDom(): void;
    /**
     * Attaches event listeners.
     */
    protected attachListeners(): void;
    /**
     * Helper method for adding an event.
     *
     * @param node Node upon which to listen.
     * @param name Event name to listen to (e.g. 'mousedown').
     * @param thisObject The value of 'this' in the function.
     * @param func Function to call when event is triggered.
     */
    private addEvent;
    /**
     * Returns the backpack flyout.
     *
     * @returns The backpack flyout.
     */
    getFlyout(): Blockly.IFlyout | null;
    /**
     * Returns the bounding rectangle of the drag target area in pixel units
     * relative to viewport.
     *
     * @returns The component's bounding box. Null if drag
     *   target area should be ignored.
     */
    getClientRect(): Blockly.utils.Rect | null;
    /**
     * Returns the bounding rectangle of the UI element in pixel units relative to
     * the Blockly injection div.
     *
     * @returns The component’s bounding box.
     */
    getBoundingRectangle(): Blockly.utils.Rect;
    /**
     * Positions the backpack.
     * 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: Blockly.MetricsManager.UiMetrics, savedPositions: Blockly.utils.Rect[]): void;
    /**
     * Returns the count of items in the backpack.
     *
     * @returns The count of items.
     */
    getCount(): number;
    /**
     * Returns backpack contents.
     *
     * @returns The backpack contents.
     */
    getContents(): string[];
    /**
     * 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: Blockly.IDraggable): void;
    /**
     * Converts the provided block into a JSON string and
     * cleans the JSON of any unnecessary attributes
     *
     * @param block The block to convert.
     * @returns The JSON object as a string.
     */
    private blockToJsonString;
    /**
     * Converts serialized XML to its equivalent serialized JSON string
     *
     * @param blockXml The XML serialized block.
     * @returns The JSON object as a string.
     */
    private blockXmlToJsonString;
    /**
     * Returns whether the backpack contains a duplicate of the provided Block.
     *
     * @param block The block to check.
     * @returns Whether the backpack contains a duplicate of the
     *     provided block.
     */
    containsBlock(block: Blockly.Block): boolean;
    /**
     * Adds the specified block to backpack.
     *
     * @param block The block to be added to the backpack.
     */
    addBlock(block: Blockly.Block): void;
    /**
     * Adds the provided blocks to backpack.
     *
     * @param blocks The blocks to be added to the
     *     backpack.
     */
    addBlocks(blocks: Blockly.Block[]): void;
    /**
     * Removes the specified block from the backpack.
     *
     * @param block The block to be removed from the backpack.
     */
    removeBlock(block: Blockly.Block): void;
    /**
     * @param backpackable The backpackable we want to check for existence within
     *     the backpack.
     * @return whether the backpack contains a duplicate of the provided
     *     backpackable.
     */
    containsBackpackable(backpackable: Backpackable): boolean;
    /**
     * @param backpackable The backpackable to add to the backpack.
     */
    addBackpackable(backpackable: Backpackable): void;
    /** @param backpackables The backpackables to add to the backpack. */
    addBackpackables(backpackables: Backpackable[]): void;
    /** @param backpackable The backpackable to remove from the backpack. */
    removeBackpackable(backpackable: Backpackable): void;
    /**
     * Adds item to backpack.
     *
     * @param item Text representing the JSON of a block to add,
     *     cleaned of all unnecessary attributes.
     */
    addItem(item: string): void;
    /**
     * Adds multiple items to the backpack.
     *
     * @param items The backpack contents to add.
     */
    addItems(items: string[]): void;
    /**
     * Removes item from the backpack.
     *
     * @param item Text representing the JSON of a block to remove,
     * cleaned of all unnecessary attributes.
     */
    removeItem(item: string): void;
    /**
     * Sets backpack contents.
     *
     * @param contents The new backpack contents.
     */
    setContents(contents: string[]): void;
    /**
     * Empties the backpack's contents. If the contents-flyout is currently open
     * it will be closed.
     */
    empty(): void;
    /**
     * Handles content change.
     */
    protected onContentChange(): void;
    /**
     * Returns a filtered list without duplicates within itself and without any
     * shared elements with this.contents_.
     *
     * @param array The array of items to filter.
     * @returns The filtered list.
     */
    private filterDuplicates;
    /**
     * Returns whether the backpack is open-able.
     *
     * @returns Whether the backpack is open-able.
     */
    protected isOpenable(): boolean;
    /**
     * Returns whether the backpack is open.
     *
     * @returns Whether the backpack is open.
     */
    isOpen(): boolean;
    /**
     * Opens the backpack flyout.
     */
    open(): void;
    /**
     * Refreshes backpack flyout contents if the flyout is open.
     */
    protected maybeRefreshFlyoutContents(): void;
    /**
     * Closes the backpack flyout.
     */
    close(): void;
    /**
     * Hides the component. Called in Blockly.hideChaff.
     *
     * @param onlyClosePopups Whether only popups should be closed.
     *     Flyouts should not be closed if this is true.
     */
    autoHide(onlyClosePopups: boolean): void;
    /**
     * Handle click event.
     *
     * @param e Mouse event.
     */
    protected onClick(e: Event): void;
    /**
     * Handles when a cursor with a block or bubble enters this drag target.
     *
     * @param dragElement The block or bubble currently
     *   being dragged.
     */
    onDragEnter(dragElement: Blockly.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: Blockly.IDraggable): void;
    /**
     * Handles a mouseover event.
     */
    private onMouseOver;
    /**
     * Handles a mouseout event.
     */
    private onMouseOut;
    /**
     * Adds or removes styling to darken the backpack to show it is interactable.
     *
     * @param addClass True to add styling, false to remove.
     */
    protected updateHoverStying(addClass: boolean): void;
    /**
     * Returns whether the provided block or bubble should not be moved after
     * being dropped on this component. If true, the element will return to where
     * it was when the drag started.
     *
     * @param dragElement The block or bubble currently
     *   being dragged.
     * @returns Whether the block or bubble provided should be returned
     *   to drag start.
     */
    shouldPreventMove(dragElement: Blockly.IDraggable): boolean;
    /**
     * Prevents a workspace scroll and click event if the backpack is openable.
     *
     * @param e A mouse down event.
     */
    protected blockMouseDownWhenOpenable(e: Event): void;
}
//# sourceMappingURL=backpack.d.ts.map