diff --git a/core/flyout_base.js b/core/flyout_base.js index 84d6d3870..594d83a9f 100644 --- a/core/flyout_base.js +++ b/core/flyout_base.js @@ -10,62 +10,67 @@ */ 'use strict'; -goog.provide('Blockly.Flyout'); +goog.module('Blockly.Flyout'); +goog.module.declareLegacyNamespace(); -goog.require('Blockly.Block'); +/* eslint-disable-next-line no-unused-vars */ +const Block = goog.require('Blockly.Block'); +/* eslint-disable-next-line no-unused-vars */ +const BlockSvg = goog.requireType('Blockly.BlockSvg'); +const ComponentManager = goog.require('Blockly.ComponentManager'); +const Coordinate = goog.require('Blockly.utils.Coordinate'); +const DeleteArea = goog.require('Blockly.DeleteArea'); +const Events = goog.require('Blockly.Events'); +const FlyoutButton = goog.require('Blockly.FlyoutButton'); +const FlyoutMetricsManager = goog.require('Blockly.FlyoutMetricsManager'); +/* eslint-disable-next-line no-unused-vars */ +const IFlyout = goog.require('Blockly.IFlyout'); +/* eslint-disable-next-line no-unused-vars */ +const Options = goog.requireType('Blockly.Options'); +const ScrollbarPair = goog.require('Blockly.ScrollbarPair'); +const Svg = goog.require('Blockly.utils.Svg'); +const Tooltip = goog.require('Blockly.Tooltip'); +const Variables = goog.require('Blockly.Variables'); +const WorkspaceSvg = goog.require('Blockly.WorkspaceSvg'); +const Xml = goog.require('Blockly.Xml'); +const browserEvents = goog.require('Blockly.browserEvents'); +const dom = goog.require('Blockly.utils.dom'); +const toolbox = goog.require('Blockly.utils.toolbox'); +const utils = goog.require('Blockly.utils'); +const utilsXml = goog.require('Blockly.utils.xml'); +const {hideChaff} = goog.require('Blockly'); /** @suppress {extraRequire} */ goog.require('Blockly.blockRendering'); -goog.require('Blockly.browserEvents'); -goog.require('Blockly.ComponentManager'); -goog.require('Blockly.DeleteArea'); -goog.require('Blockly.Events'); /** @suppress {extraRequire} */ goog.require('Blockly.Events.BlockCreate'); /** @suppress {extraRequire} */ goog.require('Blockly.Events.VarCreate'); -goog.require('Blockly.FlyoutMetricsManager'); /** @suppress {extraRequire} */ goog.require('Blockly.Gesture'); -goog.require('Blockly.IFlyout'); -goog.require('Blockly.ScrollbarPair'); -goog.require('Blockly.Tooltip'); /** @suppress {extraRequire} */ goog.require('Blockly.Touch'); -goog.require('Blockly.utils'); -goog.require('Blockly.utils.Coordinate'); -goog.require('Blockly.utils.dom'); -goog.require('Blockly.utils.Svg'); -goog.require('Blockly.utils.toolbox'); -goog.require('Blockly.utils.xml'); -goog.require('Blockly.WorkspaceSvg'); -goog.require('Blockly.Xml'); - -goog.requireType('Blockly.BlockSvg'); -goog.requireType('Blockly.FlyoutButton'); -goog.requireType('Blockly.Options'); -goog.requireType('Blockly.utils.Rect'); /** * Class for a flyout. - * @param {!Blockly.Options} workspaceOptions Dictionary of options for the + * @param {!Options} workspaceOptions Dictionary of options for the * workspace. * @constructor * @abstract - * @implements {Blockly.IFlyout} - * @extends {Blockly.DeleteArea} + * @implements {IFlyout} + * @extends {DeleteArea} */ -Blockly.Flyout = function(workspaceOptions) { - Blockly.Flyout.superClass_.constructor.call(this); +const Flyout = function(workspaceOptions) { + Flyout.superClass_.constructor.call(this); workspaceOptions.setMetrics = this.setMetrics_.bind(this); /** - * @type {!Blockly.WorkspaceSvg} + * @type {!WorkspaceSvg} * @protected */ - this.workspace_ = new Blockly.WorkspaceSvg(workspaceOptions); + this.workspace_ = new WorkspaceSvg(workspaceOptions); this.workspace_.setMetricsManager( - new Blockly.FlyoutMetricsManager(this.workspace_, this)); + new FlyoutMetricsManager(this.workspace_, this)); this.workspace_.isFlyout = true; // Keep the workspace visibility consistent with the flyout's visibility. @@ -76,7 +81,7 @@ Blockly.Flyout = function(workspaceOptions) { * ComponentManager. * @type {string} */ - this.id = Blockly.utils.genUid(); + this.id = utils.genUid(); /** * Is RTL vs LTR. @@ -115,7 +120,7 @@ Blockly.Flyout = function(workspaceOptions) { /** * List of visible buttons. - * @type {!Array} + * @type {!Array} * @protected */ this.buttons_ = []; @@ -129,7 +134,7 @@ Blockly.Flyout = function(workspaceOptions) { /** * List of blocks that should always be disabled. - * @type {!Array} + * @type {!Array} * @private */ this.permanentlyDisabled_ = []; @@ -144,46 +149,46 @@ Blockly.Flyout = function(workspaceOptions) { /** * The target workspace - * @type {?Blockly.WorkspaceSvg} + * @type {?WorkspaceSvg} * @package */ this.targetWorkspace = null; }; -Blockly.utils.object.inherits(Blockly.Flyout, Blockly.DeleteArea); +utils.object.inherits(Flyout, DeleteArea); /** * Does the flyout automatically close when a block is created? * @type {boolean} */ -Blockly.Flyout.prototype.autoClose = true; +Flyout.prototype.autoClose = true; /** * Whether the flyout is visible. * @type {boolean} * @private */ -Blockly.Flyout.prototype.isVisible_ = false; +Flyout.prototype.isVisible_ = false; /** * Whether the workspace containing this flyout is visible. * @type {boolean} * @private */ -Blockly.Flyout.prototype.containerVisible_ = true; +Flyout.prototype.containerVisible_ = true; /** * Corner radius of the flyout background. * @type {number} * @const */ -Blockly.Flyout.prototype.CORNER_RADIUS = 8; +Flyout.prototype.CORNER_RADIUS = 8; /** * Margin around the edges of the blocks in the flyout. * @type {number} * @const */ -Blockly.Flyout.prototype.MARGIN = Blockly.Flyout.prototype.CORNER_RADIUS; +Flyout.prototype.MARGIN = Flyout.prototype.CORNER_RADIUS; // TODO: Move GAP_X and GAP_Y to their appropriate files. @@ -192,35 +197,35 @@ Blockly.Flyout.prototype.MARGIN = Blockly.Flyout.prototype.CORNER_RADIUS; * element. * @const {number} */ -Blockly.Flyout.prototype.GAP_X = Blockly.Flyout.prototype.MARGIN * 3; +Flyout.prototype.GAP_X = Flyout.prototype.MARGIN * 3; /** * Gap between items in vertical flyouts. Can be overridden with the "sep" * element. * @const {number} */ -Blockly.Flyout.prototype.GAP_Y = Blockly.Flyout.prototype.MARGIN * 3; +Flyout.prototype.GAP_Y = Flyout.prototype.MARGIN * 3; /** * Top/bottom padding between scrollbar and edge of flyout background. * @type {number} * @const */ -Blockly.Flyout.prototype.SCROLLBAR_MARGIN = 2.5; +Flyout.prototype.SCROLLBAR_MARGIN = 2.5; /** * Width of flyout. * @type {number} * @protected */ -Blockly.Flyout.prototype.width_ = 0; +Flyout.prototype.width_ = 0; /** * Height of flyout. * @type {number} * @protected */ -Blockly.Flyout.prototype.height_ = 0; +Flyout.prototype.height_ = 0; /** * Range of a drag angle from a flyout considered "dragging toward workspace". @@ -237,20 +242,20 @@ Blockly.Flyout.prototype.height_ = 0; * flyout. Setting it to 360 means that all drags create a new block. * @type {number} * @protected -*/ -Blockly.Flyout.prototype.dragAngleRange_ = 70; + */ +Flyout.prototype.dragAngleRange_ = 70; /** * 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. * @param {string| - * !Blockly.utils.Svg| - * !Blockly.utils.Svg} tagName The type of tag to + * !Svg| + * !Svg} tagName The type of tag to * put the flyout in. This should be or . * @return {!SVGElement} The flyout's SVG group. */ -Blockly.Flyout.prototype.createDom = function(tagName) { +Flyout.prototype.createDom = function(tagName) { /* @@ -259,11 +264,10 @@ Blockly.Flyout.prototype.createDom = function(tagName) { */ // Setting style to display:none to start. The toolbox and flyout // hide/show code will set up proper visibility and size later. - this.svgGroup_ = Blockly.utils.dom.createSvgElement(tagName, - {'class': 'blocklyFlyout', 'style': 'display: none'}, null); - this.svgBackground_ = Blockly.utils.dom.createSvgElement( - Blockly.utils.Svg.PATH, - {'class': 'blocklyFlyoutBackground'}, this.svgGroup_); + this.svgGroup_ = dom.createSvgElement( + tagName, {'class': 'blocklyFlyout', 'style': 'display: none'}, null); + this.svgBackground_ = dom.createSvgElement( + Svg.PATH, {'class': 'blocklyFlyoutBackground'}, this.svgGroup_); this.svgGroup_.appendChild(this.workspace_.createDom()); this.workspace_.getThemeManager().subscribe( this.svgBackground_, 'flyoutBackgroundColour', 'fill'); @@ -274,14 +278,14 @@ Blockly.Flyout.prototype.createDom = function(tagName) { /** * Initializes the flyout. - * @param {!Blockly.WorkspaceSvg} targetWorkspace The workspace in which to + * @param {!WorkspaceSvg} targetWorkspace The workspace in which to * create new blocks. */ -Blockly.Flyout.prototype.init = function(targetWorkspace) { +Flyout.prototype.init = function(targetWorkspace) { this.targetWorkspace = targetWorkspace; this.workspace_.targetWorkspace = targetWorkspace; - this.workspace_.scrollbar = new Blockly.ScrollbarPair( + this.workspace_.scrollbar = new ScrollbarPair( this.workspace_, this.horizontalLayout, !this.horizontalLayout, 'blocklyFlyoutScrollbar', this.SCROLLBAR_MARGIN); @@ -289,7 +293,7 @@ Blockly.Flyout.prototype.init = function(targetWorkspace) { Array.prototype.push.apply( this.eventWrappers_, - Blockly.browserEvents.conditionalBind( + browserEvents.conditionalBind( this.svgGroup_, 'wheel', this, this.wheel_)); if (!this.autoClose) { this.filterWrapper_ = this.filterForCapacity_.bind(this); @@ -299,7 +303,7 @@ Blockly.Flyout.prototype.init = function(targetWorkspace) { // Dragging the flyout up and down. Array.prototype.push.apply( this.eventWrappers_, - Blockly.browserEvents.conditionalBind( + browserEvents.conditionalBind( this.svgBackground_, 'mousedown', this, this.onMouseDown_)); // A flyout connected to a workspace doesn't have its own current gesture. @@ -315,8 +319,8 @@ Blockly.Flyout.prototype.init = function(targetWorkspace) { component: this, weight: 1, capabilities: [ - Blockly.ComponentManager.Capability.DELETE_AREA, - Blockly.ComponentManager.Capability.DRAG_TARGET + ComponentManager.Capability.DELETE_AREA, + ComponentManager.Capability.DRAG_TARGET ] }); }; @@ -326,10 +330,10 @@ Blockly.Flyout.prototype.init = function(targetWorkspace) { * Unlink from all DOM elements to prevent memory leaks. * @suppress {checkTypes} */ -Blockly.Flyout.prototype.dispose = function() { +Flyout.prototype.dispose = function() { this.hide(); this.workspace_.getComponentManager().removeComponent(this.id); - Blockly.browserEvents.unbind(this.eventWrappers_); + browserEvents.unbind(this.eventWrappers_); if (this.filterWrapper_) { this.targetWorkspace.removeChangeListener(this.filterWrapper_); this.filterWrapper_ = null; @@ -341,7 +345,7 @@ Blockly.Flyout.prototype.dispose = function() { this.workspace_ = null; } if (this.svgGroup_) { - Blockly.utils.dom.removeNode(this.svgGroup_); + dom.removeNode(this.svgGroup_); this.svgGroup_ = null; } this.svgBackground_ = null; @@ -352,7 +356,7 @@ Blockly.Flyout.prototype.dispose = function() { * Get the width of the flyout. * @return {number} The width of the flyout. */ -Blockly.Flyout.prototype.getWidth = function() { +Flyout.prototype.getWidth = function() { return this.width_; }; @@ -360,7 +364,7 @@ Blockly.Flyout.prototype.getWidth = function() { * Get the height of the flyout. * @return {number} The width of the flyout. */ -Blockly.Flyout.prototype.getHeight = function() { +Flyout.prototype.getHeight = function() { return this.height_; }; @@ -369,16 +373,16 @@ Blockly.Flyout.prototype.getHeight = function() { * this matches the target workspace scale, but this can be overridden. * @return {number} Flyout workspace scale. */ -Blockly.Flyout.prototype.getFlyoutScale = function() { +Flyout.prototype.getFlyoutScale = function() { return this.targetWorkspace.scale; }; /** * Get the workspace inside the flyout. - * @return {!Blockly.WorkspaceSvg} The workspace inside the flyout. + * @return {!WorkspaceSvg} The workspace inside the flyout. * @package */ -Blockly.Flyout.prototype.getWorkspace = function() { +Flyout.prototype.getWorkspace = function() { return this.workspace_; }; @@ -386,7 +390,7 @@ Blockly.Flyout.prototype.getWorkspace = function() { * Is the flyout visible? * @return {boolean} True if visible. */ -Blockly.Flyout.prototype.isVisible = function() { +Flyout.prototype.isVisible = function() { return this.isVisible_; }; @@ -395,8 +399,8 @@ Blockly.Flyout.prototype.isVisible = function() { * that the flyout is shown. It could be hidden because its container is hidden. * @param {boolean} visible True if visible. */ -Blockly.Flyout.prototype.setVisible = function(visible) { - var visibilityChanged = (visible != this.isVisible()); +Flyout.prototype.setVisible = function(visible) { + const visibilityChanged = (visible != this.isVisible()); this.isVisible_ = visible; if (visibilityChanged) { @@ -413,8 +417,8 @@ Blockly.Flyout.prototype.setVisible = function(visible) { * Set whether this flyout's container is visible. * @param {boolean} visible Whether the container is visible. */ -Blockly.Flyout.prototype.setContainerVisible = function(visible) { - var visibilityChanged = (visible != this.containerVisible_); +Flyout.prototype.setContainerVisible = function(visible) { + const visibilityChanged = (visible != this.containerVisible_); this.containerVisible_ = visible; if (visibilityChanged) { this.updateDisplay_(); @@ -426,8 +430,8 @@ Blockly.Flyout.prototype.setContainerVisible = function(visible) { * be visible and whether its containing workspace is visible. * @private */ -Blockly.Flyout.prototype.updateDisplay_ = function() { - var show = true; +Flyout.prototype.updateDisplay_ = function() { + let show = true; if (!this.containerVisible_) { show = false; } else { @@ -447,23 +451,23 @@ Blockly.Flyout.prototype.updateDisplay_ = function() { * @param {number} y The computed y origin of the flyout's SVG group. * @protected */ -Blockly.Flyout.prototype.positionAt_ = function(width, height, x, y) { - this.svgGroup_.setAttribute("width", width); - this.svgGroup_.setAttribute("height", height); +Flyout.prototype.positionAt_ = function(width, height, x, y) { + this.svgGroup_.setAttribute('width', width); + this.svgGroup_.setAttribute('height', height); this.workspace_.setCachedParentSvgSize(width, height); if (this.svgGroup_.tagName == 'svg') { - var transform = 'translate(' + x + 'px,' + y + 'px)'; - Blockly.utils.dom.setCssTransform(this.svgGroup_, transform); + const transform = 'translate(' + x + 'px,' + y + 'px)'; + dom.setCssTransform(this.svgGroup_, transform); } else { // IE and Edge don't support CSS transforms on SVG elements so // it's important to set the transform on the SVG element itself - var transform = 'translate(' + x + ',' + y + ')'; - this.svgGroup_.setAttribute("transform", transform); + const transform = 'translate(' + x + ',' + y + ')'; + this.svgGroup_.setAttribute('transform', transform); } // Update the scrollbar (if one exists). - var scrollbar = this.workspace_.scrollbar; + const scrollbar = this.workspace_.scrollbar; if (scrollbar) { // Set the scrollbars origin to be the top left of the flyout. scrollbar.setOrigin(x, y); @@ -477,7 +481,6 @@ Blockly.Flyout.prototype.positionAt_ = function(width, height, x, y) { if (scrollbar.vScroll) { scrollbar.vScroll.setPosition( scrollbar.vScroll.position.x, scrollbar.vScroll.position.y); - } } }; @@ -485,14 +488,14 @@ Blockly.Flyout.prototype.positionAt_ = function(width, height, x, y) { /** * Hide and empty the flyout. */ -Blockly.Flyout.prototype.hide = function() { +Flyout.prototype.hide = function() { if (!this.isVisible()) { return; } this.setVisible(false); // Delete all the event listeners. - for (var i = 0, listen; (listen = this.listeners_[i]); i++) { - Blockly.browserEvents.unbind(listen); + for (let i = 0, listen; (listen = this.listeners_[i]); i++) { + browserEvents.unbind(listen); } this.listeners_.length = 0; if (this.reflowWrapper_) { @@ -505,11 +508,11 @@ Blockly.Flyout.prototype.hide = function() { /** * Show and populate the flyout. - * @param {!Blockly.utils.toolbox.FlyoutDefinition|string} flyoutDef Contents to display + * @param {!toolbox.FlyoutDefinition|string} flyoutDef Contents to display * in the flyout. This is either an array of Nodes, a NodeList, a * toolbox definition, or a string with the name of the dynamic category. */ -Blockly.Flyout.prototype.show = function(flyoutDef) { +Flyout.prototype.show = function(flyoutDef) { this.workspace_.setResizesEnabled(false); this.hide(); this.clearOldBlocks_(); @@ -521,23 +524,23 @@ Blockly.Flyout.prototype.show = function(flyoutDef) { this.setVisible(true); // Parse the Array, Node or NodeList into a a list of flyout items. - var parsedContent = Blockly.utils.toolbox.convertFlyoutDefToJsonArray(flyoutDef); - var flyoutInfo = - /** @type {{contents:!Array, gaps:!Array}} */ ( - this.createFlyoutInfo_(parsedContent)); + const parsedContent = toolbox.convertFlyoutDefToJsonArray(flyoutDef); + const flyoutInfo = + /** @type {{contents:!Array, gaps:!Array}} */ ( + this.createFlyoutInfo_(parsedContent)); this.layout_(flyoutInfo.contents, flyoutInfo.gaps); // IE 11 is an incompetent browser that fails to fire mouseout events. // When the mouse is over the background, deselect all blocks. - var deselectAll = function() { - var topBlocks = this.workspace_.getTopBlocks(false); - for (var i = 0, block; (block = topBlocks[i]); i++) { + const deselectAll = function() { + const topBlocks = this.workspace_.getTopBlocks(false); + for (let i = 0, block; (block = topBlocks[i]); i++) { block.removeSelect(); } }; - this.listeners_.push(Blockly.browserEvents.conditionalBind( + this.listeners_.push(browserEvents.conditionalBind( this.svgBackground_, 'mouseover', this, deselectAll)); if (this.horizontalLayout) { @@ -560,57 +563,63 @@ Blockly.Flyout.prototype.show = function(flyoutDef) { /** * Create the contents array and gaps array necessary to create the layout for * the flyout. - * @param {!Blockly.utils.toolbox.FlyoutItemInfoArray} parsedContent The array + * @param {!toolbox.FlyoutItemInfoArray} parsedContent The array * of objects to show in the flyout. * @return {{contents:Array, gaps:Array}} The list of contents * and gaps needed to lay out the flyout. * @private */ -Blockly.Flyout.prototype.createFlyoutInfo_ = function(parsedContent) { - var contents = []; - var gaps = []; +Flyout.prototype.createFlyoutInfo_ = function(parsedContent) { + const contents = []; + const gaps = []; this.permanentlyDisabled_.length = 0; - var defaultGap = this.horizontalLayout ? this.GAP_X : this.GAP_Y; - for (var i = 0, contentInfo; (contentInfo = parsedContent[i]); i++) { - + const defaultGap = this.horizontalLayout ? this.GAP_X : this.GAP_Y; + for (let i = 0, contentInfo; (contentInfo = parsedContent[i]); i++) { if (contentInfo['custom']) { - var customInfo = /** @type {!Blockly.utils.toolbox.DynamicCategoryInfo} */ (contentInfo); - var categoryName = customInfo['custom']; - var flyoutDef = this.getDynamicCategoryContents_(categoryName); - var parsedDynamicContent = /** @type {!Blockly.utils.toolbox.FlyoutItemInfoArray} */ - (Blockly.utils.toolbox.convertFlyoutDefToJsonArray(flyoutDef)); - parsedContent.splice.apply(parsedContent, [i, 1].concat(parsedDynamicContent)); + const customInfo = + /** @type {!toolbox.DynamicCategoryInfo} */ (contentInfo); + const categoryName = customInfo['custom']; + const flyoutDef = this.getDynamicCategoryContents_(categoryName); + const parsedDynamicContent = /** @type {!toolbox.FlyoutItemInfoArray} */ + (toolbox.convertFlyoutDefToJsonArray(flyoutDef)); + parsedContent.splice.apply( + parsedContent, [i, 1].concat(parsedDynamicContent)); contentInfo = parsedContent[i]; } switch (contentInfo['kind'].toUpperCase()) { - case 'BLOCK': - var blockInfo = /** @type {!Blockly.utils.toolbox.BlockInfo} */ (contentInfo); - var blockXml = this.getBlockXml_(blockInfo); - var block = this.createBlock_(blockXml); + case 'BLOCK': { + const blockInfo = /** @type {!toolbox.BlockInfo} */ (contentInfo); + const blockXml = this.getBlockXml_(blockInfo); + const block = this.createBlock_(blockXml); // This is a deprecated method for adding gap to a block. // - var gap = parseInt(blockInfo['gap'] || blockXml.getAttribute('gap'), 10); + const gap = + parseInt(blockInfo['gap'] || blockXml.getAttribute('gap'), 10); gaps.push(isNaN(gap) ? defaultGap : gap); contents.push({type: 'block', block: block}); break; - case 'SEP': - var sepInfo = /** @type {!Blockly.utils.toolbox.SeparatorInfo} */ (contentInfo); + } + case 'SEP': { + const sepInfo = /** @type {!toolbox.SeparatorInfo} */ (contentInfo); this.addSeparatorGap_(sepInfo, gaps, defaultGap); break; - case 'LABEL': - var labelInfo = /** @type {!Blockly.utils.toolbox.LabelInfo} */ (contentInfo); + } + case 'LABEL': { + const labelInfo = /** @type {!toolbox.LabelInfo} */ (contentInfo); // A label is a button with different styling. - var label = this.createButton_(labelInfo, /** isLabel */ true); + const label = this.createButton_(labelInfo, /** isLabel */ true); contents.push({type: 'button', button: label}); gaps.push(defaultGap); break; - case 'BUTTON': - var buttonInfo = /** @type {!Blockly.utils.toolbox.ButtonInfo} */ (contentInfo); - var button = this.createButton_(buttonInfo, /** isLabel */ false); + } + case 'BUTTON': { + const buttonInfo = /** @type {!toolbox.ButtonInfo} */ (contentInfo); + const button = this.createButton_(buttonInfo, /** isLabel */ false); contents.push({type: 'button', button: button}); gaps.push(defaultGap); break; + } } } return {contents: contents, gaps: gaps}; @@ -622,38 +631,40 @@ Blockly.Flyout.prototype.createFlyoutInfo_ = function(parsedContent) { * @return {!Array} The array of flyout items. * @private */ -Blockly.Flyout.prototype.getDynamicCategoryContents_ = function(categoryName) { +Flyout.prototype.getDynamicCategoryContents_ = function(categoryName) { // Look up the correct category generation function and call that to get a // valid XML list. - var fnToApply = this.workspace_.targetWorkspace.getToolboxCategoryCallback( - categoryName); + const fnToApply = + this.workspace_.targetWorkspace.getToolboxCategoryCallback(categoryName); if (typeof fnToApply != 'function') { - throw TypeError('Couldn\'t find a callback function when opening' + + throw TypeError( + 'Couldn\'t find a callback function when opening' + ' a toolbox category.'); } - var flyoutDef = fnToApply(this.workspace_.targetWorkspace); + const flyoutDef = fnToApply(this.workspace_.targetWorkspace); if (!Array.isArray(flyoutDef)) { - throw new TypeError('Result of toolbox category callback must be an array.'); + throw new TypeError( + 'Result of toolbox category callback must be an array.'); } return flyoutDef; }; /** * Creates a flyout button or a flyout label. - * @param {!Blockly.utils.toolbox.ButtonOrLabelInfo} btnInfo + * @param {!toolbox.ButtonOrLabelInfo} btnInfo * The object holding information about a button or a label. * @param {boolean} isLabel True if the button is a label, false otherwise. - * @return {!Blockly.FlyoutButton} The object used to display the button in the + * @return {!FlyoutButton} The object used to display the button in the * flyout. * @private */ -Blockly.Flyout.prototype.createButton_ = function(btnInfo, isLabel) { - if (!Blockly.FlyoutButton) { +Flyout.prototype.createButton_ = function(btnInfo, isLabel) { + if (!FlyoutButton) { throw Error('Missing require for Blockly.FlyoutButton'); } - var curButton = new Blockly.FlyoutButton(this.workspace_, - /** @type {!Blockly.WorkspaceSvg} */ (this.targetWorkspace), btnInfo, - isLabel); + const curButton = new FlyoutButton( + this.workspace_, + /** @type {!WorkspaceSvg} */ (this.targetWorkspace), btnInfo, isLabel); return curButton; }; @@ -661,12 +672,12 @@ Blockly.Flyout.prototype.createButton_ = function(btnInfo, isLabel) { * Create a block from the xml and permanently disable any blocks that were * defined as disabled. * @param {!Element} blockXml The xml of the block. - * @return {!Blockly.BlockSvg} The block created from the blockXml. + * @return {!BlockSvg} The block created from the blockXml. * @protected */ -Blockly.Flyout.prototype.createBlock_ = function(blockXml) { - var curBlock = /** @type {!Blockly.BlockSvg} */ ( - Blockly.Xml.domToBlock(blockXml, this.workspace_)); +Flyout.prototype.createBlock_ = function(blockXml) { + const curBlock = + /** @type {!BlockSvg} */ (Xml.domToBlock(blockXml, this.workspace_)); if (!curBlock.isEnabled()) { // Record blocks that were initially disabled. // Do not enable these blocks as a result of capacity filtering. @@ -677,48 +688,50 @@ Blockly.Flyout.prototype.createBlock_ = function(blockXml) { /** * Get the xml from the block info object. - * @param {!Blockly.utils.toolbox.BlockInfo} blockInfo The object holding + * @param {!toolbox.BlockInfo} blockInfo The object holding * information about a block. * @return {!Element} The xml for the block. * @throws {Error} if the xml is not a valid block definition. * @private */ -Blockly.Flyout.prototype.getBlockXml_ = function(blockInfo) { - var blockElement = null; - var blockXml = blockInfo['blockxml']; +Flyout.prototype.getBlockXml_ = function(blockInfo) { + let blockElement = null; + const blockXml = blockInfo['blockxml']; if (blockXml && typeof blockXml != 'string') { blockElement = blockXml; } else if (blockXml && typeof blockXml == 'string') { - blockElement = Blockly.Xml.textToDom(blockXml); + blockElement = Xml.textToDom(blockXml); blockInfo['blockxml'] = blockElement; } else if (blockInfo['type']) { - blockElement = Blockly.utils.xml.createElement('xml'); + blockElement = utilsXml.createElement('xml'); blockElement.setAttribute('type', blockInfo['type']); blockElement.setAttribute('disabled', blockInfo['disabled']); blockInfo['blockxml'] = blockElement; } if (!blockElement) { - throw Error('Error: Invalid block definition. Block definition must have blockxml or type.'); + throw Error( + 'Error: Invalid block definition. Block definition must have blockxml or type.'); } return blockElement; }; /** * Add the necessary gap in the flyout for a separator. - * @param {!Blockly.utils.toolbox.SeparatorInfo} sepInfo The object holding + * @param {!toolbox.SeparatorInfo} sepInfo The object holding * information about a separator. * @param {!Array} gaps The list gaps between items in the flyout. - * @param {number} defaultGap The default gap between the button and next element. + * @param {number} defaultGap The default gap between the button and next + * element. * @private */ -Blockly.Flyout.prototype.addSeparatorGap_ = function(sepInfo, gaps, defaultGap) { +Flyout.prototype.addSeparatorGap_ = function(sepInfo, gaps, defaultGap) { // Change the gap between two toolbox elements. // // The default gap is 24, can be set larger or smaller. // This overwrites the gap attribute on the previous element. - var newGap = parseInt(sepInfo['gap'], 10); + const newGap = parseInt(sepInfo['gap'], 10); // Ignore gaps before the first block. if (!isNaN(newGap) && gaps.length > 0) { gaps[gaps.length - 1] = newGap; @@ -731,25 +744,25 @@ Blockly.Flyout.prototype.addSeparatorGap_ = function(sepInfo, gaps, defaultGap) * Delete blocks, mats and buttons from a previous showing of the flyout. * @protected */ -Blockly.Flyout.prototype.clearOldBlocks_ = function() { +Flyout.prototype.clearOldBlocks_ = function() { // Delete any blocks from a previous showing. - var oldBlocks = this.workspace_.getTopBlocks(false); - for (var i = 0, block; (block = oldBlocks[i]); i++) { + const oldBlocks = this.workspace_.getTopBlocks(false); + for (let i = 0, block; (block = oldBlocks[i]); i++) { if (block.workspace == this.workspace_) { block.dispose(false, false); } } // Delete any mats from a previous showing. - for (var j = 0; j < this.mats_.length; j++) { - var rect = this.mats_[j]; + for (let j = 0; j < this.mats_.length; j++) { + const rect = this.mats_[j]; if (rect) { - Blockly.Tooltip.unbindMouseEvents(rect); - Blockly.utils.dom.removeNode(rect); + Tooltip.unbindMouseEvents(rect); + dom.removeNode(rect); } } this.mats_.length = 0; // Delete any buttons from a previous showing. - for (var i = 0, button; (button = this.buttons_[i]); i++) { + for (let i = 0, button; (button = this.buttons_[i]); i++) { button.dispose(); } this.buttons_.length = 0; @@ -761,36 +774,36 @@ Blockly.Flyout.prototype.clearOldBlocks_ = function() { /** * Add listeners to a block that has been added to the flyout. * @param {!SVGElement} root The root node of the SVG group the block is in. - * @param {!Blockly.BlockSvg} block The block to add listeners for. + * @param {!BlockSvg} block The block to add listeners for. * @param {!SVGElement} rect The invisible rectangle under the block that acts * as a mat for that block. * @protected */ -Blockly.Flyout.prototype.addBlockListeners_ = function(root, block, rect) { - this.listeners_.push(Blockly.browserEvents.conditionalBind( +Flyout.prototype.addBlockListeners_ = function(root, block, rect) { + this.listeners_.push(browserEvents.conditionalBind( root, 'mousedown', null, this.blockMouseDown_(block))); - this.listeners_.push(Blockly.browserEvents.conditionalBind( + this.listeners_.push(browserEvents.conditionalBind( rect, 'mousedown', null, this.blockMouseDown_(block))); this.listeners_.push( - Blockly.browserEvents.bind(root, 'mouseenter', block, block.addSelect)); - this.listeners_.push(Blockly.browserEvents.bind( - root, 'mouseleave', block, block.removeSelect)); + browserEvents.bind(root, 'mouseenter', block, block.addSelect)); this.listeners_.push( - Blockly.browserEvents.bind(rect, 'mouseenter', block, block.addSelect)); - this.listeners_.push(Blockly.browserEvents.bind( - rect, 'mouseleave', block, block.removeSelect)); + browserEvents.bind(root, 'mouseleave', block, block.removeSelect)); + this.listeners_.push( + browserEvents.bind(rect, 'mouseenter', block, block.addSelect)); + this.listeners_.push( + browserEvents.bind(rect, 'mouseleave', block, block.removeSelect)); }; /** * Handle a mouse-down on an SVG block in a non-closing flyout. - * @param {!Blockly.BlockSvg} block The flyout block to copy. + * @param {!BlockSvg} block The flyout block to copy. * @return {!Function} Function to call when block is clicked. * @private */ -Blockly.Flyout.prototype.blockMouseDown_ = function(block) { - var flyout = this; +Flyout.prototype.blockMouseDown_ = function(block) { + const flyout = this; return function(e) { - var gesture = flyout.targetWorkspace.getGesture(e); + const gesture = flyout.targetWorkspace.getGesture(e); if (gesture) { gesture.setStartBlock(block); gesture.handleFlyoutStart(e, flyout); @@ -803,8 +816,8 @@ Blockly.Flyout.prototype.blockMouseDown_ = function(block) { * @param {!Event} e Mouse down event. * @private */ -Blockly.Flyout.prototype.onMouseDown_ = function(e) { - var gesture = this.targetWorkspace.getGesture(e); +Flyout.prototype.onMouseDown_ = function(e) { + const gesture = this.targetWorkspace.getGesture(e); if (gesture) { gesture.handleFlyoutStart(e, this); } @@ -813,52 +826,50 @@ Blockly.Flyout.prototype.onMouseDown_ = function(e) { /** * Does this flyout allow you to create a new instance of the given block? * Used for deciding if a block can be "dragged out of" the flyout. - * @param {!Blockly.BlockSvg} block The block to copy from the flyout. + * @param {!BlockSvg} block The block to copy from the flyout. * @return {boolean} True if you can create a new instance of the block, false * otherwise. * @package */ -Blockly.Flyout.prototype.isBlockCreatable_ = function(block) { +Flyout.prototype.isBlockCreatable_ = function(block) { return block.isEnabled(); }; /** * Create a copy of this block on the workspace. - * @param {!Blockly.BlockSvg} originalBlock The block to copy from the flyout. - * @return {!Blockly.BlockSvg} The newly created block. + * @param {!BlockSvg} originalBlock The block to copy from the flyout. + * @return {!BlockSvg} The newly created block. * @throws {Error} if something went wrong with deserialization. * @package */ -Blockly.Flyout.prototype.createBlock = function(originalBlock) { - var newBlock = null; - Blockly.Events.disable(); - var variablesBeforeCreation = this.targetWorkspace.getAllVariables(); +Flyout.prototype.createBlock = function(originalBlock) { + let newBlock = null; + Events.disable(); + const variablesBeforeCreation = this.targetWorkspace.getAllVariables(); this.targetWorkspace.setResizesEnabled(false); try { newBlock = this.placeNewBlock_(originalBlock); } finally { - Blockly.Events.enable(); + Events.enable(); } // Close the flyout. - Blockly.hideChaff(); + hideChaff(); - var newVariables = Blockly.Variables.getAddedVariables(this.targetWorkspace, - variablesBeforeCreation); + const newVariables = Variables.getAddedVariables( + this.targetWorkspace, variablesBeforeCreation); - if (Blockly.Events.isEnabled()) { - Blockly.Events.setGroup(true); + if (Events.isEnabled()) { + Events.setGroup(true); // Fire a VarCreate event for each (if any) new variable created. - for (var i = 0; i < newVariables.length; i++) { - var thisVariable = newVariables[i]; - Blockly.Events.fire( - new (Blockly.Events.get(Blockly.Events.VAR_CREATE))(thisVariable)); + for (let i = 0; i < newVariables.length; i++) { + const thisVariable = newVariables[i]; + Events.fire(new (Events.get(Events.VAR_CREATE))(thisVariable)); } // Block events come after var events, in case they refer to newly created // variables. - Blockly.Events.fire( - new (Blockly.Events.get(Blockly.Events.BLOCK_CREATE))(newBlock)); + Events.fire(new (Events.get(Events.BLOCK_CREATE))(newBlock)); } if (this.autoClose) { this.hide(); @@ -871,18 +882,18 @@ Blockly.Flyout.prototype.createBlock = function(originalBlock) { /** * Initialize the given button: move it to the correct location, * add listeners, etc. - * @param {!Blockly.FlyoutButton} button The button to initialize and place. + * @param {!FlyoutButton} button The button to initialize and place. * @param {number} x The x position of the cursor during this layout pass. * @param {number} y The y position of the cursor during this layout pass. * @protected */ -Blockly.Flyout.prototype.initFlyoutButton_ = function(button, x, y) { - var buttonSvg = button.createDom(); +Flyout.prototype.initFlyoutButton_ = function(button, x, y) { + const buttonSvg = button.createDom(); button.moveTo(x, y); button.show(); // Clicking on a flyout button or label is a lot like clicking on the // flyout background. - this.listeners_.push(Blockly.browserEvents.conditionalBind( + this.listeners_.push(browserEvents.conditionalBind( buttonSvg, 'mousedown', this, this.onMouseDown_)); this.buttons_.push(button); @@ -890,7 +901,7 @@ Blockly.Flyout.prototype.initFlyoutButton_ = function(button, x, y) { /** * Create and place a rectangle corresponding to the given block. - * @param {!Blockly.BlockSvg} block The block to associate the rect to. + * @param {!BlockSvg} block The block to associate the rect to. * @param {number} x The x position of the cursor during this layout pass. * @param {number} y The y position of the cursor during this layout pass. * @param {!{height: number, width: number}} blockHW The height and width of the @@ -901,20 +912,20 @@ Blockly.Flyout.prototype.initFlyoutButton_ = function(button, x, y) { * block. * @protected */ -Blockly.Flyout.prototype.createRect_ = function(block, x, y, blockHW, index) { +Flyout.prototype.createRect_ = function(block, x, y, blockHW, index) { // Create an invisible rectangle under the block to act as a button. Just // using the block as a button is poor, since blocks have holes in them. - var rect = Blockly.utils.dom.createSvgElement( - Blockly.utils.Svg.RECT, - { + const rect = dom.createSvgElement( + Svg.RECT, { 'fill-opacity': 0, 'x': x, 'y': y, 'height': blockHW.height, 'width': blockHW.width - }, null); + }, + null); rect.tooltip = block; - Blockly.Tooltip.bindMouseEvents(rect); + Tooltip.bindMouseEvents(rect); // Add the rectangles under the blocks, so that the blocks' tooltips work. this.workspace_.getCanvas().insertBefore(rect, block.getSvgRoot()); @@ -927,15 +938,15 @@ Blockly.Flyout.prototype.createRect_ = function(block, x, y, blockHW, index) { * Move a rectangle to sit exactly behind a block, taking into account tabs, * hats, and any other protrusions we invent. * @param {!SVGElement} rect The rectangle to move directly behind the block. - * @param {!Blockly.BlockSvg} block The block the rectangle should be behind. + * @param {!BlockSvg} block The block the rectangle should be behind. * @protected */ -Blockly.Flyout.prototype.moveRectToBlock_ = function(rect, block) { - var blockHW = block.getHeightWidth(); +Flyout.prototype.moveRectToBlock_ = function(rect, block) { + const blockHW = block.getHeightWidth(); rect.setAttribute('width', blockHW.width); rect.setAttribute('height', blockHW.height); - var blockXY = block.getRelativeToSurfaceXY(); + const blockXY = block.getRelativeToSurfaceXY(); rect.setAttribute('y', blockXY.y); rect.setAttribute('x', this.RTL ? blockXY.x - blockHW.width : blockXY.x); }; @@ -946,12 +957,12 @@ Blockly.Flyout.prototype.moveRectToBlock_ = function(rect, block) { * the workspace, an "a + b" block that has two shadow blocks would be disabled. * @private */ -Blockly.Flyout.prototype.filterForCapacity_ = function() { - var blocks = this.workspace_.getTopBlocks(false); - for (var i = 0, block; (block = blocks[i]); i++) { +Flyout.prototype.filterForCapacity_ = function() { + const blocks = this.workspace_.getTopBlocks(false); + for (let i = 0, block; (block = blocks[i]); i++) { if (this.permanentlyDisabled_.indexOf(block) == -1) { - var enable = this.targetWorkspace - .isCapacityAvailable(Blockly.utils.getBlockTypeCounts(block)); + const enable = this.targetWorkspace.isCapacityAvailable( + utils.getBlockTypeCounts(block)); while (block) { block.setEnabled(enable); block = block.getNextBlock(); @@ -963,7 +974,7 @@ Blockly.Flyout.prototype.filterForCapacity_ = function() { /** * Reflow blocks and their mats. */ -Blockly.Flyout.prototype.reflow = function() { +Flyout.prototype.reflow = function() { if (this.reflowWrapper_) { this.workspace_.removeChangeListener(this.reflowWrapper_); } @@ -978,63 +989,62 @@ Blockly.Flyout.prototype.reflow = function() { * dragging. * @package */ -Blockly.Flyout.prototype.isScrollable = function() { - return this.workspace_.scrollbar ? - this.workspace_.scrollbar.isVisible() : false; +Flyout.prototype.isScrollable = function() { + return this.workspace_.scrollbar ? this.workspace_.scrollbar.isVisible() : + false; }; /** * Copy a block from the flyout to the workspace and position it correctly. - * @param {!Blockly.BlockSvg} oldBlock The flyout block to copy. - * @return {!Blockly.BlockSvg} The new block in the main workspace. + * @param {!BlockSvg} oldBlock The flyout block to copy. + * @return {!BlockSvg} The new block in the main workspace. * @private */ -Blockly.Flyout.prototype.placeNewBlock_ = function(oldBlock) { - var targetWorkspace = this.targetWorkspace; - var svgRootOld = oldBlock.getSvgRoot(); +Flyout.prototype.placeNewBlock_ = function(oldBlock) { + const targetWorkspace = this.targetWorkspace; + const svgRootOld = oldBlock.getSvgRoot(); if (!svgRootOld) { throw Error('oldBlock is not rendered.'); } // Create the new block by cloning the block in the flyout (via XML). // This cast assumes that the oldBlock can not be an insertion marker. - var xml = /** @type {!Element} */ (Blockly.Xml.blockToDom(oldBlock, true)); + const xml = /** @type {!Element} */ (Xml.blockToDom(oldBlock, true)); // The target workspace would normally resize during domToBlock, which will // lead to weird jumps. Save it for terminateDrag. targetWorkspace.setResizesEnabled(false); // Using domToBlock instead of domToWorkspace means that the new block will be // placed at position (0, 0) in main workspace units. - var block = /** @type {!Blockly.BlockSvg} */ - (Blockly.Xml.domToBlock(xml, targetWorkspace)); - var svgRootNew = block.getSvgRoot(); + const block = /** @type {!BlockSvg} */ + (Xml.domToBlock(xml, targetWorkspace)); + const svgRootNew = block.getSvgRoot(); if (!svgRootNew) { throw Error('block is not rendered.'); } // The offset in pixels between the main workspace's origin and the upper left // corner of the injection div. - var mainOffsetPixels = targetWorkspace.getOriginOffsetInPixels(); + const mainOffsetPixels = targetWorkspace.getOriginOffsetInPixels(); // The offset in pixels between the flyout workspace's origin and the upper // left corner of the injection div. - var flyoutOffsetPixels = this.workspace_.getOriginOffsetInPixels(); + const flyoutOffsetPixels = this.workspace_.getOriginOffsetInPixels(); // The position of the old block in flyout workspace coordinates. - var oldBlockPos = oldBlock.getRelativeToSurfaceXY(); + const oldBlockPos = oldBlock.getRelativeToSurfaceXY(); // The position of the old block in pixels relative to the flyout // workspace's origin. oldBlockPos.scale(this.workspace_.scale); // The position of the old block in pixels relative to the upper left corner // of the injection div. - var oldBlockOffsetPixels = Blockly.utils.Coordinate.sum(flyoutOffsetPixels, - oldBlockPos); + const oldBlockOffsetPixels = Coordinate.sum(flyoutOffsetPixels, oldBlockPos); // The position of the old block in pixels relative to the origin of the // main workspace. - var finalOffset = Blockly.utils.Coordinate.difference(oldBlockOffsetPixels, - mainOffsetPixels); + const finalOffset = + Coordinate.difference(oldBlockOffsetPixels, mainOffsetPixels); // The position of the old block in main workspace coordinates. finalOffset.scale(1 / targetWorkspace.scale); @@ -1045,26 +1055,26 @@ Blockly.Flyout.prototype.placeNewBlock_ = function(oldBlock) { /** * Returns the bounding rectangle of the drag target area in pixel units * relative to viewport. - * @return {Blockly.utils.Rect} The component's bounding box. + * @return {utils.Rect} The component's bounding box. */ -Blockly.Flyout.prototype.getClientRect; +Flyout.prototype.getClientRect; /** * Position the flyout. * @return {void} */ -Blockly.Flyout.prototype.position; +Flyout.prototype.position; /** * 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. - * @param {!Blockly.utils.Coordinate} currentDragDeltaXY How far the pointer has + * @param {!Coordinate} currentDragDeltaXY How far the pointer has * moved from the position at mouse down, in pixel units. * @return {boolean} True if the drag is toward the workspace. * @package */ -Blockly.Flyout.prototype.isDragTowardWorkspace; +Flyout.prototype.isDragTowardWorkspace; /** * Sets the translation of the flyout to match the scrollbars. @@ -1073,7 +1083,7 @@ Blockly.Flyout.prototype.isDragTowardWorkspace; * similar x property. * @protected */ -Blockly.Flyout.prototype.setMetrics_; +Flyout.prototype.setMetrics_; /** * Lay out the blocks in the flyout. @@ -1081,14 +1091,14 @@ Blockly.Flyout.prototype.setMetrics_; * @param {!Array} gaps The visible gaps between blocks. * @protected */ -Blockly.Flyout.prototype.layout_; +Flyout.prototype.layout_; /** * Scroll the flyout. * @param {!Event} e Mouse wheel scroll event. * @protected */ -Blockly.Flyout.prototype.wheel_; +Flyout.prototype.wheel_; /** * Compute height of flyout. Position mat under each block. @@ -1096,16 +1106,18 @@ Blockly.Flyout.prototype.wheel_; * @return {void} * @protected */ -Blockly.Flyout.prototype.reflowInternal_; +Flyout.prototype.reflowInternal_; /** * Calculates the x coordinate for the flyout position. * @return {number} X coordinate. */ -Blockly.Flyout.prototype.getX; +Flyout.prototype.getX; /** * Calculates the y coordinate for the flyout position. * @return {number} Y coordinate. */ -Blockly.Flyout.prototype.getY; +Flyout.prototype.getY; + +exports = Flyout; diff --git a/tests/deps.js b/tests/deps.js index 8c37fdc45..9d5c06d85 100644 --- a/tests/deps.js +++ b/tests/deps.js @@ -61,7 +61,7 @@ goog.addDependency('../../core/field_number.js', ['Blockly.FieldNumber'], ['Bloc goog.addDependency('../../core/field_registry.js', ['Blockly.fieldRegistry'], ['Blockly.registry'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/field_textinput.js', ['Blockly.FieldTextInput'], ['Blockly', 'Blockly.DropDownDiv', 'Blockly.Events', 'Blockly.Events.BlockChange', 'Blockly.Field', 'Blockly.Msg', 'Blockly.WidgetDiv', 'Blockly.browserEvents', 'Blockly.fieldRegistry', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.KeyCodes', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.userAgent'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/field_variable.js', ['Blockly.FieldVariable'], ['Blockly.Events.BlockChange', 'Blockly.FieldDropdown', 'Blockly.Msg', 'Blockly.VariableModel', 'Blockly.Variables', 'Blockly.Xml', 'Blockly.fieldRegistry', 'Blockly.internalConstants', 'Blockly.utils', 'Blockly.utils.Size', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); -goog.addDependency('../../core/flyout_base.js', ['Blockly.Flyout'], ['Blockly.Block', 'Blockly.ComponentManager', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.BlockCreate', 'Blockly.Events.VarCreate', 'Blockly.FlyoutMetricsManager', 'Blockly.Gesture', 'Blockly.IFlyout', 'Blockly.ScrollbarPair', 'Blockly.Tooltip', 'Blockly.Touch', 'Blockly.WorkspaceSvg', 'Blockly.Xml', 'Blockly.blockRendering', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.toolbox', 'Blockly.utils.xml']); +goog.addDependency('../../core/flyout_base.js', ['Blockly.Flyout'], ['Blockly', 'Blockly.Block', 'Blockly.ComponentManager', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.BlockCreate', 'Blockly.Events.VarCreate', 'Blockly.FlyoutButton', 'Blockly.FlyoutMetricsManager', 'Blockly.Gesture', 'Blockly.IFlyout', 'Blockly.ScrollbarPair', 'Blockly.Tooltip', 'Blockly.Touch', 'Blockly.Variables', 'Blockly.WorkspaceSvg', 'Blockly.Xml', 'Blockly.blockRendering', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.toolbox', 'Blockly.utils.xml'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/flyout_button.js', ['Blockly.FlyoutButton'], ['Blockly.Css', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.style'], {'lang': 'es5'}); goog.addDependency('../../core/flyout_horizontal.js', ['Blockly.HorizontalFlyout'], ['Blockly.DropDownDiv', 'Blockly.Flyout', 'Blockly.Scrollbar', 'Blockly.WidgetDiv', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.Rect', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/flyout_vertical.js', ['Blockly.VerticalFlyout'], ['Blockly.Block', 'Blockly.DropDownDiv', 'Blockly.Flyout', 'Blockly.Scrollbar', 'Blockly.WidgetDiv', 'Blockly.constants', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.Rect', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'});