CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-10 18:37:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2755 from rachel-fenichel/connection_locations

Browse Source 
Work on connection locations
This commit is contained in:
Rachel Fenichel
2019-07-31 13:20:38 -07:00
committed by GitHub
parent 47da636803 41c686e733
commit 860db83b50
5 changed files with 81 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
core/block_render_svg.js
View File

@@ -102,6 +102,21 @@ Blockly.BlockSvg.TAB_WIDTH = 8;
* @const
*/
Blockly.BlockSvg.NOTCH_WIDTH = 30;
/**
* Offset of the notch from the left side of the block.
* @type {number}
* @const
*/
Blockly.BlockSvg.NOTCH_OFFSET_X = 15;
/**
* Offset of the puzzle tab from the top of the block.
* @type {number}
* @const
*/
Blockly.BlockSvg.TAB_OFFSET_Y = 5;
/**
* Rounded corner radius.
* @const
@@ -333,7 +348,6 @@ Blockly.BlockSvg.prototype.renderInternal = function() {
var inputRows = this.renderCompute_(cursorX);
this.renderDraw_(cursorX, inputRows);
this.renderMoveConnections_();
};
/**
@@ -615,41 +629,6 @@ Blockly.BlockSvg.prototype.setPaths_ = function(pathObject) {
}
};
/**
* Update all of the connections on this block with the new locations calculated
* in renderCompute. Also move all of the connected blocks based on the new
* connection locations.
* @private
*/
Blockly.BlockSvg.prototype.renderMoveConnections_ = function() {
var blockTL = this.getRelativeToSurfaceXY();
// Don't tighten previous or output connections because they are inferior
// connections.
if (this.previousConnection) {
this.previousConnection.moveToOffset(blockTL);
}
if (this.outputConnection) {
this.outputConnection.moveToOffset(blockTL);
}
for (var i = 0; i < this.inputList.length; i++) {
var conn = this.inputList[i].connection;
if (conn) {
conn.moveToOffset(blockTL);
if (conn.isConnected()) {
conn.tighten_();
}
}
}
if (this.nextConnection) {
this.nextConnection.moveToOffset(blockTL);
if (this.nextConnection.isConnected()) {
this.nextConnection.tighten_();
}
}
};
/**
* Render the top edge of the block.
* @param {!Blockly.BlockSvg.PathObject} pathObject The object containing
@@ -688,7 +667,7 @@ Blockly.BlockSvg.prototype.renderDrawTop_ = function(pathObject, rightEdge) {
highlightSteps.push(Blockly.BlockSvg.NOTCH_PATH_LEFT_HIGHLIGHT);
var connectionX = (this.RTL ?
-Blockly.BlockSvg.NOTCH_WIDTH : Blockly.BlockSvg.NOTCH_WIDTH);
-Blockly.BlockSvg.NOTCH_OFFSET_X : Blockly.BlockSvg.NOTCH_OFFSET_X);
this.previousConnection.setOffsetInBlock(connectionX, 0);
}
steps.push('H', rightEdge);
@@ -769,13 +748,9 @@ Blockly.BlockSvg.prototype.renderDrawBottom_ = function(pathObject, cursorY) {
if (this.nextConnection) {
steps.push('H', (Blockly.BlockSvg.NOTCH_WIDTH + (this.RTL ? 0.5 : - 0.5)) +
' ' + Blockly.BlockSvg.NOTCH_PATH_RIGHT);
// Create next block connection.
var connectionX;
if (this.RTL) {
connectionX = -Blockly.BlockSvg.NOTCH_WIDTH;
} else {
connectionX = Blockly.BlockSvg.NOTCH_WIDTH;
}
var connectionX = (this.RTL ?
-Blockly.BlockSvg.NOTCH_OFFSET_X : Blockly.BlockSvg.NOTCH_OFFSET_X);
this.nextConnection.setOffsetInBlock(connectionX, cursorY + 1);
this.height += 4; // Height of tab.
}
@@ -813,7 +788,7 @@ Blockly.BlockSvg.prototype.renderDrawLeft_ = function(pathObject) {
var highlightSteps = pathObject.highlightSteps;
if (this.outputConnection) {
// Create output connection.
this.outputConnection.setOffsetInBlock(0, 0);
this.outputConnection.setOffsetInBlock(0, Blockly.BlockSvg.TAB_OFFSET_Y);
steps.push('V', Blockly.BlockSvg.TAB_HEIGHT);
steps.push('c 0,-10 -' + Blockly.BlockSvg.TAB_WIDTH + ',8 -' +
Blockly.BlockSvg.TAB_WIDTH + ',-7.5 s ' + Blockly.BlockSvg.TAB_WIDTH +
@@ -950,7 +925,8 @@ Blockly.BlockSvg.prototype.renderInlineRow_ = function(pathObject, row, cursor,
Blockly.BlockSvg.TAB_WIDTH - Blockly.BlockSvg.SEP_SPACE_X -
input.renderWidth - 1;
}
connectionPos.y = cursor.y + Blockly.BlockSvg.INLINE_PADDING_Y + 1;
connectionPos.y = cursor.y + Blockly.BlockSvg.INLINE_PADDING_Y +
Blockly.BlockSvg.TAB_OFFSET_Y + 1;
input.connection.setOffsetInBlock(connectionPos.x, connectionPos.y);
}
}
@@ -1013,7 +989,8 @@ Blockly.BlockSvg.prototype.renderExternalValueInput_ = function(pathObject, row,
}
// Create external input connection.
connectionPos.x = this.RTL ? -rightEdge - 1 : rightEdge + 1;
input.connection.setOffsetInBlock(connectionPos.x, cursor.y);
input.connection.setOffsetInBlock(
connectionPos.x, cursor.y + Blockly.BlockSvg.TAB_OFFSET_Y);
if (input.connection.isConnected()) {
this.width = Math.max(this.width, rightEdge +
input.connection.targetBlock().getHeightWidth().width -
@@ -1129,7 +1106,8 @@ Blockly.BlockSvg.prototype.renderStatementInput_ = function(pathObject, row,
highlightSteps.push('H', inputRows.rightEdge - 0.5);
}
// Create statement connection.
connectionPos.x = this.RTL ? -cursor.x : cursor.x + 1;
var x = inputRows.statementEdge + Blockly.BlockSvg.NOTCH_OFFSET_X;
connectionPos.x = this.RTL ? -x : x + 1;
input.connection.setOffsetInBlock(connectionPos.x, cursor.y + 1);
if (input.connection.isConnected()) {

37
core/block_svg.js
View File

@@ -1547,6 +1547,8 @@ Blockly.BlockSvg.prototype.render = function(opt_bubble) {
} else {
this.renderInternal();
}
// No matter how we rendered, connection locations should now be correct.
this.updateConnectionLocations_();
if (opt_bubble !== false) {
// Render all blocks above this one (propagate a reflow).
var parentBlock = this.getParent();
@@ -1559,3 +1561,38 @@ Blockly.BlockSvg.prototype.render = function(opt_bubble) {
}
Blockly.Field.stopCache();
};
/**
* Update all of the connections on this block with the new locations calculated
* during rendering. Also move all of the connected blocks based on the new
* connection locations.
* @private
*/
Blockly.BlockSvg.prototype.updateConnectionLocations_ = function() {
var blockTL = this.getRelativeToSurfaceXY();
// Don't tighten previous or output connections because they are inferior
// connections.
if (this.previousConnection) {
this.previousConnection.moveToOffset(blockTL);
}
if (this.outputConnection) {
this.outputConnection.moveToOffset(blockTL);
}
for (var i = 0; i < this.inputList.length; i++) {
var conn = this.inputList[i].connection;
if (conn) {
conn.moveToOffset(blockTL);
if (conn.isConnected()) {
conn.tighten_();
}
}
}
if (this.nextConnection) {
this.nextConnection.moveToOffset(blockTL);
if (this.nextConnection.isConnected()) {
this.nextConnection.tighten_();
}
}
};

