blockly 7.20211209.4 → 8.0.1

package/core/renderers/geras/drawer.js

@@ -16,13 +16,16 @@
 goog.module('Blockly.geras.Drawer');
 
 const debug = goog.require('Blockly.blockRendering.debug');
-const object = goog.require('Blockly.utils.object');
 const svgPaths = goog.require('Blockly.utils.svgPaths');
 /* eslint-disable-next-line no-unused-vars */
 const {BlockSvg} = goog.requireType('Blockly.BlockSvg');
+/* eslint-disable-next-line no-unused-vars */
+const {ConstantProvider} = goog.requireType('Blockly.geras.ConstantProvider');
 const {Drawer: BaseDrawer} = goog.require('Blockly.blockRendering.Drawer');
 const {Highlighter} = goog.require('Blockly.geras.Highlighter');
 /* eslint-disable-next-line no-unused-vars */
+const {InlineInput} = goog.require('Blockly.geras.InlineInput');
+/* 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');
@@ -30,183 +33,188 @@ const {RenderInfo} = goog.requireType('Blockly.geras.RenderInfo');
 
 /**
  * An object that draws a block based on the given rendering information.
- * @param {!BlockSvg} block The block to render.
- * @param {!RenderInfo} info An object containing all
- *   information needed to render this block.
- * @package
- * @constructor
  * @extends {BaseDrawer}
  * @alias Blockly.geras.Drawer
  */
