Flyout class
Class for a flyout.
Signature:
export declare abstract class Flyout extends DeleteArea implements IAutoHideable, IFlyout, IFocusableNode
Extends: DeleteArea
Implements: IAutoHideable, IFlyout, IFocusableNode
Constructors
| Constructor | Modifiers | Description |
|---|---|---|
| (constructor)(workspaceOptions) | Constructs a new instance of the Flyout class |
Properties
| Property | Modifiers | Type | Description |
|---|---|---|---|
| autoClose | boolean | Does the flyout automatically close when a block is created? | |
| contents | protected |
FlyoutItem[] | List of flyout elements. |
| CORNER_RADIUS | readonly |
number | Corner radius of the flyout background. |
| dragAngleRange_ | protected |
number | Range of a drag angle from a flyout considered "dragging toward workspace". Drags that are within the bounds of this many degrees from the orthogonal line to the flyout edge are considered to be "drags toward the workspace". |
| GAP_X | readonly |
number | |
| GAP_Y | readonly |
number | |
| height_ | protected |
number | Height of flyout. |
| inflaters | protected |
Map<string, IFlyoutInflater> | Map from flyout content type to the corresponding inflater class responsible for creating concrete instances of the content type. |
| MARGIN | readonly |
number | |
| RTL | boolean | ||
| SCROLLBAR_MARGIN | readonly |
number | Top/bottom padding between scrollbar and edge of flyout background. |
| svgBackground_ | protected |
SVGPathElement | null | The path around the background of the flyout, which will be filled with a background colour. |
| svgGroup_ | protected |
SVGGElement | null | The root SVG group for the button or label. |
| tabWidth_ |
|
number | |
| toolboxPosition_ | protected |
number | |
| width_ | protected |
number | Width of flyout. |
| workspace_ | protected |
WorkspaceSvg |
Methods
| Method | Modifiers | Description |
|---|---|---|
| autoHide(onlyClosePopups) | Automatically hides the flyout if it is an autoclosing flyout. | |
| canBeFocused() | See IFocusableNode.canBeFocused. | |
| createDom(tagName) | Creates the flyout's DOM. Only needs to be called once. The flyout can either exist as its own SVG element or be a g element nested inside a separate SVG element. | |
| dispose() | Dispose of this flyout. Unlink from all DOM elements to prevent memory leaks. | |
| getContents() | Get the list of elements of the current flyout. | |
| getFlyoutScale() | Get the scale (zoom level) of the flyout. By default, this matches the target workspace scale, but this can be overridden. | |
| getFocusableElement() | See IFocusableNode.getFocusableElement. | |
| getFocusableTree() | See IFocusableNode.getFocusableTree. | |
| getHeight() | Get the height of the flyout. | |
| getInflaterForType(type) | protected |
Returns the inflater responsible for constructing items of the given type. |
| getNestedTrees() | See IFocusableTree.getNestedTrees. | |
| getRestoredFocusableNode(_previousNode) | See IFocusableTree.getRestoredFocusableNode. | |
| getRootFocusableNode() | See IFocusableTree.getRootFocusableNode. | |
| getTargetWorkspace() | Get the target workspace inside the flyout. | |
| getWidth() | Get the width of the flyout. | |
| getWorkspace() | Get the workspace inside the flyout. | |
| getX() | abstract |
Calculates the x coordinate for the flyout position. |
| getY() | abstract |
Calculates the y coordinate for the flyout position. |
| hide() | Hide and empty the flyout. | |
| init(targetWorkspace) | Initializes the flyout. | |
| isDragTowardWorkspace(currentDragDeltaXY) | abstract |
Determine if a drag delta is toward the workspace, based on the position and orientation of the flyout. This is used in determineDragIntention_ to determine if a new block should be created or if the flyout should scroll. |
| isVisible() | Is the flyout visible? | |
| layout_(contents) |
|
Lay out the elements in the flyout. |
| lookUpFocusableNode(_id) | See IFocusableTree.lookUpFocusableNode. | |
| normalizeSeparators(contents) | protected |
Updates and returns the provided list of flyout contents to flatten separators as needed. When multiple separators occur one after another, the value of the last one takes precedence and the earlier separators in the group are removed. |
| onNodeBlur() | See IFocusableNode.onNodeBlur. | |
| onNodeFocus() | See IFocusableNode.onNodeFocus. | |
| onTreeBlur(nextTree) | See IFocusableTree.onTreeBlur. | |
| onTreeFocus(_node, _previousTree) | See IFocusableTree.onTreeFocus. | |
| position() | abstract |
Position the flyout. |
| positionAt_(width, height, x, y) | protected |
Update the view based on coordinates calculated in position(). |
| reflow() | Reflow flyout contents. | |
| reflowInternal_() |
|
Compute bounds of flyout. For RTL: Lay out the elements right-aligned. |
| scrollToStart() | abstract |
Scroll the flyout to the beginning of its contents. |
| serializeBlock(block) | protected |
Serialize a block to JSON. |
| setAutoClose(autoClose) | Sets whether this flyout automatically closes when blocks are dragged out, the workspace is clicked, etc, or not. | |
| setContainerVisible(visible) | Set whether this flyout's container is visible. | |
| setContents(contents) | Store the list of elements on the flyout. | |
| setMetrics_(xyRatio) |
|
Sets the translation of the flyout to match the scrollbars. |
| setVisible(visible) | Set whether the flyout is visible. A value of true does not necessarily mean that the flyout is shown. It could be hidden because its container is hidden. | |
| show(flyoutDef) | Show and populate the flyout. | |
| wheel_(e) |
|
Scroll the flyout. |