CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-08 17:40:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5194 from gonfunko/icon

Browse Source 
Migrate core/icon.js to goog.module syntax
This commit is contained in:
Aaron Dodson
2021-07-23 13:14:18 -07:00
committed by GitHub
parent ac89372780 57bae2e6db
commit c5be9fca76
2 changed files with 51 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
core/icon.js
View File

@@ -10,29 +10,31 @@
*/
'use strict';
goog.provide('Blockly.Icon');
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
*/
Blockly.Icon = function(block) {
const Icon = function(block) {
/**
* The block this icon is attached to.
* @type {Blockly.BlockSvg}
* @type {BlockSvg}
* @protected
*/
this.block_ = block;
@@ -47,31 +49,32 @@ 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.
* @const
*/
Blockly.Icon.prototype.SIZE = 17;
Icon.prototype.SIZE = 17;
/**
* Bubble UI (if visible).
* @type {?Blockly.Bubble}
* @type {?Bubble}
* @protected
*/
Blockly.Icon.prototype.bubble_ = null;
Icon.prototype.bubble_ = null;
/**
* Absolute coordinate of icon's center.
* @type {?Blockly.utils.Coordinate}
* @type {?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;
@@ -81,17 +84,16 @@ Blockly.Icon.prototype.createIcon = function() {
...
</g>
*/
this.iconGroup_ = Blockly.utils.dom.createSvgElement(
Blockly.utils.Svg.G,
{'class': 'blocklyIconGroup'}, null);
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();
};
@@ -99,9 +101,9 @@ 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_);
dom.removeNode(this.iconGroup_);
this.iconGroup_ = null;
// Dispose of and unlink the bubble.
this.setVisible(false);
@@ -111,7 +113,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 +121,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,12 +130,12 @@ 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;
}
if (!this.block_.isInFlyout && !Blockly.utils.isRightButton(e)) {
if (!this.block_.isInFlyout && !isRightButton(e)) {
this.setVisible(!this.isVisible());
}
};
@@ -141,7 +143,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);
}
@@ -149,9 +151,9 @@ 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.
* @param {!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,25 +164,25 @@ 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.
var blockXY = this.block_.getRelativeToSurfaceXY();
var iconXY = Blockly.utils.getRelativeXY(
const blockXY = this.block_.getRelativeToSurfaceXY();
const iconXY = getRelativeXY(
/** @type {!SVGElement} */ (this.iconGroup_));
var 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.
*/
Blockly.Icon.prototype.getIconLocation = function() {
Icon.prototype.getIconLocation = function() {
return this.iconXY_;
};
@@ -188,12 +190,11 @@ Blockly.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.
Blockly.Icon.prototype.getCorrectedSize = function() {
return new Blockly.utils.Size(
Blockly.Icon.prototype.SIZE, Blockly.Icon.prototype.SIZE - 2);
Icon.prototype.getCorrectedSize = function() {
return new Size(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;

2
tests/deps.js
View File

@@ -68,7 +68,7 @@ goog.addDependency('../../core/flyout_vertical.js', ['Blockly.VerticalFlyout'],
goog.addDependency('../../core/generator.js', ['Blockly.Generator'], ['Blockly', 'Blockly.internalConstants', 'Blockly.utils.deprecation'], {'lang': 'es6', 'module': 'goog'});
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'], {'lang': 'es6', 'module': 'goog'});
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']);