From a24420d7876d41b43fc35882ffb9edbdf9a43a6f Mon Sep 17 00:00:00 2001 From: Maribeth Bottorff Date: Thu, 16 Sep 2021 15:20:17 -0700 Subject: [PATCH 1/2] refactor: Move Blockly.svgResize to Blockly.common --- core/blockly.js | 38 ++++++-------------------------------- core/common.js | 34 ++++++++++++++++++++++++++++++++++ core/inject.js | 10 +++++----- core/toolbox/toolbox.js | 3 +-- 4 files changed, 46 insertions(+), 39 deletions(-) diff --git a/core/blockly.js b/core/blockly.js index 5d109460e04..469aff392a3 100644 --- a/core/blockly.js +++ b/core/blockly.js @@ -115,38 +115,7 @@ Blockly.resizeSvgContents = function(workspace) { workspace.resizeContents(); }; -/** - * Size the SVG image to completely fill its container. Call this when the view - * actually changes sizes (e.g. on a window resize/device orientation change). - * See Blockly.resizeSvgContents to resize the workspace when the contents - * change (e.g. when a block is added or removed). - * Record the height/width of the SVG image. - * @param {!Blockly.WorkspaceSvg} workspace Any workspace in the SVG. - */ -Blockly.svgResize = function(workspace) { - var mainWorkspace = workspace; - while (mainWorkspace.options.parentWorkspace) { - mainWorkspace = mainWorkspace.options.parentWorkspace; - } - var svg = mainWorkspace.getParentSvg(); - var cachedSize = mainWorkspace.getCachedParentSvgSize(); - var div = svg.parentNode; - if (!div) { - // Workspace deleted, or something. - return; - } - var width = div.offsetWidth; - var height = div.offsetHeight; - if (cachedSize.width != width) { - svg.setAttribute('width', width + 'px'); - mainWorkspace.setCachedParentSvgSize(width, null); - } - if (cachedSize.height != height) { - svg.setAttribute('height', height + 'px'); - mainWorkspace.setCachedParentSvgSize(null, height); - } - mainWorkspace.resize(); -}; + /** * Handle a key-down on SVG drawing surface. Does nothing if the main workspace @@ -394,6 +363,11 @@ Blockly.ALIGN_CENTRE = Blockly.constants.ALIGN.CENTRE; */ Blockly.ALIGN_RIGHT = Blockly.constants.ALIGN.RIGHT; +/** + * @see Blockly.common.svgResize + */ +Blockly.svgResize = Blockly.common.svgResize; + /** * Aliases for constants used for connection and input types. diff --git a/core/common.js b/core/common.js index b6d7ad36942..e9b6c53c734 100644 --- a/core/common.js +++ b/core/common.js @@ -75,6 +75,40 @@ const setParentContainer = function(newParent) { }; exports.setParentContainer = setParentContainer; +/** + * Size the SVG image to completely fill its container. Call this when the view + * actually changes sizes (e.g. on a window resize/device orientation change). + * See Blockly.resizeSvgContents to resize the workspace when the contents + * change (e.g. when a block is added or removed). + * Record the height/width of the SVG image. + * @param {!Blockly.WorkspaceSvg} workspace Any workspace in the SVG. + */ + const svgResize = function(workspace) { + let mainWorkspace = workspace; + while (mainWorkspace.options.parentWorkspace) { + mainWorkspace = mainWorkspace.options.parentWorkspace; + } + const svg = mainWorkspace.getParentSvg(); + const cachedSize = mainWorkspace.getCachedParentSvgSize(); + const div = svg.parentNode; + if (!div) { + // Workspace deleted, or something. + return; + } + const width = div.offsetWidth; + const height = div.offsetHeight; + if (cachedSize.width != width) { + svg.setAttribute('width', width + 'px'); + mainWorkspace.setCachedParentSvgSize(width, null); + } + if (cachedSize.height != height) { + svg.setAttribute('height', height + 'px'); + mainWorkspace.setCachedParentSvgSize(null, height); + } + mainWorkspace.resize(); +}; +exports.svgResize = svgResize; + /** * All of the connections on blocks that are currently being dragged. * @type {!Array} diff --git a/core/inject.js b/core/inject.js index be10e7c088e..f143c9b727f 100644 --- a/core/inject.js +++ b/core/inject.js @@ -79,7 +79,7 @@ const inject = function(container, opt_options) { // correct. common.setMainWorkspace(workspace); - Blockly.svgResize(workspace); + common.svgResize(workspace); subContainer.addEventListener('focusin', function() { common.setMainWorkspace(workspace); @@ -187,7 +187,7 @@ const createMainWorkspace = function( bumpObjects.bumpIntoBoundsHandler(mainWorkspace)); // The SVG is now fully assembled. - Blockly.svgResize(mainWorkspace); + common.svgResize(mainWorkspace); WidgetDiv.createDom(); DropDownDiv.createDom(); Tooltip.createDom(); @@ -214,7 +214,7 @@ const init = function(mainWorkspace) { const workspaceResizeHandler = browserEvents.conditionalBind(window, 'resize', null, function() { mainWorkspace.hideChaff(true); - Blockly.svgResize(mainWorkspace); + common.svgResize(mainWorkspace); goog.module.get('Blockly.bumpObjects') .bumpTopObjectsIntoBounds(mainWorkspace); }); @@ -300,8 +300,8 @@ const bindDocumentEvents = function() { browserEvents.conditionalBind( window, 'orientationchange', document, function() { // TODO (#397): Fix for multiple Blockly workspaces. - Blockly.svgResize(/** @type {!WorkspaceSvg} */ - (common.getMainWorkspace())); + common.svgResize(/** @type {!WorkspaceSvg} */ + (common.getMainWorkspace())); }); } } diff --git a/core/toolbox/toolbox.js b/core/toolbox/toolbox.js index 3b44eb0c2ae..5f39d11f5ca 100644 --- a/core/toolbox/toolbox.js +++ b/core/toolbox/toolbox.js @@ -13,7 +13,6 @@ goog.module('Blockly.Toolbox'); goog.module.declareLegacyNamespace(); -const Blockly = goog.require('Blockly'); /* eslint-disable-next-line no-unused-vars */ const BlocklyOptions = goog.requireType('Blockly.BlocklyOptions'); const BlockSvg = goog.require('Blockly.BlockSvg'); @@ -793,7 +792,7 @@ Toolbox.prototype.handleToolboxItemResize = function() { // Even though the div hasn't changed size, the visible workspace // surface of the workspace has, so we may need to reposition everything. - Blockly.svgResize(workspace); + common.svgResize(workspace); }; /** From 2363f9e8cd1d3dc9fcabd2648ba266d0cc7e3782 Mon Sep 17 00:00:00 2001 From: Maribeth Bottorff Date: Thu, 16 Sep 2021 15:24:36 -0700 Subject: [PATCH 2/2] fix formatting and deps --- core/blockly.js | 2 -- tests/deps.js | 2 +- tests/deps.mocha.js | 2 +- 3 files changed, 2 insertions(+), 4 deletions(-) diff --git a/core/blockly.js b/core/blockly.js index e8be440c74e..1fadc800563 100644 --- a/core/blockly.js +++ b/core/blockly.js @@ -111,8 +111,6 @@ Blockly.resizeSvgContents = function(workspace) { workspace.resizeContents(); }; - - /** * Copy a block or workspace comment onto the local clipboard. * @param {!Blockly.ICopyable} toCopy Block or Workspace Comment to be copied. diff --git a/tests/deps.js b/tests/deps.js index 715065cfb3d..c8d5d7073be 100644 --- a/tests/deps.js +++ b/tests/deps.js @@ -205,7 +205,7 @@ goog.addDependency('../../core/theme_manager.js', ['Blockly.ThemeManager'], ['Bl goog.addDependency('../../core/toolbox/category.js', ['Blockly.ToolboxCategory'], ['Blockly.Css', 'Blockly.ToolboxItem', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.aria', 'Blockly.utils.colour', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/collapsible_category.js', ['Blockly.CollapsibleToolboxCategory'], ['Blockly.ToolboxCategory', 'Blockly.ToolboxSeparator', 'Blockly.registry', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/separator.js', ['Blockly.ToolboxSeparator'], ['Blockly.Css', 'Blockly.ToolboxItem', 'Blockly.registry', 'Blockly.utils.dom', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); -goog.addDependency('../../core/toolbox/toolbox.js', ['Blockly.Toolbox'], ['Blockly', 'Blockly.BlockSvg', 'Blockly.CollapsibleToolboxCategory', 'Blockly.ComponentManager', 'Blockly.Css', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.ToolboxItemSelect', 'Blockly.Options', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.common', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.KeyCodes', 'Blockly.utils.Rect', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); +goog.addDependency('../../core/toolbox/toolbox.js', ['Blockly.Toolbox'], ['Blockly.BlockSvg', 'Blockly.CollapsibleToolboxCategory', 'Blockly.ComponentManager', 'Blockly.Css', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.ToolboxItemSelect', 'Blockly.Options', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.common', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.KeyCodes', 'Blockly.utils.Rect', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/toolbox_item.js', ['Blockly.ToolboxItem'], ['Blockly.utils.idGenerator'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/tooltip.js', ['Blockly.Tooltip'], ['Blockly.browserEvents', 'Blockly.common', 'Blockly.utils.deprecation', 'Blockly.utils.string'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/touch.js', ['Blockly.Touch'], ['Blockly.internalConstants', 'Blockly.utils.global', 'Blockly.utils.string'], {'lang': 'es6', 'module': 'goog'}); diff --git a/tests/deps.mocha.js b/tests/deps.mocha.js index a3e1be2b173..19133a5e982 100644 --- a/tests/deps.mocha.js +++ b/tests/deps.mocha.js @@ -205,7 +205,7 @@ goog.addDependency('../../core/theme_manager.js', ['Blockly.ThemeManager'], ['Bl goog.addDependency('../../core/toolbox/category.js', ['Blockly.ToolboxCategory'], ['Blockly.Css', 'Blockly.ToolboxItem', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.aria', 'Blockly.utils.colour', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/collapsible_category.js', ['Blockly.CollapsibleToolboxCategory'], ['Blockly.ToolboxCategory', 'Blockly.ToolboxSeparator', 'Blockly.registry', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/separator.js', ['Blockly.ToolboxSeparator'], ['Blockly.Css', 'Blockly.ToolboxItem', 'Blockly.registry', 'Blockly.utils.dom', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'}); -goog.addDependency('../../core/toolbox/toolbox.js', ['Blockly.Toolbox'], ['Blockly', 'Blockly.BlockSvg', 'Blockly.CollapsibleToolboxCategory', 'Blockly.ComponentManager', 'Blockly.Css', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.ToolboxItemSelect', 'Blockly.Options', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.common', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.KeyCodes', 'Blockly.utils.Rect', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); +goog.addDependency('../../core/toolbox/toolbox.js', ['Blockly.Toolbox'], ['Blockly.BlockSvg', 'Blockly.CollapsibleToolboxCategory', 'Blockly.ComponentManager', 'Blockly.Css', 'Blockly.DeleteArea', 'Blockly.Events', 'Blockly.Events.ToolboxItemSelect', 'Blockly.Options', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.common', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.KeyCodes', 'Blockly.utils.Rect', 'Blockly.utils.aria', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/toolbox/toolbox_item.js', ['Blockly.ToolboxItem'], ['Blockly.utils.idGenerator'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/tooltip.js', ['Blockly.Tooltip'], ['Blockly.browserEvents', 'Blockly.common', 'Blockly.utils.deprecation', 'Blockly.utils.string'], {'lang': 'es6', 'module': 'goog'}); goog.addDependency('../../core/touch.js', ['Blockly.Touch'], ['Blockly.internalConstants', 'Blockly.utils.global', 'Blockly.utils.string'], {'lang': 'es6', 'module': 'goog'});