From 341b5156934f8239924049c51c918c80ec973258 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 23 Jul 2021 09:15:58 -0700 Subject: [PATCH 1/5] Migrate core/icon.js to ES6 const/let --- core/icon.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/core/icon.js b/core/icon.js index c5f3477cd..ca1548aa3 100644 --- a/core/icon.js +++ b/core/icon.js @@ -164,10 +164,10 @@ Blockly.Icon.prototype.setIconLocation = function(xy) { */ Blockly.Icon.prototype.computeIconLocation = function() { // Find coordinates for the centre of the icon and update the arrow. - var blockXY = this.block_.getRelativeToSurfaceXY(); - var iconXY = Blockly.utils.getRelativeXY( + const blockXY = this.block_.getRelativeToSurfaceXY(); + const iconXY = Blockly.utils.getRelativeXY( /** @type {!SVGElement} */ (this.iconGroup_)); - var newXY = new Blockly.utils.Coordinate( + const newXY = new Blockly.utils.Coordinate( blockXY.x + iconXY.x + this.SIZE / 2, blockXY.y + iconXY.y + this.SIZE / 2); if (!Blockly.utils.Coordinate.equals(this.getIconLocation(), newXY)) { From 8f72d004741ef12eca40fd96ebd4ff85395efa41 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 23 Jul 2021 09:17:59 -0700 Subject: [PATCH 2/5] Migrate core/icon.js to goog.module --- core/icon.js | 41 ++++++++++++++++++++++------------------- tests/deps.js | 2 +- 2 files changed, 23 insertions(+), 20 deletions(-) diff --git a/core/icon.js b/core/icon.js index ca1548aa3..02e6f7348 100644 --- a/core/icon.js +++ b/core/icon.js @@ -10,7 +10,8 @@ */ 'use strict'; -goog.provide('Blockly.Icon'); +goog.module('Blockly.Icon'); +goog.module.declareLegacyNamespace(); goog.require('Blockly.browserEvents'); goog.require('Blockly.utils'); @@ -29,7 +30,7 @@ goog.requireType('Blockly.Bubble'); * @constructor * @abstract */ -Blockly.Icon = function(block) { +const Icon = function(block) { /** * The block this icon is attached to. * @type {Blockly.BlockSvg} @@ -47,31 +48,31 @@ Blockly.Icon = function(block) { /** * Does this icon get hidden when the block is collapsed. */ -Blockly.Icon.prototype.collapseHidden = true; +Icon.prototype.collapseHidden = true; /** * Height and width of icons. */ -Blockly.Icon.prototype.SIZE = 17; +Icon.prototype.SIZE = 17; /** * Bubble UI (if visible). * @type {?Blockly.Bubble} * @protected */ -Blockly.Icon.prototype.bubble_ = null; +Icon.prototype.bubble_ = null; /** * Absolute coordinate of icon's center. * @type {?Blockly.utils.Coordinate} * @protected */ -Blockly.Icon.prototype.iconXY_ = null; +Icon.prototype.iconXY_ = null; /** * Create the icon on the block. */ -Blockly.Icon.prototype.createIcon = function() { +Icon.prototype.createIcon = function() { if (this.iconGroup_) { // Icon already exists. return; @@ -99,7 +100,7 @@ Blockly.Icon.prototype.createIcon = function() { /** * Dispose of this icon. */ -Blockly.Icon.prototype.dispose = function() { +Icon.prototype.dispose = function() { // Dispose of and unlink the icon. Blockly.utils.dom.removeNode(this.iconGroup_); this.iconGroup_ = null; @@ -111,7 +112,7 @@ Blockly.Icon.prototype.dispose = function() { /** * Add or remove the UI indicating if this icon may be clicked or not. */ -Blockly.Icon.prototype.updateEditable = function() { +Icon.prototype.updateEditable = function() { // No-op on the base class. }; @@ -119,7 +120,7 @@ Blockly.Icon.prototype.updateEditable = function() { * Is the associated bubble visible? * @return {boolean} True if the bubble is visible. */ -Blockly.Icon.prototype.isVisible = function() { +Icon.prototype.isVisible = function() { return !!this.bubble_; }; @@ -128,7 +129,7 @@ Blockly.Icon.prototype.isVisible = function() { * @param {!Event} e Mouse click event. * @protected */ -Blockly.Icon.prototype.iconClick_ = function(e) { +Icon.prototype.iconClick_ = function(e) { if (this.block_.workspace.isDragging()) { // Drag operation is concluding. Don't open the editor. return; @@ -141,7 +142,7 @@ Blockly.Icon.prototype.iconClick_ = function(e) { /** * Change the colour of the associated bubble to match its block. */ -Blockly.Icon.prototype.applyColour = function() { +Icon.prototype.applyColour = function() { if (this.isVisible()) { this.bubble_.setColour(this.block_.style.colourPrimary); } @@ -151,7 +152,7 @@ Blockly.Icon.prototype.applyColour = function() { * Notification that the icon has moved. Update the arrow accordingly. * @param {!Blockly.utils.Coordinate} xy Absolute location in workspace coordinates. */ -Blockly.Icon.prototype.setIconLocation = function(xy) { +Icon.prototype.setIconLocation = function(xy) { this.iconXY_ = xy; if (this.isVisible()) { this.bubble_.setAnchorLocation(xy); @@ -162,7 +163,7 @@ Blockly.Icon.prototype.setIconLocation = function(xy) { * Notification that the icon has moved, but we don't really know where. * Recompute the icon's location from scratch. */ -Blockly.Icon.prototype.computeIconLocation = function() { +Icon.prototype.computeIconLocation = function() { // Find coordinates for the centre of the icon and update the arrow. const blockXY = this.block_.getRelativeToSurfaceXY(); const iconXY = Blockly.utils.getRelativeXY( @@ -180,7 +181,7 @@ Blockly.Icon.prototype.computeIconLocation = function() { * @return {?Blockly.utils.Coordinate} Object with x and y properties in * workspace coordinates. */ -Blockly.Icon.prototype.getIconLocation = function() { +Icon.prototype.getIconLocation = function() { return this.iconXY_; }; @@ -191,9 +192,9 @@ Blockly.Icon.prototype.getIconLocation = function() { * @return {!Blockly.utils.Size} Height and width. */ // TODO (#2562): Remove getCorrectedSize. -Blockly.Icon.prototype.getCorrectedSize = function() { +Icon.prototype.getCorrectedSize = function() { return new Blockly.utils.Size( - Blockly.Icon.prototype.SIZE, Blockly.Icon.prototype.SIZE - 2); + Icon.prototype.SIZE, Icon.prototype.SIZE - 2); }; /** @@ -201,10 +202,12 @@ Blockly.Icon.prototype.getCorrectedSize = function() { * @param {!Element} group The icon group. * @protected */ -Blockly.Icon.prototype.drawIcon_; +Icon.prototype.drawIcon_; /** * Show or hide the icon. * @param {boolean} visible True if the icon should be visible. */ -Blockly.Icon.prototype.setVisible; +Icon.prototype.setVisible; + +exports = Icon; diff --git a/tests/deps.js b/tests/deps.js index f62333982..57ab7a557 100644 --- a/tests/deps.js +++ b/tests/deps.js @@ -68,7 +68,7 @@ goog.addDependency('../../core/flyout_vertical.js', ['Blockly.VerticalFlyout'], goog.addDependency('../../core/generator.js', ['Blockly.Generator'], ['Blockly.Block', 'Blockly.internalConstants', 'Blockly.utils.deprecation']); goog.addDependency('../../core/gesture.js', ['Blockly.Gesture'], ['Blockly.BlockDragger', 'Blockly.BubbleDragger', 'Blockly.Events', 'Blockly.Events.Click', 'Blockly.Tooltip', 'Blockly.Touch', 'Blockly.Workspace', 'Blockly.WorkspaceDragger', 'Blockly.blockAnimations', 'Blockly.browserEvents', 'Blockly.internalConstants', 'Blockly.utils', 'Blockly.utils.Coordinate']); goog.addDependency('../../core/grid.js', ['Blockly.Grid'], ['Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.userAgent']); -goog.addDependency('../../core/icon.js', ['Blockly.Icon'], ['Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Size', 'Blockly.utils.Svg', 'Blockly.utils.dom']); +goog.addDependency('../../core/icon.js', ['Blockly.Icon'], ['Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Size', 'Blockly.utils.Svg', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/inject.js', ['Blockly.inject'], ['Blockly.BlockDragSurfaceSvg', 'Blockly.Css', 'Blockly.DropDownDiv', 'Blockly.Events', 'Blockly.Grid', 'Blockly.Msg', 'Blockly.Options', 'Blockly.ScrollbarPair', 'Blockly.Tooltip', 'Blockly.WidgetDiv', 'Blockly.Workspace', 'Blockly.WorkspaceDragSurfaceSvg', 'Blockly.WorkspaceSvg', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Svg', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.math', 'Blockly.utils.userAgent']); goog.addDependency('../../core/input.js', ['Blockly.Input'], ['Blockly.Connection', 'Blockly.FieldLabel', 'Blockly.fieldRegistry', 'Blockly.inputTypes'], {'lang': 'es5'}); goog.addDependency('../../core/input_types.js', ['Blockly.inputTypes'], ['Blockly.connectionTypes']); From 977d0f35bff7303573bb83e93e821edd4b839c8d Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 23 Jul 2021 09:21:00 -0700 Subject: [PATCH 3/5] Migrate core/icon.js to named requires --- core/icon.js | 53 ++++++++++++++++++++++++++-------------------------- 1 file changed, 27 insertions(+), 26 deletions(-) diff --git a/core/icon.js b/core/icon.js index 02e6f7348..0eaf37f0b 100644 --- a/core/icon.js +++ b/core/icon.js @@ -13,27 +13,28 @@ goog.module('Blockly.Icon'); goog.module.declareLegacyNamespace(); -goog.require('Blockly.browserEvents'); -goog.require('Blockly.utils'); -goog.require('Blockly.utils.Coordinate'); -goog.require('Blockly.utils.dom'); -goog.require('Blockly.utils.Size'); -goog.require('Blockly.utils.Svg'); - -goog.requireType('Blockly.BlockSvg'); -goog.requireType('Blockly.Bubble'); +/* eslint-disable-next-line no-unused-vars */ +const BlockSvg = goog.requireType('Blockly.BlockSvg'); +/* eslint-disable-next-line no-unused-vars */ +const Bubble = goog.requireType('Blockly.Bubble'); +const Coordinate = goog.require('Blockly.utils.Coordinate'); +const Size = goog.require('Blockly.utils.Size'); +const Svg = goog.require('Blockly.utils.Svg'); +const browserEvents = goog.require('Blockly.browserEvents'); +const dom = goog.require('Blockly.utils.dom'); +const {getRelativeXY, isRightButton} = goog.require('Blockly.utils'); /** * Class for an icon. - * @param {Blockly.BlockSvg} block The block associated with this icon. + * @param {BlockSvg} block The block associated with this icon. * @constructor * @abstract */ const Icon = function(block) { /** * The block this icon is attached to. - * @type {Blockly.BlockSvg} + * @type {BlockSvg} * @protected */ this.block_ = block; @@ -57,14 +58,14 @@ Icon.prototype.SIZE = 17; /** * Bubble UI (if visible). - * @type {?Blockly.Bubble} + * @type {?Bubble} * @protected */ Icon.prototype.bubble_ = null; /** * Absolute coordinate of icon's center. - * @type {?Blockly.utils.Coordinate} + * @type {?Coordinate} * @protected */ Icon.prototype.iconXY_ = null; @@ -82,17 +83,17 @@ Icon.prototype.createIcon = function() { ... */ - this.iconGroup_ = Blockly.utils.dom.createSvgElement( - Blockly.utils.Svg.G, + this.iconGroup_ = dom.createSvgElement( + Svg.G, {'class': 'blocklyIconGroup'}, null); if (this.block_.isInFlyout) { - Blockly.utils.dom.addClass( + dom.addClass( /** @type {!Element} */ (this.iconGroup_), 'blocklyIconGroupReadonly'); } this.drawIcon_(this.iconGroup_); this.block_.getSvgRoot().appendChild(this.iconGroup_); - Blockly.browserEvents.conditionalBind( + browserEvents.conditionalBind( this.iconGroup_, 'mouseup', this, this.iconClick_); this.updateEditable(); }; @@ -102,7 +103,7 @@ Icon.prototype.createIcon = function() { */ Icon.prototype.dispose = function() { // Dispose of and unlink the icon. - Blockly.utils.dom.removeNode(this.iconGroup_); + dom.removeNode(this.iconGroup_); this.iconGroup_ = null; // Dispose of and unlink the bubble. this.setVisible(false); @@ -134,7 +135,7 @@ Icon.prototype.iconClick_ = function(e) { // Drag operation is concluding. Don't open the editor. return; } - if (!this.block_.isInFlyout && !Blockly.utils.isRightButton(e)) { + if (!this.block_.isInFlyout && !isRightButton(e)) { this.setVisible(!this.isVisible()); } }; @@ -150,7 +151,7 @@ Icon.prototype.applyColour = function() { /** * Notification that the icon has moved. Update the arrow accordingly. - * @param {!Blockly.utils.Coordinate} xy Absolute location in workspace coordinates. + * @param {!Coordinate} xy Absolute location in workspace coordinates. */ Icon.prototype.setIconLocation = function(xy) { this.iconXY_ = xy; @@ -166,19 +167,19 @@ Icon.prototype.setIconLocation = function(xy) { Icon.prototype.computeIconLocation = function() { // Find coordinates for the centre of the icon and update the arrow. const blockXY = this.block_.getRelativeToSurfaceXY(); - const iconXY = Blockly.utils.getRelativeXY( + const iconXY = getRelativeXY( /** @type {!SVGElement} */ (this.iconGroup_)); - const newXY = new Blockly.utils.Coordinate( + const newXY = new Coordinate( blockXY.x + iconXY.x + this.SIZE / 2, blockXY.y + iconXY.y + this.SIZE / 2); - if (!Blockly.utils.Coordinate.equals(this.getIconLocation(), newXY)) { + if (!Coordinate.equals(this.getIconLocation(), newXY)) { this.setIconLocation(newXY); } }; /** * Returns the center of the block's icon relative to the surface. - * @return {?Blockly.utils.Coordinate} Object with x and y properties in + * @return {?Coordinate} Object with x and y properties in * workspace coordinates. */ Icon.prototype.getIconLocation = function() { @@ -189,11 +190,11 @@ Icon.prototype.getIconLocation = function() { * Get the size of the icon as used for rendering. * This differs from the actual size of the icon, because it bulges slightly * out of its row rather than increasing the height of its row. - * @return {!Blockly.utils.Size} Height and width. + * @return {!Size} Height and width. */ // TODO (#2562): Remove getCorrectedSize. Icon.prototype.getCorrectedSize = function() { - return new Blockly.utils.Size( + return new Size( Icon.prototype.SIZE, Icon.prototype.SIZE - 2); }; From 7175e9452bceadbf15e80e017bf00e5ffb61bb6b Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 23 Jul 2021 09:21:41 -0700 Subject: [PATCH 4/5] clang-format core/icon.js --- core/icon.js | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/core/icon.js b/core/icon.js index 0eaf37f0b..b6b8942a7 100644 --- a/core/icon.js +++ b/core/icon.js @@ -83,9 +83,8 @@ Icon.prototype.createIcon = function() { ... */ - this.iconGroup_ = dom.createSvgElement( - Svg.G, - {'class': 'blocklyIconGroup'}, null); + this.iconGroup_ = + dom.createSvgElement(Svg.G, {'class': 'blocklyIconGroup'}, null); if (this.block_.isInFlyout) { dom.addClass( /** @type {!Element} */ (this.iconGroup_), 'blocklyIconGroupReadonly'); @@ -194,8 +193,7 @@ Icon.prototype.getIconLocation = function() { */ // TODO (#2562): Remove getCorrectedSize. Icon.prototype.getCorrectedSize = function() { - return new Size( - Icon.prototype.SIZE, Icon.prototype.SIZE - 2); + return new Size(Icon.prototype.SIZE, Icon.prototype.SIZE - 2); }; /** From a5c486e5717215fa4fe83ca64988f22c4149b622 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Fri, 23 Jul 2021 13:09:48 -0700 Subject: [PATCH 5/5] Made icon size field const --- core/icon.js | 1 + 1 file changed, 1 insertion(+) diff --git a/core/icon.js b/core/icon.js index b6b8942a7..69ff3ef37 100644 --- a/core/icon.js +++ b/core/icon.js @@ -53,6 +53,7 @@ Icon.prototype.collapseHidden = true; /** * Height and width of icons. + * @const */ Icon.prototype.SIZE = 17;