Render a notch after a statement input in zelos (#3326)

core/renderers/common/constants.js

@@ -74,6 +74,9 @@ Blockly.blockRendering.ConstantProvider = function() {
   this.STATEMENT_INPUT_PADDING_LEFT = 20;
   this.BETWEEN_STATEMENT_PADDING_Y = 4;
 
+  // The minimum height of the bottom row following a statement input.
+  this.AFTER_STATEMENT_BOTTOM_ROW_MIN_HEIGHT = this.LARGE_PADDING;
+
   // This is the max width of a bottom row that follows a statement input and
   // has inputs inline.
   this.MAX_BOTTOM_WIDTH = 66.5;

core/renderers/common/info.js

@@ -307,7 +307,8 @@ Blockly.blockRendering.RenderInfo.prototype.populateBottomRow_ = function() {
   // This is the minimum height for the row. If one of its elements has a
   // greater height it will be overwritten in the compute pass.
   if (followsStatement) {
-    this.bottomRow.minHeight = this.constants_.LARGE_PADDING;
+    this.bottomRow.minHeight =
+      this.constants_.AFTER_STATEMENT_BOTTOM_ROW_MIN_HEIGHT;
   } else {
     this.bottomRow.minHeight = this.constants_.MEDIUM_PADDING;
   }

core/renderers/zelos/constants.js

@@ -70,6 +70,15 @@ Blockly.zelos.ConstantProvider = function() {
    */
   this.TAB_OFFSET_FROM_TOP = 0;
 
+  /**
+   * @override
+   */
+  this.STATEMENT_BOTTOM_SPACER = -this.NOTCH_HEIGHT;
+
+  /**
+   * @override
+   */
+  this.AFTER_STATEMENT_BOTTOM_ROW_MIN_HEIGHT = this.LARGE_PADDING * 2;
 };
 Blockly.utils.object.inherits(Blockly.zelos.ConstantProvider,
     Blockly.blockRendering.ConstantProvider);

core/renderers/zelos/drawer.js

@@ -211,3 +211,35 @@ Blockly.zelos.Drawer.prototype.drawInlineInput_ = function(input) {
   // Don't draw an inline input.
   this.positionInlineInputConnection_(input);
 };
+
+/**
+ * @override
+ */
+Blockly.zelos.Drawer.prototype.drawStatementInput_ = function(row) {
+  var input = row.getLastInput();
+  // Where to start drawing the notch, which is on the right side in LTR.
+  var x = input.xPos + input.notchOffset + input.shape.width;
+
+  var innerTopLeftCorner =
+      input.shape.pathRight +
+      Blockly.utils.svgPaths.lineOnAxis('h',
+          -(input.notchOffset - this.constants_.INSIDE_CORNERS.width)) +
+      this.constants_.INSIDE_CORNERS.pathTop;
+
+  var innerHeight =
+      row.height - (2 * this.constants_.INSIDE_CORNERS.height);
+
+  var innerBottomLeftCorner =
+    this.constants_.INSIDE_CORNERS.pathBottom +
+    Blockly.utils.svgPaths.lineOnAxis('h',
+        (input.notchOffset - this.constants_.INSIDE_CORNERS.width)) +
+    input.shape.pathLeft;
+
+  this.outlinePath_ += Blockly.utils.svgPaths.lineOnAxis('H', x) +
+      innerTopLeftCorner +
+      Blockly.utils.svgPaths.lineOnAxis('v', innerHeight) +
+      innerBottomLeftCorner +
+      Blockly.utils.svgPaths.lineOnAxis('H', row.xPos + row.width);
+
+  this.positionStatementInputConnection_(row);
+};