From a106f37cbb3f9a1dd62062c3ed5eedb7b472c0c4 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Mon, 26 Jul 2021 11:33:46 -0700 Subject: [PATCH 1/4] Migrate core/theme.js to ES6 const/let --- core/theme.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/core/theme.js b/core/theme.js index 182710f16..75bfb3779 100644 --- a/core/theme.js +++ b/core/theme.js @@ -165,7 +165,7 @@ Blockly.Theme.prototype.setCategoryStyle = function(categoryStyleName, * @return {?string} The style value. */ Blockly.Theme.prototype.getComponentStyle = function(componentName) { - var style = this.componentStyles[componentName]; + const style = this.componentStyles[componentName]; if (style && typeof style == 'string' && this.getComponentStyle(/** @type {string} */ (style))) { return this.getComponentStyle(/** @type {string} */ (style)); @@ -207,8 +207,8 @@ Blockly.Theme.prototype.setStartHats = function(startHats) { * @return {!Blockly.Theme} A new Blockly theme. */ Blockly.Theme.defineTheme = function(name, themeObj) { - var theme = new Blockly.Theme(name); - var base = themeObj['base']; + const theme = new Blockly.Theme(name); + let base = themeObj['base']; if (base) { if (typeof base == "string") { base = Blockly.registry.getObject(Blockly.registry.Type.THEME, base); From 367b94dfdd8c2856efea4f9b66e6237a73200787 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Mon, 26 Jul 2021 11:36:48 -0700 Subject: [PATCH 2/4] Migrate core/theme.js to goog.module --- core/theme.js | 61 +++++++++++++++++++++++++++------------------------ tests/deps.js | 2 +- 2 files changed, 33 insertions(+), 30 deletions(-) diff --git a/core/theme.js b/core/theme.js index 75bfb3779..16289a3ad 100644 --- a/core/theme.js +++ b/core/theme.js @@ -9,7 +9,8 @@ */ 'use strict'; -goog.provide('Blockly.Theme'); +goog.module('Blockly.Theme'); +goog.module.declareLegacyNamespace(); goog.require('Blockly.registry'); goog.require('Blockly.utils'); @@ -19,16 +20,16 @@ goog.require('Blockly.utils.object'); /** * Class for a theme. * @param {string} name Theme name. - * @param {!Object=} opt_blockStyles A map + * @param {!Object=} opt_blockStyles A map * from style names (strings) to objects with style attributes for blocks. - * @param {!Object=} opt_categoryStyles A + * @param {!Object=} opt_categoryStyles A * map from style names (strings) to objects with style attributes for * categories. - * @param {!Blockly.Theme.ComponentStyle=} opt_componentStyles A map of Blockly + * @param {!Theme.ComponentStyle=} opt_componentStyles A map of Blockly * component names to style value. * @constructor */ -Blockly.Theme = function(name, opt_blockStyles, opt_categoryStyles, +const Theme = function(name, opt_blockStyles, opt_categoryStyles, opt_componentStyles) { /** @@ -39,32 +40,32 @@ Blockly.Theme = function(name, opt_blockStyles, opt_categoryStyles, /** * The block styles map. - * @type {!Object} + * @type {!Object} * @package */ this.blockStyles = opt_blockStyles || Object.create(null); /** * The category styles map. - * @type {!Object} + * @type {!Object} * @package */ this.categoryStyles = opt_categoryStyles || Object.create(null); /** * The UI components styles map. - * @type {!Blockly.Theme.ComponentStyle} + * @type {!Theme.ComponentStyle} * @package */ this.componentStyles = opt_componentStyles || - (/** @type {Blockly.Theme.ComponentStyle} */ (Object.create(null))); + (/** @type {Theme.ComponentStyle} */ (Object.create(null))); /** * The font style. - * @type {!Blockly.Theme.FontStyle} + * @type {!Theme.FontStyle} * @package */ - this.fontStyle = /** @type {Blockly.Theme.FontStyle} */ (Object.create(null)); + this.fontStyle = /** @type {Theme.FontStyle} */ (Object.create(null)); /** * Whether or not to add a 'hat' on top of all blocks with no previous or @@ -87,7 +88,7 @@ Blockly.Theme = function(name, opt_blockStyles, opt_categoryStyles, * hat:string * }} */ -Blockly.Theme.BlockStyle; +Theme.BlockStyle; /** * A category style. @@ -95,7 +96,7 @@ Blockly.Theme.BlockStyle; * colour:string * }} */ -Blockly.Theme.CategoryStyle; +Theme.CategoryStyle; /** * A component style. @@ -118,7 +119,7 @@ Blockly.Theme.CategoryStyle; * replacementGlowOpacity:?number * }} */ -Blockly.Theme.ComponentStyle; +Theme.ComponentStyle; /** * A font style. @@ -128,32 +129,32 @@ Blockly.Theme.ComponentStyle; * size:?number * }} */ -Blockly.Theme.FontStyle; +Theme.FontStyle; /** * Gets the class name that identifies this theme. * @return {string} The CSS class name. * @package */ -Blockly.Theme.prototype.getClassName = function() { +Theme.prototype.getClassName = function() { return this.name + '-theme'; }; /** * Overrides or adds a style to the blockStyles map. * @param {string} blockStyleName The name of the block style. - * @param {Blockly.Theme.BlockStyle} blockStyle The block style. + * @param {Theme.BlockStyle} blockStyle The block style. */ -Blockly.Theme.prototype.setBlockStyle = function(blockStyleName, blockStyle) { +Theme.prototype.setBlockStyle = function(blockStyleName, blockStyle) { this.blockStyles[blockStyleName] = blockStyle; }; /** * Overrides or adds a style to the categoryStyles map. * @param {string} categoryStyleName The name of the category style. - * @param {Blockly.Theme.CategoryStyle} categoryStyle The category style. + * @param {Theme.CategoryStyle} categoryStyle The category style. */ -Blockly.Theme.prototype.setCategoryStyle = function(categoryStyleName, +Theme.prototype.setCategoryStyle = function(categoryStyleName, categoryStyle) { this.categoryStyles[categoryStyleName] = categoryStyle; }; @@ -164,7 +165,7 @@ Blockly.Theme.prototype.setCategoryStyle = function(categoryStyleName, * @param {string} componentName The name of the component. * @return {?string} The style value. */ -Blockly.Theme.prototype.getComponentStyle = function(componentName) { +Theme.prototype.getComponentStyle = function(componentName) { const style = this.componentStyles[componentName]; if (style && typeof style == 'string' && this.getComponentStyle(/** @type {string} */ (style))) { @@ -178,16 +179,16 @@ Blockly.Theme.prototype.getComponentStyle = function(componentName) { * @param {string} componentName The name of the component. * @param {*} styleValue The style value. */ -Blockly.Theme.prototype.setComponentStyle = function(componentName, +Theme.prototype.setComponentStyle = function(componentName, styleValue) { this.componentStyles[componentName] = styleValue; }; /** * Configure a theme's font style. - * @param {Blockly.Theme.FontStyle} fontStyle The font style. + * @param {Theme.FontStyle} fontStyle The font style. */ -Blockly.Theme.prototype.setFontStyle = function(fontStyle) { +Theme.prototype.setFontStyle = function(fontStyle) { this.fontStyle = fontStyle; }; @@ -196,7 +197,7 @@ Blockly.Theme.prototype.setFontStyle = function(fontStyle) { * @param {boolean} startHats True if the theme enables start hats, false * otherwise. */ -Blockly.Theme.prototype.setStartHats = function(startHats) { +Theme.prototype.setStartHats = function(startHats) { this.startHats = startHats; }; @@ -204,16 +205,16 @@ Blockly.Theme.prototype.setStartHats = function(startHats) { * Define a new Blockly theme. * @param {string} name The name of the theme. * @param {!Object} themeObj An object containing theme properties. - * @return {!Blockly.Theme} A new Blockly theme. + * @return {!Theme} A new Blockly theme. */ -Blockly.Theme.defineTheme = function(name, themeObj) { - const theme = new Blockly.Theme(name); +Theme.defineTheme = function(name, themeObj) { + const theme = new Theme(name); let base = themeObj['base']; if (base) { if (typeof base == "string") { base = Blockly.registry.getObject(Blockly.registry.Type.THEME, base); } - if (base instanceof Blockly.Theme) { + if (base instanceof Theme) { Blockly.utils.object.deepMerge(theme, base); theme.name = name; } @@ -233,3 +234,5 @@ Blockly.Theme.defineTheme = function(name, themeObj) { return theme; }; + +exports = Theme; diff --git a/tests/deps.js b/tests/deps.js index de575339f..42d14c6a8 100644 --- a/tests/deps.js +++ b/tests/deps.js @@ -161,7 +161,7 @@ goog.addDependency('../../core/requires.js', ['Blockly.requires'], ['Blockly', ' goog.addDependency('../../core/scrollbar.js', ['Blockly.Scrollbar', 'Blockly.ScrollbarPair'], ['Blockly.Events', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Metrics', 'Blockly.utils.Svg', 'Blockly.utils.dom']); goog.addDependency('../../core/shortcut_items.js', ['Blockly.ShortcutItems'], ['Blockly.Gesture', 'Blockly.ShortcutRegistry', 'Blockly.utils.KeyCodes']); goog.addDependency('../../core/shortcut_registry.js', ['Blockly.ShortcutRegistry'], ['Blockly.utils.KeyCodes', 'Blockly.utils.object']); -goog.addDependency('../../core/theme.js', ['Blockly.Theme'], ['Blockly.registry', 'Blockly.utils', 'Blockly.utils.object']); +goog.addDependency('../../core/theme.js', ['Blockly.Theme'], ['Blockly.registry', 'Blockly.utils', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/theme/classic.js', ['Blockly.Themes.Classic'], ['Blockly.Theme']); goog.addDependency('../../core/theme/zelos.js', ['Blockly.Themes.Zelos'], ['Blockly.Theme']); goog.addDependency('../../core/theme_manager.js', ['Blockly.ThemeManager'], ['Blockly.Theme']); From 9cf50a61c189e9e3c076f81bd86d1b436a1878dc Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Mon, 26 Jul 2021 11:39:57 -0700 Subject: [PATCH 3/4] Migrate core/theme.js to named requires --- core/theme.js | 19 +++++++++---------- tests/deps.js | 2 +- 2 files changed, 10 insertions(+), 11 deletions(-) diff --git a/core/theme.js b/core/theme.js index 16289a3ad..c9cd46968 100644 --- a/core/theme.js +++ b/core/theme.js @@ -12,9 +12,8 @@ goog.module('Blockly.Theme'); goog.module.declareLegacyNamespace(); -goog.require('Blockly.registry'); -goog.require('Blockly.utils'); -goog.require('Blockly.utils.object'); +const object = goog.require('Blockly.utils.object'); +const registry = goog.require('Blockly.registry'); /** @@ -76,7 +75,7 @@ const Theme = function(name, opt_blockStyles, opt_categoryStyles, this.startHats = null; // Register the theme by name. - Blockly.registry.register(Blockly.registry.Type.THEME, name, this); + registry.register(registry.Type.THEME, name, this); }; /** @@ -212,21 +211,21 @@ Theme.defineTheme = function(name, themeObj) { let base = themeObj['base']; if (base) { if (typeof base == "string") { - base = Blockly.registry.getObject(Blockly.registry.Type.THEME, base); + base = registry.getObject(registry.Type.THEME, base); } if (base instanceof Theme) { - Blockly.utils.object.deepMerge(theme, base); + object.deepMerge(theme, base); theme.name = name; } } - Blockly.utils.object.deepMerge(theme.blockStyles, + object.deepMerge(theme.blockStyles, themeObj['blockStyles']); - Blockly.utils.object.deepMerge(theme.categoryStyles, + object.deepMerge(theme.categoryStyles, themeObj['categoryStyles']); - Blockly.utils.object.deepMerge(theme.componentStyles, + object.deepMerge(theme.componentStyles, themeObj['componentStyles']); - Blockly.utils.object.deepMerge(theme.fontStyle, + object.deepMerge(theme.fontStyle, themeObj['fontStyle']); if (themeObj['startHats'] != null) { theme.startHats = themeObj['startHats']; diff --git a/tests/deps.js b/tests/deps.js index 42d14c6a8..d27093d4d 100644 --- a/tests/deps.js +++ b/tests/deps.js @@ -161,7 +161,7 @@ goog.addDependency('../../core/requires.js', ['Blockly.requires'], ['Blockly', ' goog.addDependency('../../core/scrollbar.js', ['Blockly.Scrollbar', 'Blockly.ScrollbarPair'], ['Blockly.Events', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Metrics', 'Blockly.utils.Svg', 'Blockly.utils.dom']); goog.addDependency('../../core/shortcut_items.js', ['Blockly.ShortcutItems'], ['Blockly.Gesture', 'Blockly.ShortcutRegistry', 'Blockly.utils.KeyCodes']); goog.addDependency('../../core/shortcut_registry.js', ['Blockly.ShortcutRegistry'], ['Blockly.utils.KeyCodes', 'Blockly.utils.object']); -goog.addDependency('../../core/theme.js', ['Blockly.Theme'], ['Blockly.registry', 'Blockly.utils', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); +goog.addDependency('../../core/theme.js', ['Blockly.Theme'], ['Blockly.registry', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/theme/classic.js', ['Blockly.Themes.Classic'], ['Blockly.Theme']); goog.addDependency('../../core/theme/zelos.js', ['Blockly.Themes.Zelos'], ['Blockly.Theme']); goog.addDependency('../../core/theme_manager.js', ['Blockly.ThemeManager'], ['Blockly.Theme']); From 4e3bfee2aacb5391a8ee0ede11b4d3b8989ceaf2 Mon Sep 17 00:00:00 2001 From: Aaron Dodson Date: Mon, 26 Jul 2021 11:42:17 -0700 Subject: [PATCH 4/4] clang-format core/theme.js --- core/theme.js | 39 ++++++++++++++++----------------------- 1 file changed, 16 insertions(+), 23 deletions(-) diff --git a/core/theme.js b/core/theme.js index c9cd46968..11c72e491 100644 --- a/core/theme.js +++ b/core/theme.js @@ -28,9 +28,8 @@ const registry = goog.require('Blockly.registry'); * component names to style value. * @constructor */ -const Theme = function(name, opt_blockStyles, opt_categoryStyles, - opt_componentStyles) { - +const Theme = function( + name, opt_blockStyles, opt_categoryStyles, opt_componentStyles) { /** * The theme name. This can be used to reference a specific theme in CSS. * @type {string} @@ -57,7 +56,7 @@ const Theme = function(name, opt_blockStyles, opt_categoryStyles, * @package */ this.componentStyles = opt_componentStyles || - (/** @type {Theme.ComponentStyle} */ (Object.create(null))); + (/** @type {Theme.ComponentStyle} */ (Object.create(null))); /** * The font style. @@ -143,7 +142,7 @@ Theme.prototype.getClassName = function() { * Overrides or adds a style to the blockStyles map. * @param {string} blockStyleName The name of the block style. * @param {Theme.BlockStyle} blockStyle The block style. -*/ + */ Theme.prototype.setBlockStyle = function(blockStyleName, blockStyle) { this.blockStyles[blockStyleName] = blockStyle; }; @@ -152,9 +151,8 @@ Theme.prototype.setBlockStyle = function(blockStyleName, blockStyle) { * Overrides or adds a style to the categoryStyles map. * @param {string} categoryStyleName The name of the category style. * @param {Theme.CategoryStyle} categoryStyle The category style. -*/ -Theme.prototype.setCategoryStyle = function(categoryStyleName, - categoryStyle) { + */ +Theme.prototype.setCategoryStyle = function(categoryStyleName, categoryStyle) { this.categoryStyles[categoryStyleName] = categoryStyle; }; @@ -177,16 +175,15 @@ Theme.prototype.getComponentStyle = function(componentName) { * Configure a specific Blockly UI component with a style value. * @param {string} componentName The name of the component. * @param {*} styleValue The style value. -*/ -Theme.prototype.setComponentStyle = function(componentName, - styleValue) { + */ +Theme.prototype.setComponentStyle = function(componentName, styleValue) { this.componentStyles[componentName] = styleValue; }; /** * Configure a theme's font style. * @param {Theme.FontStyle} fontStyle The font style. -*/ + */ Theme.prototype.setFontStyle = function(fontStyle) { this.fontStyle = fontStyle; }; @@ -195,7 +192,7 @@ Theme.prototype.setFontStyle = function(fontStyle) { * Configure a theme's start hats. * @param {boolean} startHats True if the theme enables start hats, false * otherwise. -*/ + */ Theme.prototype.setStartHats = function(startHats) { this.startHats = startHats; }; @@ -205,12 +202,12 @@ Theme.prototype.setStartHats = function(startHats) { * @param {string} name The name of the theme. * @param {!Object} themeObj An object containing theme properties. * @return {!Theme} A new Blockly theme. -*/ + */ Theme.defineTheme = function(name, themeObj) { const theme = new Theme(name); let base = themeObj['base']; if (base) { - if (typeof base == "string") { + if (typeof base == 'string') { base = registry.getObject(registry.Type.THEME, base); } if (base instanceof Theme) { @@ -219,14 +216,10 @@ Theme.defineTheme = function(name, themeObj) { } } - object.deepMerge(theme.blockStyles, - themeObj['blockStyles']); - object.deepMerge(theme.categoryStyles, - themeObj['categoryStyles']); - object.deepMerge(theme.componentStyles, - themeObj['componentStyles']); - object.deepMerge(theme.fontStyle, - themeObj['fontStyle']); + object.deepMerge(theme.blockStyles, themeObj['blockStyles']); + object.deepMerge(theme.categoryStyles, themeObj['categoryStyles']); + object.deepMerge(theme.componentStyles, themeObj['componentStyles']); + object.deepMerge(theme.fontStyle, themeObj['fontStyle']); if (themeObj['startHats'] != null) { theme.startHats = themeObj['startHats']; }