From 0240b3acd39be85e33de8b6db1fe782c53037e94 Mon Sep 17 00:00:00 2001 From: Beka Westberg Date: Thu, 4 Aug 2022 20:58:06 +0000 Subject: [PATCH] refactor: remove AnyDuringMigration from the block drag surface (#6302) * fix: unnecessary nullability * fix: rename SVG_ to svg_ * fix: add deprecation warning * chore: format --- core/block_drag_surface.ts | 63 ++++++++++++++++---------------------- 1 file changed, 27 insertions(+), 36 deletions(-) diff --git a/core/block_drag_surface.ts b/core/block_drag_surface.ts index cca671a6f..7bd4dcfd5 100644 --- a/core/block_drag_surface.ts +++ b/core/block_drag_surface.ts @@ -26,6 +26,7 @@ import * as goog from '../closure/goog/goog.js'; goog.declareModuleId('Blockly.BlockDragSurfaceSvg'); import {Coordinate} from './utils/coordinate.js'; +import * as deprecation from './utils/deprecation.js'; import * as dom from './utils/dom.js'; import {Svg} from './utils/svg.js'; import * as svgMath from './utils/svg_math.js'; @@ -38,13 +39,13 @@ import * as svgMath from './utils/svg_math.js'; */ export class BlockDragSurfaceSvg { /** The SVG drag surface. Set once by BlockDragSurfaceSvg.createDom. */ - private SVG_: SVGElement|null = null; + private svg_: SVGElement; /** * This is where blocks live while they are being dragged if the drag * surface is enabled. */ - private dragGroup_: SVGElement|null = null; + private dragGroup_: SVGElement; /** * Cached value for the scale of the drag surface. @@ -57,7 +58,7 @@ export class BlockDragSurfaceSvg { * This translation is in pixel units, because the scale is applied to the * drag group rather than the top-level SVG. */ - private surfaceXY_: Coordinate|null = null; + private surfaceXY_: Coordinate = new Coordinate(0, 0); private readonly childSurfaceXY_: Coordinate; /** @param container Containing element. */ @@ -69,16 +70,7 @@ export class BlockDragSurfaceSvg { */ this.childSurfaceXY_ = new Coordinate(0, 0); - this.createDom(); - } - - /** Create the drag surface and inject it into the container. */ - createDom() { - if (this.SVG_) { - return; - } - // Already created. - this.SVG_ = dom.createSvgElement( + this.svg_ = dom.createSvgElement( Svg.SVG, { 'xmlns': dom.SVG_NS, 'xmlns:html': dom.HTML_NS, @@ -87,10 +79,14 @@ export class BlockDragSurfaceSvg { 'class': 'blocklyBlockDragSurface', }, this.container); - // AnyDuringMigration because: Argument of type 'SVGElement | null' is not - // assignable to parameter of type 'Element | undefined'. - this.dragGroup_ = - dom.createSvgElement(Svg.G, {}, this.SVG_ as AnyDuringMigration); + this.dragGroup_ = dom.createSvgElement(Svg.G, {}, this.svg_ as SVGElement); + } + + /** Create the drag surface and inject it into the container. */ + createDom() { + // No alternative provided, because now the dom is just automatically + // created in the constructor now. + deprecation.warn('BlockDragSurfaceSvg createDom', 'June 2022', 'June 2023'); } /** @@ -99,12 +95,12 @@ export class BlockDragSurfaceSvg { * @param blocks Block or group of blocks to place on the drag surface. */ setBlocksAndShow(blocks: SVGElement) { - if (this.dragGroup_!.childNodes.length) { + if (this.dragGroup_.childNodes.length) { throw Error('Already dragging a block.'); } // appendChild removes the blocks from the previous parent - this.dragGroup_!.appendChild(blocks); - this.SVG_!.style.display = 'block'; + this.dragGroup_.appendChild(blocks); + this.svg_.style.display = 'block'; this.surfaceXY_ = new Coordinate(0, 0); } @@ -137,13 +133,8 @@ export class BlockDragSurfaceSvg { // Make sure the svg exists on a pixel boundary so that it is not fuzzy. x = Math.round(x); y = Math.round(y); - this.SVG_!.style.display = 'block'; - - // AnyDuringMigration because: Argument of type 'SVGElement | null' is not - // assignable to parameter of type 'Element'. - dom.setCssTransform( - this.SVG_ as AnyDuringMigration, - 'translate3d(' + x + 'px, ' + y + 'px, 0)'); + this.svg_.style.display = 'block'; + dom.setCssTransform(this.svg_, 'translate3d(' + x + 'px, ' + y + 'px, 0)'); } /** @@ -152,8 +143,8 @@ export class BlockDragSurfaceSvg { * @param deltaY Vertical offset in pixel units. */ translateBy(deltaX: number, deltaY: number) { - const x = this.surfaceXY_!.x + deltaX; - const y = this.surfaceXY_!.y + deltaY; + const x = this.surfaceXY_.x + deltaX; + const y = this.surfaceXY_.y + deltaY; this.surfaceXY_ = new Coordinate(x, y); this.translateSurfaceInternal_(); } @@ -177,7 +168,7 @@ export class BlockDragSurfaceSvg { * @return Current translation of the surface. */ getSurfaceTranslation(): Coordinate { - const xy = svgMath.getRelativeXY(this.SVG_ as SVGElement); + const xy = svgMath.getRelativeXY(this.svg_ as SVGElement); return new Coordinate(xy.x / this.scale_, xy.y / this.scale_); } @@ -195,7 +186,7 @@ export class BlockDragSurfaceSvg { * @returns The SVG drag surface. */ getSvgRoot(): SVGElement|null { - return this.SVG_; + return this.svg_; } /** @@ -204,7 +195,7 @@ export class BlockDragSurfaceSvg { * @return Drag surface block DOM element, or null if no blocks exist. */ getCurrentBlock(): Element|null { - return this.dragGroup_!.firstChild as Element; + return this.dragGroup_.firstChild as Element; } /** @@ -234,13 +225,13 @@ export class BlockDragSurfaceSvg { // appendChild removes the node from this.dragGroup_ opt_newSurface.appendChild(currentBlockElement); } else { - this.dragGroup_!.removeChild(currentBlockElement); + this.dragGroup_.removeChild(currentBlockElement); } } - this.SVG_!.style.display = 'none'; - if (this.dragGroup_!.childNodes.length) { + this.svg_.style.display = 'none'; + if (this.dragGroup_.childNodes.length) { throw Error('Drag group was not cleared.'); } - this.surfaceXY_ = null; + this.surfaceXY_ = new Coordinate(0, 0); } }