-const Drawer = function(block, info) {
-  Drawer.superClass_.constructor.call(this, block, info);
-  // Unlike Thrasos, Geras has highlights and drop shadows.
-  this.highlighter_ = new Highlighter(info);
-};
-object.inherits(Drawer, BaseDrawer);
-
-/**
- * @override
- */
-Drawer.prototype.draw = function() {
-  this.hideHiddenIcons_();
-  this.drawOutline_();
-  this.drawInternals_();
-
-  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();
+class Drawer extends BaseDrawer {
+  /**
+   * @param {!BlockSvg} block The block to render.
+   * @param {!RenderInfo} info An object containing all
+   *   information needed to render this block.
+   * @package
+   */
+  constructor(block, info) {
+    super(block, info);
+    // Unlike Thrasos, Geras has highlights and drop shadows.
+    this.highlighter_ = new Highlighter(info);
+
+    /** @type {!ConstantProvider} */
+    this.constants_;
   }
-  if (debug.isDebuggerEnabled()) {
-    this.block_.renderingDebugger.drawDebug(this.block_, this.info_);
+
+  /**
+   * @override
+   */
+  draw() {
+    this.hideHiddenIcons_();
+    this.drawOutline_();
+    this.drawInternals_();
+
+    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 (debug.isDebuggerEnabled()) {
+      this.block_.renderingDebugger.drawDebug(this.block_, this.info_);
+    }
+    this.recordSizeOnBlock_();
   }
-  this.recordSizeOnBlock_();
-};
 
-/**
- * @override
- */
-Drawer.prototype.drawTop_ = function() {
-  this.highlighter_.drawTopCorner(this.info_.topRow);
-  this.highlighter_.drawRightSideRow(this.info_.topRow);
+  /**
+   * @override
+   */
+  drawTop_() {
+    this.highlighter_.drawTopCorner(this.info_.topRow);
+    this.highlighter_.drawRightSideRow(this.info_.topRow);
 
-  Drawer.superClass_.drawTop_.call(this);
-};
+    super.drawTop_();
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawJaggedEdge_ = function(row) {
-  this.highlighter_.drawJaggedEdge_(row);
+  /**
+   * @override
+   */
+  drawJaggedEdge_(row) {
+    this.highlighter_.drawJaggedEdge_(row);
 
-  Drawer.superClass_.drawJaggedEdge_.call(this, row);
-};
+    super.drawJaggedEdge_(row);
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawValueInput_ = function(row) {
-  this.highlighter_.drawValueInput(row);
+  /**
+   * @override
+   */
+  drawValueInput_(row) {
+    this.highlighter_.drawValueInput(row);
 
-  Drawer.superClass_.drawValueInput_.call(this, row);
-};
+    super.drawValueInput_(row);
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawStatementInput_ = function(row) {
-  this.highlighter_.drawStatementInput(row);
+  /**
+   * @override
+   */
+  drawStatementInput_(row) {
+    this.highlighter_.drawStatementInput(row);
 
-  Drawer.superClass_.drawStatementInput_.call(this, row);
-};
+    super.drawStatementInput_(row);
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawRightSideRow_ = function(row) {
-  this.highlighter_.drawRightSideRow(row);
+  /**
+   * @override
+   */
+  drawRightSideRow_(row) {
+    this.highlighter_.drawRightSideRow(row);
 
-  this.outlinePath_ += svgPaths.lineOnAxis('H', row.xPos + row.width) +
-      svgPaths.lineOnAxis('V', row.yPos + row.height);
-};
+    this.outlinePath_ += svgPaths.lineOnAxis('H', row.xPos + row.width) +
+        svgPaths.lineOnAxis('V', row.yPos + row.height);
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawBottom_ = function() {
-  this.highlighter_.drawBottomRow(this.info_.bottomRow);
+  /**
+   * @override
+   */
+  drawBottom_() {
+    this.highlighter_.drawBottomRow(this.info_.bottomRow);
 
-  Drawer.superClass_.drawBottom_.call(this);
-};
+    super.drawBottom_();
+  }
 
-/**
- * Add steps for the left side of the block, which may include an output
- * connection
- * @protected
- * @override
- */
-Drawer.prototype.drawLeft_ = function() {
-  this.highlighter_.drawLeft();
+  /**
+   * Add steps for the left side of the block, which may include an output
+   * connection
+   * @protected
+   * @override
+   */
+  drawLeft_() {
+    this.highlighter_.drawLeft();
 
-  Drawer.superClass_.drawLeft_.call(this);
-};
+    super.drawLeft_();
+  }
 
-/**
- * @override
- */
-Drawer.prototype.drawInlineInput_ = function(input) {
-  this.highlighter_.drawInlineInput(input);
+  /**
+   * @override
+   */
+  drawInlineInput_(input) {
+    this.highlighter_.drawInlineInput(/** @type {!InlineInput} */ (input));
 
-  Drawer.superClass_.drawInlineInput_.call(this, input);
-};
+    super.drawInlineInput_(input);
+  }
 
-/**
- * @override
- */
-Drawer.prototype.positionInlineInputConnection_ = function(input) {
-  const yPos = input.centerline - input.height / 2;
-  // Move the connection.
-  if (input.connectionModel) {
-    // xPos already contains info about startX
-    let connX =
-        input.xPos + input.connectionWidth + this.constants_.DARK_PATH_OFFSET;
-    if (this.info_.RTL) {
-      connX *= -1;
+  /**
+   * @override
+   */
+  positionInlineInputConnection_(input) {
+    const yPos = input.centerline - input.height / 2;
+    // Move the connection.
+    if (input.connectionModel) {
+      // xPos already contains info about startX
+      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);
     }
-    input.connectionModel.setOffsetInBlock(
-        connX,
-        yPos + input.connectionOffsetY + this.constants_.DARK_PATH_OFFSET);
   }
-};
 
-/**
- * @override
- */
-Drawer.prototype.positionStatementInputConnection_ = function(row) {
-  const input = row.getLastInput();
-  if (input.connectionModel) {
-    let connX = row.xPos + row.statementEdge + input.notchOffset;
-    if (this.info_.RTL) {
-      connX *= -1;
-    } else {
-      connX += this.constants_.DARK_PATH_OFFSET;
+  /**
+   * @override
+   */
+  positionStatementInputConnection_(row) {
+    const input = row.getLastInput();
+    if (input.connectionModel) {
+      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
- */
-Drawer.prototype.positionExternalValueConnection_ = function(row) {
-  const input = row.getLastInput();
-  if (input.connectionModel) {
-    let connX = row.xPos + row.width + this.constants_.DARK_PATH_OFFSET;
-    if (this.info_.RTL) {
-      connX *= -1;
+  /**
+   * @override
+   */
+  positionExternalValueConnection_(row) {
+    const input = row.getLastInput();
+    if (input.connectionModel) {
+      let connX = row.xPos + row.width + this.constants_.DARK_PATH_OFFSET;
+      if (this.info_.RTL) {
+        connX *= -1;
+      }
+      input.connectionModel.setOffsetInBlock(connX, row.yPos);
     }
-    input.connectionModel.setOffsetInBlock(connX, row.yPos);
   }
-};
 
-/**
- * @override
- */
-Drawer.prototype.positionNextConnection_ = function() {
-  const bottomRow = this.info_.bottomRow;
-
-  if (bottomRow.connection) {
-    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);
+  /**
+   * @override
+   */
+  positionNextConnection_() {
+    const bottomRow = this.info_.bottomRow;
+
+    if (bottomRow.connection) {
+      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 = Drawer;