14
core/rendered_connection.js
View File

@@ -212,9 +212,19 @@ Blockly.RenderedConnection.prototype.closest = function(maxLimit, dxy) {
Blockly.RenderedConnection.prototype.highlight = function() {
var steps;
if (this.type == Blockly.INPUT_VALUE || this.type == Blockly.OUTPUT_VALUE) {
steps = 'm 0,0 ' + Blockly.BlockSvg.TAB_PATH_DOWN + ' v 5';
// Vertical line, puzzle tab, vertical line.
var yLen = 5;
steps = Blockly.utils.svgPaths.moveBy(0, -yLen) +
Blockly.utils.svgPaths.lineOnAxis('v', yLen) +
Blockly.blockRendering.constants.PUZZLE_TAB.pathDown +
Blockly.utils.svgPaths.lineOnAxis('v', yLen);
} else {
steps = 'm -20,0 h 5 ' + Blockly.BlockSvg.NOTCH_PATH_LEFT + ' h 5';
var xLen = 5;
// Horizontal line, notch, horizontal line.
steps = Blockly.utils.svgPaths.moveBy(-xLen, 0) +
Blockly.utils.svgPaths.lineOnAxis('h', xLen) +
Blockly.blockRendering.constants.NOTCH.pathLeft +
Blockly.utils.svgPaths.lineOnAxis('h', xLen);
}
var xy = this.sourceBlock_.getRelativeToSurfaceXY();
var x = this.x_ - xy.x;

12
core/renderers/block_rendering_rewrite/block_render_draw.js
View File

@@ -390,11 +390,11 @@ Blockly.blockRendering.Drawer.prototype.positionStatementInputConnection_ = func
var input = row.getLastInput();
if (input.connection) {
var connX = row.statementEdge +
Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT +
Blockly.blockRendering.constants.DARK_PATH_OFFSET;
Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
if (this.info_.RTL) {
connX *= -1;
}
connX += 0.5;
input.connection.setOffsetInBlock(connX,
row.yPos + Blockly.blockRendering.constants.DARK_PATH_OFFSET);
}
@@ -424,9 +424,8 @@ Blockly.blockRendering.Drawer.prototype.positionExternalValueConnection_ = funct
*/
Blockly.blockRendering.Drawer.prototype.positionPreviousConnection_ = function() {
if (this.info_.topRow.hasPreviousConnection) {
var connX =
this.info_.RTL ? -Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT :
Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
var x = Blockly.blockRendering.constants.NOTCH_OFFSET_LEFT;
var connX = (this.info_.RTL ? -x : x);
this.info_.topRow.connection.setOffsetInBlock(connX, 0);
}
};
@@ -440,7 +439,8 @@ Blockly.blockRendering.Drawer.prototype.positionNextConnection_ = function() {
if (bottomRow.hasNextConnection) {
var connInfo = bottomRow.getNextConnection();
var connX = this.info_.RTL ? -connInfo.xPos + 0.5 : connInfo.xPos + 0.5;
var x = connInfo.xPos;
var connX = (this.info_.RTL ? -x : x) + 0.5;
bottomRow.connection.setOffsetInBlock(
connX, this.info_.height + Blockly.blockRendering.constants.DARK_PATH_OFFSET);
}

3
core/renderers/block_rendering_rewrite/block_rendering.js
View File

@@ -47,7 +47,4 @@ Blockly.blockRendering.render = function(block) {
}
var info = new Blockly.blockRendering.RenderInfo(block);
new Blockly.blockRendering.Drawer(block, info).draw_();
// TODO: Fix moving connections in the new rendering code.
block.renderMoveConnections_();
};