mirror of
https://github.com/google/blockly.git
synced 2026-01-10 02:17:09 +01:00
Add xpos to rows; add bounding box debug rendering
This commit is contained in:
@@ -133,12 +133,12 @@ Blockly.blockRendering.Drawer.prototype.drawTop_ = function() {
|
||||
}
|
||||
this.positionPreviousConnection_();
|
||||
this.steps_.push(
|
||||
Blockly.utils.svgPaths.moveBy(this.info_.startX, this.info_.startY));
|
||||
Blockly.utils.svgPaths.moveBy(topRow.xPos, this.info_.startY));
|
||||
for (var i = 0, elem; elem = elements[i]; i++) {
|
||||
if (elem.type === 'round corner') {
|
||||
this.steps_.push(Blockly.blockRendering.constants.OUTSIDE_CORNERS.topLeft);
|
||||
} else if (elem.type === 'previous connection') {
|
||||
this.steps_.push(Blockly.blockRendering.constants.NOTCH.pathLeft);
|
||||
this.steps_.push(topRow.notchShape.pathLeft);
|
||||
} else if (elem.type === 'hat') {
|
||||
this.steps_.push(Blockly.blockRendering.constants.START_HAT.path);
|
||||
} else if (elem.isSpacer()) {
|
||||
@@ -176,7 +176,7 @@ Blockly.blockRendering.Drawer.prototype.drawValueInput_ = function(row) {
|
||||
if (this.highlighter_) {
|
||||
this.highlighter_.drawValueInput(row);
|
||||
}
|
||||
this.steps_.push('H', this.info_.startX + row.width);
|
||||
this.steps_.push('H', row.xPos + row.width);
|
||||
this.steps_.push(Blockly.blockRendering.constants.PUZZLE_TAB.pathDown);
|
||||
this.steps_.push('v', row.height - input.connectionHeight);
|
||||
this.positionExternalValueConnection_(row);
|
||||
@@ -194,7 +194,7 @@ Blockly.blockRendering.Drawer.prototype.drawStatementInput_ = function(row) {
|
||||
this.highlighter_.drawStatementInput(row);
|
||||
}
|
||||
// Where to start drawing the notch, which is on the right side in LTR.
|
||||
var x = this.info_.startX + row.statementEdge +
|
||||
var x = row.xPos + row.statementEdge +
|
||||
Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT +
|
||||
Blockly.blockRendering.constants.NOTCH.width;
|
||||
|
||||
@@ -224,7 +224,7 @@ Blockly.blockRendering.Drawer.prototype.drawRightSideRow_ = function(row) {
|
||||
if (this.highlighter_) {
|
||||
this.highlighter_.drawRightSideRow(row);
|
||||
}
|
||||
this.steps_.push('H', this.info_.startX + row.width);
|
||||
this.steps_.push('H', row.xPos + row.width);
|
||||
this.steps_.push('V', row.yPos + row.height);
|
||||
};
|
||||
|
||||
@@ -245,9 +245,9 @@ Blockly.blockRendering.Drawer.prototype.drawBottom_ = function() {
|
||||
for (var i = elems.length - 1; i >= 0; i--) {
|
||||
var elem = elems[i];
|
||||
if (elem.type === 'next connection') {
|
||||
this.steps_.push(Blockly.blockRendering.constants.NOTCH.pathRight);
|
||||
this.steps_.push(bottomRow.notchShape.pathRight);
|
||||
} else if (elem.type === 'square corner') {
|
||||
this.steps_.push(Blockly.utils.svgPaths.lineOnAxis('H', this.info_.startX));
|
||||
this.steps_.push(Blockly.utils.svgPaths.lineOnAxis('H', bottomRow.xPos));
|
||||
} else if (elem.type === 'round corner') {
|
||||
this.steps_.push(Blockly.blockRendering.constants.OUTSIDE_CORNERS.bottomLeft);
|
||||
} else if (elem.isSpacer()) {
|
||||
@@ -404,7 +404,7 @@ Blockly.blockRendering.Drawer.prototype.positionInlineInputConnection_ = functio
|
||||
Blockly.blockRendering.Drawer.prototype.positionStatementInputConnection_ = function(row) {
|
||||
var input = row.getLastInput();
|
||||
if (input.connection) {
|
||||
var connX = this.info_.startX + row.statementEdge +
|
||||
var connX = row.xPos + row.statementEdge +
|
||||
Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
|
||||
if (this.info_.RTL) {
|
||||
connX *= -1;
|
||||
@@ -425,7 +425,7 @@ Blockly.blockRendering.Drawer.prototype.positionStatementInputConnection_ = func
|
||||
Blockly.blockRendering.Drawer.prototype.positionExternalValueConnection_ = function(row) {
|
||||
var input = row.getLastInput();
|
||||
if (input.connection) {
|
||||
var connX = this.info_.startX + row.width + Blockly.blockRendering.constants.DARK_PATH_OFFSET;
|
||||
var connX = row.xPos + row.width + Blockly.blockRendering.constants.DARK_PATH_OFFSET;
|
||||
if (this.info_.RTL) {
|
||||
connX *= -1;
|
||||
}
|
||||
@@ -438,10 +438,11 @@ Blockly.blockRendering.Drawer.prototype.positionExternalValueConnection_ = funct
|
||||
* @private
|
||||
*/
|
||||
Blockly.blockRendering.Drawer.prototype.positionPreviousConnection_ = function() {
|
||||
if (this.info_.topRow.hasPreviousConnection) {
|
||||
var x = this.info_.startX + Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
|
||||
var topRow = this.info_.topRow;
|
||||
if (topRow.hasPreviousConnection) {
|
||||
var x = topRow.xPos + Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
|
||||
var connX = (this.info_.RTL ? -x : x);
|
||||
this.info_.topRow.connection.setOffsetInBlock(connX, 0);
|
||||
topRow.connection.setOffsetInBlock(connX, 0);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -72,7 +72,7 @@ Blockly.blockRendering.Debug.prototype.drawSpacerRow = function(row, cursorY, is
|
||||
this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
|
||||
{
|
||||
'class': 'rowSpacerRect blockRenderDebug',
|
||||
'x': isRtl ? -row.width : 0,
|
||||
'x': isRtl ? -(row.xPos + row.width) : row.xPos,
|
||||
'y': cursorY,
|
||||
'width': row.width,
|
||||
'height': row.height,
|
||||
@@ -183,7 +183,7 @@ Blockly.blockRendering.Debug.prototype.drawRenderedRow = function(row, cursorY,
|
||||
this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
|
||||
{
|
||||
'class': 'elemRenderingRect blockRenderDebug',
|
||||
'x': isRtl ? -row.width : 0,
|
||||
'x': isRtl ? -(row.xPos + row.width) : row.xPos,
|
||||
'y': cursorY ,
|
||||
'width': row.width,
|
||||
'height': row.height,
|
||||
@@ -241,6 +241,7 @@ Blockly.blockRendering.Debug.prototype.drawBoundingBox = function(width, height,
|
||||
Blockly.blockRendering.Debug.prototype.drawDebug = function(block, info) {
|
||||
this.clearElems();
|
||||
this.svgRoot_ = block.getSvgRoot();
|
||||
|
||||
var cursorY = 0;
|
||||
for (var r = 0; r < info.rows.length; r++) {
|
||||
var row = info.rows[r];
|
||||
|
||||
@@ -73,7 +73,7 @@ Blockly.blockRendering.Highlighter = function(info, pathObject) {
|
||||
|
||||
Blockly.blockRendering.Highlighter.prototype.drawTopCorner = function(row) {
|
||||
this.steps_.push(
|
||||
Blockly.utils.svgPaths.moveBy(this.info_.startX, this.info_.startY));
|
||||
Blockly.utils.svgPaths.moveBy(row.xPos, this.info_.startY));
|
||||
for (var i = 0, elem; elem = row.elements[i]; i++) {
|
||||
if (elem.type === 'square corner') {
|
||||
this.steps_.push(Blockly.blockRendering.highlightConstants.START_POINT);
|
||||
@@ -92,7 +92,7 @@ Blockly.blockRendering.Highlighter.prototype.drawTopCorner = function(row) {
|
||||
}
|
||||
}
|
||||
|
||||
var right = this.info_.startX + row.width - this.highlightOffset_;
|
||||
var right = row.xPos + row.width - this.highlightOffset_;
|
||||
this.steps_.push('H', right);
|
||||
};
|
||||
|
||||
@@ -114,12 +114,12 @@ Blockly.blockRendering.Highlighter.prototype.drawValueInput = function(row) {
|
||||
|
||||
steps =
|
||||
Blockly.utils.svgPaths.moveTo(
|
||||
this.info_.startX + row.width - this.highlightOffset_, row.yPos) +
|
||||
row.xPos + row.width - this.highlightOffset_, row.yPos) +
|
||||
this.puzzleTabPaths_.pathDown(this.RTL_) +
|
||||
Blockly.utils.svgPaths.lineOnAxis('v', belowTabHeight);
|
||||
} else {
|
||||
steps =
|
||||
Blockly.utils.svgPaths.moveTo(this.info_.startX + row.width, row.yPos) +
|
||||
Blockly.utils.svgPaths.moveTo(row.xPos + row.width, row.yPos) +
|
||||
this.puzzleTabPaths_.pathDown(this.RTL_);
|
||||
}
|
||||
|
||||
@@ -128,7 +128,7 @@ Blockly.blockRendering.Highlighter.prototype.drawValueInput = function(row) {
|
||||
|
||||
Blockly.blockRendering.Highlighter.prototype.drawStatementInput = function(row) {
|
||||
var steps = '';
|
||||
var statementEdge = this.info_.startX + row.statementEdge;
|
||||
var statementEdge = row.xPos + row.statementEdge;
|
||||
if (this.RTL_) {
|
||||
var innerHeight = row.height - (2 * this.insideCornerPaths_.height);
|
||||
steps =
|
||||
@@ -145,7 +145,7 @@ Blockly.blockRendering.Highlighter.prototype.drawStatementInput = function(row)
|
||||
};
|
||||
|
||||
Blockly.blockRendering.Highlighter.prototype.drawRightSideRow = function(row) {
|
||||
var rightEdge = this.info_.startX + row.width - this.highlightOffset_;
|
||||
var rightEdge = row.xPos + row.width - this.highlightOffset_;
|
||||
if (row.followsStatement) {
|
||||
this.steps_.push('H', rightEdge);
|
||||
}
|
||||
@@ -167,10 +167,10 @@ Blockly.blockRendering.Highlighter.prototype.drawBottomRow = function(row) {
|
||||
if (cornerElem.type === 'square corner') {
|
||||
this.steps_.push(
|
||||
Blockly.utils.svgPaths.moveTo(
|
||||
this.info_.startX + this.highlightOffset_,
|
||||
row.xPos + this.highlightOffset_,
|
||||
height - this.highlightOffset_));
|
||||
} else if (cornerElem.type === 'round corner') {
|
||||
this.steps_.push(Blockly.utils.svgPaths.moveTo(this.info_.startX, height));
|
||||
this.steps_.push(Blockly.utils.svgPaths.moveTo(row.xPos, height));
|
||||
this.steps_.push(this.outsideCornerPaths_.bottomLeft());
|
||||
}
|
||||
}
|
||||
|
||||
@@ -120,7 +120,7 @@ Blockly.blockRendering.RenderInfo = function(block) {
|
||||
|
||||
// The position of the start point for drawing, relative to the block's
|
||||
// location.
|
||||
this.startX = 0;
|
||||
this.startX = 10;
|
||||
this.startY = 0;
|
||||
|
||||
this.measure_();
|
||||
@@ -701,6 +701,7 @@ Blockly.blockRendering.RenderInfo.prototype.finalize_ = function() {
|
||||
for (var r = 0; r < this.rows.length; r++) {
|
||||
var row = this.rows[r];
|
||||
row.yPos = yCursor;
|
||||
row.xPos = this.startX;
|
||||
yCursor += row.height;
|
||||
// Add padding to the bottom row if block height is less than minimum
|
||||
var heightWithoutHat = yCursor - this.topRow.startY;
|
||||
@@ -712,7 +713,7 @@ Blockly.blockRendering.RenderInfo.prototype.finalize_ = function() {
|
||||
yCursor += diff;
|
||||
}
|
||||
if (!(row.isSpacer())) {
|
||||
var xCursor = this.startX;
|
||||
var xCursor = row.xPos;
|
||||
for (var e = 0; e < row.elements.length; e++) {
|
||||
var elem = row.elements[e];
|
||||
elem.xPos = xCursor;
|
||||
|
||||
Reference in New Issue
Block a user