mirror of
https://github.com/google/blockly.git
synced 2026-01-11 10:57:07 +01:00
Merge pull request #5083 from rachel-fenichel/update_common_drawer
Migrate core/renderers/common/drawer.js to goog.module syntax
This commit is contained in:
Rachel Fenichel
GitHub
@@ -10,29 +10,29 @@
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
goog.provide('Blockly.blockRendering.Drawer');
|
||||
goog.module('Blockly.blockRendering.Drawer');
|
||||
goog.module.declareLegacyNamespace();
|
||||
|
||||
goog.require('Blockly.blockRendering.RenderInfo');
|
||||
goog.require('Blockly.blockRendering.Row');
|
||||
goog.require('Blockly.blockRendering.Types');
|
||||
goog.require('Blockly.utils.svgPaths');
|
||||
|
||||
goog.requireType('Blockly.blockRendering.ConstantProvider');
|
||||
goog.requireType('Blockly.blockRendering.Field');
|
||||
goog.requireType('Blockly.blockRendering.Icon');
|
||||
goog.requireType('Blockly.blockRendering.InlineInput');
|
||||
goog.requireType('Blockly.BlockSvg');
|
||||
const BlockSvg = goog.requireType('Blockly.BlockSvg');
|
||||
const ConstantProvider = goog.requireType('Blockly.blockRendering.ConstantProvider');
|
||||
const Field = goog.requireType('Blockly.blockRendering.Field');
|
||||
const Icon = goog.requireType('Blockly.blockRendering.Icon');
|
||||
const InlineInput = goog.requireType('Blockly.blockRendering.InlineInput');
|
||||
const RenderInfo = goog.requireType('Blockly.blockRendering.RenderInfo');
|
||||
const Row = goog.require('Blockly.blockRendering.Row');
|
||||
const svgPaths = goog.require('Blockly.utils.svgPaths');
|
||||
const Types = goog.require('Blockly.blockRendering.Types');
|
||||
|
||||
|
||||
/**
|
||||
* An object that draws a block based on the given rendering information.
|
||||
* @param {!Blockly.BlockSvg} block The block to render.
|
||||
* @param {!Blockly.blockRendering.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
|
||||
*/
|
||||
Blockly.blockRendering.Drawer = function(block, info) {
|
||||
const Drawer = function(block, info) {
|
||||
this.block_ = block;
|
||||
this.info_ = info;
|
||||
this.topLeft_ = block.getRelativeToSurfaceXY();
|
||||
@@ -41,7 +41,7 @@ Blockly.blockRendering.Drawer = function(block, info) {
|
||||
|
||||
/**
|
||||
* The renderer's constant provider.
|
||||
* @type {!Blockly.blockRendering.ConstantProvider}
|
||||
* @type {!ConstantProvider}
|
||||
* @protected
|
||||
*/
|
||||
this.constants_ = info.getRenderer().getConstants();
|
||||
@@ -57,7 +57,7 @@ Blockly.blockRendering.Drawer = function(block, info) {
|
||||
* required.
|
||||
* @package
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.draw = function() {
|
||||
Drawer.prototype.draw = function() {
|
||||
this.hideHiddenIcons_();
|
||||
this.drawOutline_();
|
||||
this.drawInternals_();
|
||||
@@ -78,7 +78,7 @@ Blockly.blockRendering.Drawer.prototype.draw = function() {
|
||||
* render. Anything that needs to be kept around should be set in this function.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.recordSizeOnBlock_ = function() {
|
||||
Drawer.prototype.recordSizeOnBlock_ = function() {
|
||||
// This is used when the block is reporting its size to anyone else.
|
||||
// The dark path adds to the size of the block in both X and Y.
|
||||
this.block_.height = this.info_.height;
|
||||
@@ -89,8 +89,8 @@ Blockly.blockRendering.Drawer.prototype.recordSizeOnBlock_ = function() {
|
||||
* Hide icons that were marked as hidden.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.hideHiddenIcons_ = function() {
|
||||
for (var i = 0, iconInfo; (iconInfo = this.info_.hiddenIcons[i]); i++) {
|
||||
Drawer.prototype.hideHiddenIcons_ = function() {
|
||||
for (let i = 0, iconInfo; (iconInfo = this.info_.hiddenIcons[i]); i++) {
|
||||
iconInfo.icon.iconGroup_.setAttribute('display', 'none');
|
||||
}
|
||||
};
|
||||
@@ -99,10 +99,10 @@ Blockly.blockRendering.Drawer.prototype.hideHiddenIcons_ = function() {
|
||||
* Create the outline of the block. This is a single continuous path.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawOutline_ = function() {
|
||||
Drawer.prototype.drawOutline_ = function() {
|
||||
this.drawTop_();
|
||||
for (var r = 1; r < this.info_.rows.length - 1; r++) {
|
||||
var row = this.info_.rows[r];
|
||||
for (let r = 1; r < this.info_.rows.length - 1; r++) {
|
||||
const row = this.info_.rows[r];
|
||||
if (row.hasJaggedEdge) {
|
||||
this.drawJaggedEdge_(row);
|
||||
} else if (row.hasStatement) {
|
||||
@@ -123,91 +123,80 @@ Blockly.blockRendering.Drawer.prototype.drawOutline_ = function() {
|
||||
* details such as hats and rounded corners.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawTop_ = function() {
|
||||
var topRow = this.info_.topRow;
|
||||
var elements = topRow.elements;
|
||||
Drawer.prototype.drawTop_ = function() {
|
||||
const topRow = this.info_.topRow;
|
||||
const elements = topRow.elements;
|
||||
|
||||
this.positionPreviousConnection_();
|
||||
this.outlinePath_ +=
|
||||
Blockly.utils.svgPaths.moveBy(topRow.xPos, this.info_.startY);
|
||||
for (var i = 0, elem; (elem = elements[i]); i++) {
|
||||
if (Blockly.blockRendering.Types.isLeftRoundedCorner(elem)) {
|
||||
this.outlinePath_ +=
|
||||
this.constants_.OUTSIDE_CORNERS.topLeft;
|
||||
} else if (Blockly.blockRendering.Types.isRightRoundedCorner(elem)) {
|
||||
this.outlinePath_ +=
|
||||
this.constants_.OUTSIDE_CORNERS.topRight;
|
||||
} else if (Blockly.blockRendering.Types.isPreviousConnection(elem)) {
|
||||
this.outlinePath_ += svgPaths.moveBy(topRow.xPos, this.info_.startY);
|
||||
for (let i = 0, elem; (elem = elements[i]); i++) {
|
||||
if (Types.isLeftRoundedCorner(elem)) {
|
||||
this.outlinePath_ += this.constants_.OUTSIDE_CORNERS.topLeft;
|
||||
} else if (Types.isRightRoundedCorner(elem)) {
|
||||
this.outlinePath_ += this.constants_.OUTSIDE_CORNERS.topRight;
|
||||
} else if (Types.isPreviousConnection(elem)) {
|
||||
this.outlinePath_ += elem.shape.pathLeft;
|
||||
} else if (Blockly.blockRendering.Types.isHat(elem)) {
|
||||
} else if (Types.isHat(elem)) {
|
||||
this.outlinePath_ += this.constants_.START_HAT.path;
|
||||
} else if (Blockly.blockRendering.Types.isSpacer(elem)) {
|
||||
this.outlinePath_ += Blockly.utils.svgPaths.lineOnAxis('h', elem.width);
|
||||
} else if (Types.isSpacer(elem)) {
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('h', elem.width);
|
||||
}
|
||||
// No branch for a square corner, because it's a no-op.
|
||||
}
|
||||
this.outlinePath_ += Blockly.utils.svgPaths.lineOnAxis('v', topRow.height);
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('v', topRow.height);
|
||||
};
|
||||
|
||||
/**
|
||||
* Add steps for the jagged edge of a row on a collapsed block.
|
||||
* @param {!Blockly.blockRendering.Row} row The row to draw the side of.
|
||||
* @param {!Row} row The row to draw the side of.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawJaggedEdge_ = function(row) {
|
||||
var remainder =
|
||||
row.height - this.constants_.JAGGED_TEETH.height;
|
||||
this.outlinePath_ += this.constants_.JAGGED_TEETH.path +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', remainder);
|
||||
Drawer.prototype.drawJaggedEdge_ = function(row) {
|
||||
const remainder = row.height - this.constants_.JAGGED_TEETH.height;
|
||||
this.outlinePath_ +=
|
||||
this.constants_.JAGGED_TEETH.path + svgPaths.lineOnAxis('v', remainder);
|
||||
};
|
||||
|
||||
/**
|
||||
* Add steps for an external value input, rendered as a notch in the side
|
||||
* of the block.
|
||||
* @param {!Blockly.blockRendering.Row} row The row that this input
|
||||
* belongs to.
|
||||
* @param {!Row} row The row that this input belongs to.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawValueInput_ = function(row) {
|
||||
var input = row.getLastInput();
|
||||
Drawer.prototype.drawValueInput_ = function(row) {
|
||||
const input = row.getLastInput();
|
||||
this.positionExternalValueConnection_(row);
|
||||
|
||||
var pathDown = (typeof input.shape.pathDown == "function") ?
|
||||
const pathDown = (typeof input.shape.pathDown == 'function') ?
|
||||
input.shape.pathDown(input.height) :
|
||||
input.shape.pathDown;
|
||||
|
||||
this.outlinePath_ +=
|
||||
Blockly.utils.svgPaths.lineOnAxis('H', input.xPos + input.width) +
|
||||
pathDown +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', row.height - input.connectionHeight);
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('H', input.xPos + input.width) +
|
||||
pathDown + svgPaths.lineOnAxis('v', row.height - input.connectionHeight);
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Add steps for a statement input.
|
||||
* @param {!Blockly.blockRendering.Row} row The row that this input
|
||||
* belongs to.
|
||||
* @param {!Row} row The row that this input belongs to.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawStatementInput_ = function(row) {
|
||||
var input = row.getLastInput();
|
||||
Drawer.prototype.drawStatementInput_ = function(row) {
|
||||
const 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;
|
||||
const 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)) +
|
||||
const innerTopLeftCorner = input.shape.pathRight +
|
||||
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);
|
||||
const innerHeight = row.height - (2 * this.constants_.INSIDE_CORNERS.height);
|
||||
|
||||
this.outlinePath_ += Blockly.utils.svgPaths.lineOnAxis('H', x) +
|
||||
innerTopLeftCorner +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', innerHeight) +
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('H', x) + innerTopLeftCorner +
|
||||
svgPaths.lineOnAxis('v', innerHeight) +
|
||||
this.constants_.INSIDE_CORNERS.pathBottom +
|
||||
Blockly.utils.svgPaths.lineOnAxis('H', row.xPos + row.width);
|
||||
svgPaths.lineOnAxis('H', row.xPos + row.width);
|
||||
|
||||
this.positionStatementInputConnection_(row);
|
||||
};
|
||||
@@ -215,13 +204,11 @@ Blockly.blockRendering.Drawer.prototype.drawStatementInput_ = function(row) {
|
||||
/**
|
||||
* Add steps for the right side of a row that does not have value or
|
||||
* statement input connections.
|
||||
* @param {!Blockly.blockRendering.Row} row The row to draw the
|
||||
* side of.
|
||||
* @param {!Row} row The row to draw the side of.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawRightSideRow_ = function(row) {
|
||||
this.outlinePath_ +=
|
||||
Blockly.utils.svgPaths.lineOnAxis('V', row.yPos + row.height);
|
||||
Drawer.prototype.drawRightSideRow_ = function(row) {
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('V', row.yPos + row.height);
|
||||
};
|
||||
|
||||
|
||||
@@ -230,30 +217,30 @@ Blockly.blockRendering.Drawer.prototype.drawRightSideRow_ = function(row) {
|
||||
* for the next connection.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawBottom_ = function() {
|
||||
var bottomRow = this.info_.bottomRow;
|
||||
var elems = bottomRow.elements;
|
||||
Drawer.prototype.drawBottom_ = function() {
|
||||
const bottomRow = this.info_.bottomRow;
|
||||
const elems = bottomRow.elements;
|
||||
this.positionNextConnection_();
|
||||
|
||||
var rightCornerYOffset = 0;
|
||||
var outlinePath = '';
|
||||
for (var i = elems.length - 1, elem; (elem = elems[i]); i--) {
|
||||
if (Blockly.blockRendering.Types.isNextConnection(elem)) {
|
||||
let rightCornerYOffset = 0;
|
||||
let outlinePath = '';
|
||||
for (let i = elems.length - 1, elem; (elem = elems[i]); i--) {
|
||||
if (Types.isNextConnection(elem)) {
|
||||
outlinePath += elem.shape.pathRight;
|
||||
} else if (Blockly.blockRendering.Types.isLeftSquareCorner(elem)) {
|
||||
outlinePath += Blockly.utils.svgPaths.lineOnAxis('H', bottomRow.xPos);
|
||||
} else if (Blockly.blockRendering.Types.isLeftRoundedCorner(elem)) {
|
||||
} else if (Types.isLeftSquareCorner(elem)) {
|
||||
outlinePath += svgPaths.lineOnAxis('H', bottomRow.xPos);
|
||||
} else if (Types.isLeftRoundedCorner(elem)) {
|
||||
outlinePath += this.constants_.OUTSIDE_CORNERS.bottomLeft;
|
||||
} else if (Blockly.blockRendering.Types.isRightRoundedCorner(elem)) {
|
||||
} else if (Types.isRightRoundedCorner(elem)) {
|
||||
outlinePath += this.constants_.OUTSIDE_CORNERS.bottomRight;
|
||||
rightCornerYOffset = this.constants_.OUTSIDE_CORNERS.rightHeight;
|
||||
} else if (Blockly.blockRendering.Types.isSpacer(elem)) {
|
||||
outlinePath += Blockly.utils.svgPaths.lineOnAxis('h', elem.width * -1);
|
||||
} else if (Types.isSpacer(elem)) {
|
||||
outlinePath += svgPaths.lineOnAxis('h', elem.width * -1);
|
||||
}
|
||||
}
|
||||
|
||||
this.outlinePath_ += Blockly.utils.svgPaths.lineOnAxis('V',
|
||||
bottomRow.baseline - rightCornerYOffset);
|
||||
this.outlinePath_ +=
|
||||
svgPaths.lineOnAxis('V', bottomRow.baseline - rightCornerYOffset);
|
||||
this.outlinePath_ += outlinePath;
|
||||
};
|
||||
|
||||
@@ -262,21 +249,19 @@ Blockly.blockRendering.Drawer.prototype.drawBottom_ = function() {
|
||||
* connection
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawLeft_ = function() {
|
||||
var outputConnection = this.info_.outputConnection;
|
||||
Drawer.prototype.drawLeft_ = function() {
|
||||
const outputConnection = this.info_.outputConnection;
|
||||
this.positionOutputConnection_();
|
||||
|
||||
if (outputConnection) {
|
||||
var tabBottom = outputConnection.connectionOffsetY +
|
||||
outputConnection.height;
|
||||
var pathUp = (typeof outputConnection.shape.pathUp == "function") ?
|
||||
const tabBottom =
|
||||
outputConnection.connectionOffsetY + outputConnection.height;
|
||||
const pathUp = (typeof outputConnection.shape.pathUp == 'function') ?
|
||||
outputConnection.shape.pathUp(outputConnection.height) :
|
||||
outputConnection.shape.pathUp;
|
||||
|
||||
// Draw a line up to the bottom of the tab.
|
||||
this.outlinePath_ +=
|
||||
Blockly.utils.svgPaths.lineOnAxis('V', tabBottom) +
|
||||
pathUp;
|
||||
this.outlinePath_ += svgPaths.lineOnAxis('V', tabBottom) + pathUp;
|
||||
}
|
||||
// Close off the path. This draws a vertical line up to the start of the
|
||||
// block's path, which may be either a rounded or a sharp corner.
|
||||
@@ -288,16 +273,15 @@ Blockly.blockRendering.Drawer.prototype.drawLeft_ = function() {
|
||||
* not depend on the outer path for placement.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawInternals_ = function() {
|
||||
for (var i = 0, row; (row = this.info_.rows[i]); i++) {
|
||||
for (var j = 0, elem; (elem = row.elements[j]); j++) {
|
||||
if (Blockly.blockRendering.Types.isInlineInput(elem)) {
|
||||
Drawer.prototype.drawInternals_ = function() {
|
||||
for (let i = 0, row; (row = this.info_.rows[i]); i++) {
|
||||
for (let j = 0, elem; (elem = row.elements[j]); j++) {
|
||||
if (Types.isInlineInput(elem)) {
|
||||
this.drawInlineInput_(
|
||||
/** @type {!Blockly.blockRendering.InlineInput} */ (elem));
|
||||
} else if (Blockly.blockRendering.Types.isIcon(elem) ||
|
||||
Blockly.blockRendering.Types.isField(elem)) {
|
||||
/** @type {!InlineInput} */ (elem));
|
||||
} else if (Types.isIcon(elem) || Types.isField(elem)) {
|
||||
this.layoutField_(
|
||||
/** @type {!Blockly.blockRendering.Field|!Blockly.blockRendering.Icon} */
|
||||
/** @type {!Field|!Icon} */
|
||||
(elem));
|
||||
}
|
||||
}
|
||||
@@ -306,20 +290,21 @@ Blockly.blockRendering.Drawer.prototype.drawInternals_ = function() {
|
||||
|
||||
/**
|
||||
* Push a field or icon's new position to its SVG root.
|
||||
* @param {!Blockly.blockRendering.Icon|!Blockly.blockRendering.Field} fieldInfo
|
||||
* @param {!Icon|!Field} fieldInfo
|
||||
* The rendering information for the field or icon.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.layoutField_ = function(fieldInfo) {
|
||||
if (Blockly.blockRendering.Types.isField(fieldInfo)) {
|
||||
var svgGroup = fieldInfo.field.getSvgRoot();
|
||||
} else if (Blockly.blockRendering.Types.isIcon(fieldInfo)) {
|
||||
var svgGroup = fieldInfo.icon.iconGroup_;
|
||||
Drawer.prototype.layoutField_ = function(fieldInfo) {
|
||||
let svgGroup;
|
||||
if (Types.isField(fieldInfo)) {
|
||||
svgGroup = fieldInfo.field.getSvgRoot();
|
||||
} else if (Types.isIcon(fieldInfo)) {
|
||||
svgGroup = fieldInfo.icon.iconGroup_;
|
||||
}
|
||||
|
||||
var yPos = fieldInfo.centerline - fieldInfo.height / 2;
|
||||
var xPos = fieldInfo.xPos;
|
||||
var scale = '';
|
||||
const yPos = fieldInfo.centerline - fieldInfo.height / 2;
|
||||
let xPos = fieldInfo.xPos;
|
||||
let scale = '';
|
||||
if (this.info_.RTL) {
|
||||
xPos = -(xPos + fieldInfo.width);
|
||||
if (fieldInfo.flipRtl) {
|
||||
@@ -327,7 +312,7 @@ Blockly.blockRendering.Drawer.prototype.layoutField_ = function(fieldInfo) {
|
||||
scale = 'scale(-1 1)';
|
||||
}
|
||||
}
|
||||
if (Blockly.blockRendering.Types.isIcon(fieldInfo)) {
|
||||
if (Types.isIcon(fieldInfo)) {
|
||||
svgGroup.setAttribute('display', 'block');
|
||||
svgGroup.setAttribute('transform', 'translate(' + xPos + ',' + yPos + ')');
|
||||
fieldInfo.icon.computeIconLocation();
|
||||
@@ -345,26 +330,24 @@ Blockly.blockRendering.Drawer.prototype.layoutField_ = function(fieldInfo) {
|
||||
|
||||
/**
|
||||
* Add steps for an inline input.
|
||||
* @param {!Blockly.blockRendering.InlineInput} input The information about the
|
||||
* @param {!InlineInput} input The information about the
|
||||
* input to render.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.drawInlineInput_ = function(input) {
|
||||
var width = input.width;
|
||||
var height = input.height;
|
||||
var yPos = input.centerline - height / 2;
|
||||
Drawer.prototype.drawInlineInput_ = function(input) {
|
||||
const width = input.width;
|
||||
const height = input.height;
|
||||
const yPos = input.centerline - height / 2;
|
||||
|
||||
var connectionTop = input.connectionOffsetY;
|
||||
var connectionBottom = input.connectionHeight + connectionTop;
|
||||
var connectionRight = input.xPos + input.connectionWidth;
|
||||
const connectionTop = input.connectionOffsetY;
|
||||
const connectionBottom = input.connectionHeight + connectionTop;
|
||||
const connectionRight = input.xPos + input.connectionWidth;
|
||||
|
||||
this.inlinePath_ += Blockly.utils.svgPaths.moveTo(connectionRight, yPos) +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', connectionTop) +
|
||||
input.shape.pathDown +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', height - connectionBottom) +
|
||||
Blockly.utils.svgPaths.lineOnAxis('h', width - input.connectionWidth) +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', -height) +
|
||||
'z';
|
||||
this.inlinePath_ += svgPaths.moveTo(connectionRight, yPos) +
|
||||
svgPaths.lineOnAxis('v', connectionTop) + input.shape.pathDown +
|
||||
svgPaths.lineOnAxis('v', height - connectionBottom) +
|
||||
svgPaths.lineOnAxis('h', width - input.connectionWidth) +
|
||||
svgPaths.lineOnAxis('v', -height) + 'z';
|
||||
|
||||
this.positionInlineInputConnection_(input);
|
||||
};
|
||||
@@ -373,21 +356,21 @@ Blockly.blockRendering.Drawer.prototype.drawInlineInput_ = function(input) {
|
||||
* Position the connection on an inline value input, taking into account
|
||||
* RTL and the small gap between the parent block and child block which lets the
|
||||
* parent block's dark path show through.
|
||||
* @param {Blockly.blockRendering.InlineInput} input The information about
|
||||
* @param {InlineInput} input The information about
|
||||
* the input that the connection is on.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.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 + input.connectionOffsetX;
|
||||
let connX = input.xPos + input.connectionWidth + input.connectionOffsetX;
|
||||
if (this.info_.RTL) {
|
||||
connX *= -1;
|
||||
}
|
||||
input.connectionModel.setOffsetInBlock(connX,
|
||||
yPos + input.connectionOffsetY);
|
||||
input.connectionModel.setOffsetInBlock(
|
||||
connX, yPos + input.connectionOffsetY);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -395,13 +378,13 @@ Blockly.blockRendering.Drawer.prototype.positionInlineInputConnection_ = functio
|
||||
* Position the connection on a statement input, taking into account
|
||||
* RTL and the small gap between the parent block and child block which lets the
|
||||
* parent block's dark path show through.
|
||||
* @param {!Blockly.blockRendering.Row} row The row that the connection is on.
|
||||
* @param {!Row} row The row that the connection is on.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.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;
|
||||
}
|
||||
@@ -413,13 +396,13 @@ Blockly.blockRendering.Drawer.prototype.positionStatementInputConnection_ = func
|
||||
* Position the connection on an external value input, taking into account
|
||||
* RTL and the small gap between the parent block and child block which lets the
|
||||
* parent block's dark path show through.
|
||||
* @param {!Blockly.blockRendering.Row} row The row that the connection is on.
|
||||
* @param {!Row} row The row that the connection is on.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.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;
|
||||
let connX = row.xPos + row.width;
|
||||
if (this.info_.RTL) {
|
||||
connX *= -1;
|
||||
}
|
||||
@@ -431,11 +414,11 @@ Blockly.blockRendering.Drawer.prototype.positionExternalValueConnection_ = funct
|
||||
* Position the previous connection on a block.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.positionPreviousConnection_ = function() {
|
||||
var topRow = this.info_.topRow;
|
||||
Drawer.prototype.positionPreviousConnection_ = function() {
|
||||
const topRow = this.info_.topRow;
|
||||
if (topRow.connection) {
|
||||
var x = topRow.xPos + topRow.notchOffset;
|
||||
var connX = (this.info_.RTL ? -x : x);
|
||||
const x = topRow.xPos + topRow.notchOffset;
|
||||
const connX = (this.info_.RTL ? -x : x);
|
||||
topRow.connection.connectionModel.setOffsetInBlock(connX, 0);
|
||||
}
|
||||
};
|
||||
@@ -444,13 +427,13 @@ Blockly.blockRendering.Drawer.prototype.positionPreviousConnection_ = function()
|
||||
* Position the next connection on a block.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.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);
|
||||
const connInfo = bottomRow.connection;
|
||||
const x = connInfo.xPos; // Already contains info about startX.
|
||||
const connX = (this.info_.RTL ? -x : x);
|
||||
connInfo.connectionModel.setOffsetInBlock(connX, bottomRow.baseline);
|
||||
}
|
||||
};
|
||||
@@ -459,11 +442,13 @@ Blockly.blockRendering.Drawer.prototype.positionNextConnection_ = function() {
|
||||
* Position the output connection on a block.
|
||||
* @protected
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.positionOutputConnection_ = function() {
|
||||
Drawer.prototype.positionOutputConnection_ = function() {
|
||||
if (this.info_.outputConnection) {
|
||||
var x = this.info_.startX + this.info_.outputConnection.connectionOffsetX;
|
||||
var connX = this.info_.RTL ? -x : x;
|
||||
this.block_.outputConnection.setOffsetInBlock(connX,
|
||||
this.info_.outputConnection.connectionOffsetY);
|
||||
const x = this.info_.startX + this.info_.outputConnection.connectionOffsetX;
|
||||
const connX = this.info_.RTL ? -x : x;
|
||||
this.block_.outputConnection.setOffsetInBlock(
|
||||
connX, this.info_.outputConnection.connectionOffsetY);
|
||||
}
|
||||
};
|
||||
|
||||
exports = Drawer;
|
||||
|
||||
@@ -116,7 +116,7 @@ goog.addDependency('../../core/rendered_connection.js', ['Blockly.RenderedConnec
|
||||
goog.addDependency('../../core/renderers/common/block_rendering.js', ['Blockly.blockRendering'], ['Blockly.registry']);
|
||||
goog.addDependency('../../core/renderers/common/constants.js', ['Blockly.blockRendering.ConstantProvider'], ['Blockly.connectionTypes', 'Blockly.constants', 'Blockly.utils', 'Blockly.utils.Svg', 'Blockly.utils.colour', 'Blockly.utils.dom', 'Blockly.utils.svgPaths', 'Blockly.utils.userAgent'], {'lang': 'es5'});
|
||||
goog.addDependency('../../core/renderers/common/debugger.js', ['Blockly.blockRendering.Debug'], ['Blockly.blockRendering.Measurable', 'Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.Types', 'Blockly.connectionTypes', 'Blockly.constants', 'Blockly.utils.Svg', 'Blockly.utils.dom'], {'lang': 'es5'});
|
||||
goog.addDependency('../../core/renderers/common/drawer.js', ['Blockly.blockRendering.Drawer'], ['Blockly.blockRendering.RenderInfo', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.Types', 'Blockly.utils.svgPaths']);
|
||||
goog.addDependency('../../core/renderers/common/drawer.js', ['Blockly.blockRendering.Drawer'], ['Blockly.blockRendering.Row', 'Blockly.blockRendering.Types', 'Blockly.utils.svgPaths'], {'lang': 'es6', 'module': 'goog'});
|
||||
goog.addDependency('../../core/renderers/common/i_path_object.js', ['Blockly.blockRendering.IPathObject'], []);
|
||||
goog.addDependency('../../core/renderers/common/info.js', ['Blockly.blockRendering.RenderInfo'], ['Blockly.blockRendering.BottomRow', 'Blockly.blockRendering.ExternalValueInput', 'Blockly.blockRendering.Field', 'Blockly.blockRendering.Hat', 'Blockly.blockRendering.InRowSpacer', 'Blockly.blockRendering.InlineInput', 'Blockly.blockRendering.InputRow', 'Blockly.blockRendering.JaggedEdge', 'Blockly.blockRendering.Measurable', 'Blockly.blockRendering.NextConnection', 'Blockly.blockRendering.OutputConnection', 'Blockly.blockRendering.PreviousConnection', 'Blockly.blockRendering.RoundCorner', 'Blockly.blockRendering.Row', 'Blockly.blockRendering.SpacerRow', 'Blockly.blockRendering.SquareCorner', 'Blockly.blockRendering.StatementInput', 'Blockly.blockRendering.TopRow', 'Blockly.blockRendering.Types', 'Blockly.constants', 'Blockly.inputTypes']);
|
||||
goog.addDependency('../../core/renderers/common/marker_svg.js', ['Blockly.blockRendering.MarkerSvg'], ['Blockly.ASTNode', 'Blockly.Events', 'Blockly.Events.MarkerMove', 'Blockly.connectionTypes', 'Blockly.constants', 'Blockly.utils.Svg', 'Blockly.utils.dom']);
|
||||
|
||||
Reference in New Issue
Block a user