Migrate core/renderers/geras/drawer.js to goog.module syntax (#5300)

* Migrate core/renderers/geras/drawer.js to ES6 const/let

* Migrate core/renderers/geras/drawer.js to goog.module

* Migrate core/renderers/geras/drawer.js to named requires

* clang-format core/renderers/geras/drawer.js

* Remove Blockly prefix on call to blockRendering in core/renderers/geras/drawer.js

core/renderers/geras/drawer.js

@@ -10,51 +10,54 @@
  */
 'use strict';
 
-goog.provide('Blockly.geras.Drawer');
+goog.module('Blockly.geras.Drawer');
+goog.module.declareLegacyNamespace();
 
-goog.require('Blockly.blockRendering.Drawer');
-goog.require('Blockly.geras.Highlighter');
-goog.require('Blockly.geras.RenderInfo');
-goog.require('Blockly.utils.object');
-goog.require('Blockly.utils.svgPaths');
-
-goog.requireType('Blockly.BlockSvg');
-goog.requireType('Blockly.geras.PathObject');
+const BaseDrawer = goog.require('Blockly.blockRendering.Drawer');
+/* eslint-disable-next-line no-unused-vars */
+const BlockSvg = goog.requireType('Blockly.BlockSvg');
+const Highlighter = goog.require('Blockly.geras.Highlighter');
+/* eslint-disable-next-line no-unused-vars */
+const PathObject = goog.requireType('Blockly.geras.PathObject');
+/* eslint-disable-next-line no-unused-vars */
+const RenderInfo = goog.requireType('Blockly.geras.RenderInfo');
+const blockRendering = goog.require('Blockly.blockRendering');
+const object = goog.require('Blockly.utils.object');
+const svgPaths = goog.require('Blockly.utils.svgPaths');
 
 
 /**
  * An object that draws a block based on the given rendering information.
- * @param {!Blockly.BlockSvg} block The block to render.
- * @param {!Blockly.geras.RenderInfo} info An object containing all
+ * @param {!BlockSvg} block The block to render.
+ * @param {!RenderInfo} info An object containing all
  *   information needed to render this block.
  * @package
  * @constructor
- * @extends {Blockly.blockRendering.Drawer}
+ * @extends {BaseDrawer}
  */
-Blockly.geras.Drawer = function(block, info) {
-  Blockly.geras.Drawer.superClass_.constructor.call(this, block, info);
+const Drawer = function(block, info) {
+  Drawer.superClass_.constructor.call(this, block, info);
   // Unlike Thrasos, Geras has highlights and drop shadows.
-  this.highlighter_ = new Blockly.geras.Highlighter(info);
+  this.highlighter_ = new Highlighter(info);
 };
-Blockly.utils.object.inherits(Blockly.geras.Drawer,
-    Blockly.blockRendering.Drawer);
+object.inherits(Drawer, BaseDrawer);
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.draw = function() {
+Drawer.prototype.draw = function() {
   this.hideHiddenIcons_();
   this.drawOutline_();
   this.drawInternals_();
 
-  var pathObject =
-    /** @type {!Blockly.geras.PathObject} */ (this.block_.pathObject);
+  const pathObject =
+      /** @type {!PathObject} */ (this.block_.pathObject);
   pathObject.setPath(this.outlinePath_ + '\n' + this.inlinePath_);
   pathObject.setHighlightPath(this.highlighter_.getPath());
   if (this.info_.RTL) {
     pathObject.flipRTL();
   }
-  if (Blockly.blockRendering.isDebuggerEnabled()) {
+  if (blockRendering.isDebuggerEnabled()) {
     this.block_.renderingDebugger.drawDebug(this.block_, this.info_);
   }
   this.recordSizeOnBlock_();
@@ -63,58 +66,57 @@ Blockly.geras.Drawer.prototype.draw = function() {
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawTop_ = function() {
+Drawer.prototype.drawTop_ = function() {
   this.highlighter_.drawTopCorner(this.info_.topRow);
   this.highlighter_.drawRightSideRow(this.info_.topRow);
 
-  Blockly.geras.Drawer.superClass_.drawTop_.call(this);
+  Drawer.superClass_.drawTop_.call(this);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawJaggedEdge_ = function(row) {
+Drawer.prototype.drawJaggedEdge_ = function(row) {
   this.highlighter_.drawJaggedEdge_(row);
 
-  Blockly.geras.Drawer.superClass_.drawJaggedEdge_.call(this, row);
+  Drawer.superClass_.drawJaggedEdge_.call(this, row);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawValueInput_ = function(row) {
+Drawer.prototype.drawValueInput_ = function(row) {
   this.highlighter_.drawValueInput(row);
 
-  Blockly.geras.Drawer.superClass_.drawValueInput_.call(this, row);
+  Drawer.superClass_.drawValueInput_.call(this, row);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawStatementInput_ = function(row) {
+Drawer.prototype.drawStatementInput_ = function(row) {
   this.highlighter_.drawStatementInput(row);
 
-  Blockly.geras.Drawer.superClass_.drawStatementInput_.call(this, row);
+  Drawer.superClass_.drawStatementInput_.call(this, row);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawRightSideRow_ = function(row) {
+Drawer.prototype.drawRightSideRow_ = function(row) {
   this.highlighter_.drawRightSideRow(row);
 
-  this.outlinePath_ +=
-      Blockly.utils.svgPaths.lineOnAxis('H', row.xPos + row.width) +
-      Blockly.utils.svgPaths.lineOnAxis('V', row.yPos + row.height);
+  this.outlinePath_ += svgPaths.lineOnAxis('H', row.xPos + row.width) +
+      svgPaths.lineOnAxis('V', row.yPos + row.height);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawBottom_ = function() {
+Drawer.prototype.drawBottom_ = function() {
   this.highlighter_.drawBottomRow(this.info_.bottomRow);
 
-  Blockly.geras.Drawer.superClass_.drawBottom_.call(this);
+  Drawer.superClass_.drawBottom_.call(this);
 };
 
 /**
@@ -123,65 +125,64 @@ Blockly.geras.Drawer.prototype.drawBottom_ = function() {
  * @protected
  * @override
  */
-Blockly.geras.Drawer.prototype.drawLeft_ = function() {
+Drawer.prototype.drawLeft_ = function() {
   this.highlighter_.drawLeft();
 
-  Blockly.geras.Drawer.superClass_.drawLeft_.call(this);
+  Drawer.superClass_.drawLeft_.call(this);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.drawInlineInput_ = function(input) {
+Drawer.prototype.drawInlineInput_ = function(input) {
   this.highlighter_.drawInlineInput(input);
 
-  Blockly.geras.Drawer.superClass_.drawInlineInput_.call(this, input);
+  Drawer.superClass_.drawInlineInput_.call(this, input);
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.positionInlineInputConnection_ = function(input) {
-  var yPos = input.centerline - input.height / 2;
+Drawer.prototype.positionInlineInputConnection_ = function(input) {
+  const yPos = input.centerline - input.height / 2;
   // Move the connection.
   if (input.connectionModel) {
     // xPos already contains info about startX
-    var connX = input.xPos + input.connectionWidth +
-        this.constants_.DARK_PATH_OFFSET;
+    let connX =
+        input.xPos + input.connectionWidth + this.constants_.DARK_PATH_OFFSET;
     if (this.info_.RTL) {
       connX *= -1;
     }
     input.connectionModel.setOffsetInBlock(
-        connX, yPos + input.connectionOffsetY +
-        this.constants_.DARK_PATH_OFFSET);
+        connX,
+        yPos + input.connectionOffsetY + this.constants_.DARK_PATH_OFFSET);
   }
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.positionStatementInputConnection_ = function(row) {
-  var input = row.getLastInput();
+Drawer.prototype.positionStatementInputConnection_ = function(row) {
+  const input = row.getLastInput();
   if (input.connectionModel) {
-    var connX = row.xPos + row.statementEdge + input.notchOffset;
+    let connX = row.xPos + row.statementEdge + input.notchOffset;
     if (this.info_.RTL) {
       connX *= -1;
     } else {
       connX += this.constants_.DARK_PATH_OFFSET;
     }
-    input.connectionModel.setOffsetInBlock(connX,
-        row.yPos + this.constants_.DARK_PATH_OFFSET);
+    input.connectionModel.setOffsetInBlock(
+        connX, row.yPos + this.constants_.DARK_PATH_OFFSET);
   }
 };
 
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.positionExternalValueConnection_ = function(row) {
-  var input = row.getLastInput();
+Drawer.prototype.positionExternalValueConnection_ = function(row) {
+  const input = row.getLastInput();
   if (input.connectionModel) {
-    var connX = row.xPos + row.width +
-        this.constants_.DARK_PATH_OFFSET;
+    let connX = row.xPos + row.width + this.constants_.DARK_PATH_OFFSET;
     if (this.info_.RTL) {
       connX *= -1;
     }
@@ -192,15 +193,17 @@ Blockly.geras.Drawer.prototype.positionExternalValueConnection_ = function(row)
 /**
  * @override
  */
-Blockly.geras.Drawer.prototype.positionNextConnection_ = function() {
-  var bottomRow = this.info_.bottomRow;
+Drawer.prototype.positionNextConnection_ = function() {
+  const bottomRow = this.info_.bottomRow;
 
   if (bottomRow.connection) {
-    var connInfo = bottomRow.connection;
-    var x = connInfo.xPos;  // Already contains info about startX.
-    var connX = (this.info_.RTL ? -x : x) +
-        (this.constants_.DARK_PATH_OFFSET / 2);
+    const connInfo = bottomRow.connection;
+    const x = connInfo.xPos;  // Already contains info about startX.
+    const connX =
+        (this.info_.RTL ? -x : x) + (this.constants_.DARK_PATH_OFFSET / 2);
     connInfo.connectionModel.setOffsetInBlock(
         connX, bottomRow.baseline + this.constants_.DARK_PATH_OFFSET);
   }
 };
+
+exports = Drawer;

tests/deps.js

@@ -139,7 +139,7 @@ goog.addDependency('../../core/renderers/common/marker_svg.js', ['Blockly.blockR
 goog.addDependency('../../core/renderers/common/path_object.js', ['Blockly.blockRendering.PathObject'], ['Blockly.blockRendering.IPathObject', 'Blockly.utils.Svg', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/renderers/common/renderer.js', ['Blockly.blockRendering.Renderer'], ['Blockly.IRegistrable', 'Blockly.InsertionMarkerManager', 'Blockly.blockRendering.ConstantProvider', 'Blockly.blockRendering.Debug', 'Blockly.blockRendering.Drawer', 'Blockly.blockRendering.IPathObject', 'Blockly.blockRendering.MarkerSvg', 'Blockly.blockRendering.PathObject', 'Blockly.blockRendering.RenderInfo', 'Blockly.connectionTypes']);
 goog.addDependency('../../core/renderers/geras/constants.js', ['Blockly.geras.ConstantProvider'], ['Blockly.blockRendering.ConstantProvider', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'});
-goog.addDependency('../../core/renderers/geras/drawer.js', ['Blockly.geras.Drawer'], ['Blockly.blockRendering.Drawer', 'Blockly.geras.Highlighter', 'Blockly.geras.RenderInfo', 'Blockly.utils.object', 'Blockly.utils.svgPaths']);
+goog.addDependency('../../core/renderers/geras/drawer.js', ['Blockly.geras.Drawer'], ['Blockly.blockRendering', 'Blockly.blockRendering.Drawer', 'Blockly.geras.Highlighter', 'Blockly.utils.object', 'Blockly.utils.svgPaths'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/renderers/geras/highlight_constants.js', ['Blockly.geras.HighlightConstantProvider'], ['Blockly.utils.svgPaths'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/renderers/geras/highlighter.js', ['Blockly.geras.Highlighter'], ['Blockly.blockRendering.Types', 'Blockly.utils.svgPaths'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/renderers/geras/info.js', ['Blockly.geras.RenderInfo'], ['Blockly.blockRendering.ExternalValueInput', 'Blockly.blockRendering.InRowSpacer', 'Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Types', 'Blockly.geras.InlineInput', 'Blockly.geras.StatementInput', 'Blockly.inputTypes', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'});