Dummy input right alignment (#3342)

* Fix dummy input alignment in geras.
This commit is contained in:
Sam El-Husseini
2019-10-28 16:20:54 -07:00
committed by GitHub
parent 72c6aa8699
commit e7752e6ea2
6 changed files with 205 additions and 32 deletions

View File

@@ -60,6 +60,12 @@ Blockly.blockRendering.ConstantProvider = function() {
this.EMPTY_BLOCK_SPACER_HEIGHT = 16;
/**
* The minimum height of a dummy input row.
* @type {number}
*/
this.DUMMY_INPUT_MIN_HEIGHT = this.TAB_HEIGHT;
/**
* Rounded corner radius.
* @type {number}

View File

@@ -376,8 +376,11 @@ Blockly.blockRendering.RenderInfo.prototype.addInput_ = function(input, activeRo
} else if (input.type == Blockly.DUMMY_INPUT) {
// Dummy inputs have no visual representation, but the information is still
// important.
activeRow.minHeight = Math.max(activeRow.minHeight,
this.constants_.DUMMY_INPUT_MIN_HEIGHT);
activeRow.hasDummyInput = true;
}
activeRow.align = input.align;
};
/**

View File

@@ -115,8 +115,49 @@ Blockly.geras.RenderInfo.prototype.addInput_ = function(input, activeRow) {
} else if (input.type == Blockly.DUMMY_INPUT) {
// Dummy inputs have no visual representation, but the information is still
// important.
activeRow.minHeight = Math.max(activeRow.minHeight,
this.constants_.DUMMY_INPUT_MIN_HEIGHT);
activeRow.hasDummyInput = true;
}
activeRow.align = input.align;
};
/**
* @override
*/
Blockly.geras.RenderInfo.prototype.addElemSpacing_ = function() {
var hasExternalInputs = false;
for (var i = 0, row; (row = this.rows[i]); i++) {
if (row.hasExternalInput) {
hasExternalInputs = true;
}
}
for (var i = 0, row; (row = this.rows[i]); i++) {
var oldElems = row.elements;
row.elements = [];
// No spacing needed before the corner on the top row or the bottom row.
if (row.startsWithElemSpacer()) {
// There's a spacer before the first element in the row.
row.elements.push(new Blockly.blockRendering.InRowSpacer(
this.constants_, this.getInRowSpacing_(null, oldElems[0])));
}
for (var e = 0; e < oldElems.length - 1; e++) {
row.elements.push(oldElems[e]);
var spacing = this.getInRowSpacing_(oldElems[e], oldElems[e + 1]);
row.elements.push(
new Blockly.blockRendering.InRowSpacer(this.constants_, spacing));
}
row.elements.push(oldElems[oldElems.length - 1]);
if (row.endsWithElemSpacer()) {
var spacing = this.getInRowSpacing_(oldElems[oldElems.length - 1], null);
if (hasExternalInputs && row.hasDummyInput) {
spacing += this.constants_.TAB_WIDTH;
}
// There's a spacer after the last element in the row.
row.elements.push(new Blockly.blockRendering.InRowSpacer(
this.constants_, spacing));
}
}
};
/**
@@ -274,22 +315,19 @@ Blockly.geras.RenderInfo.prototype.addAlignmentPadding_ = function(row, missingS
row.widthWithConnectedBlocks += missingSpace;
}
var input = row.getLastInput();
if (input) {
// Decide where the extra padding goes.
if (input.align == Blockly.ALIGN_LEFT) {
// Add padding to the end of the row.
lastSpacer.width += missingSpace;
} else if (input.align == Blockly.ALIGN_CENTRE) {
// Split the padding between the beginning and end of the row.
firstSpacer.width += missingSpace / 2;
lastSpacer.width += missingSpace / 2;
} else if (input.align == Blockly.ALIGN_RIGHT) {
// Add padding at the beginning of the row.
firstSpacer.width += missingSpace;
}
// Decide where the extra padding goes.
if (row.align == Blockly.ALIGN_LEFT) {
// Add padding to the end of the row.
lastSpacer.width += missingSpace;
} else if (row.align == Blockly.ALIGN_CENTRE) {
// Split the padding between the beginning and end of the row.
firstSpacer.width += missingSpace / 2;
lastSpacer.width += missingSpace / 2;
} else if (row.align == Blockly.ALIGN_RIGHT) {
// Add padding at the beginning of the row.
firstSpacer.width += missingSpace;
} else {
// Default to left-aligning if there's no input to say where to align.
// Default to left-aligning.
lastSpacer.width += missingSpace;
}
row.width += missingSpace;
@@ -321,6 +359,9 @@ Blockly.geras.RenderInfo.prototype.getSpacerRowHeight_ = function(prev, next) {
if (!prev.hasStatement && next.hasDummyInput) {
return this.constants_.LARGE_PADDING;
}
if (prev.hasDummyInput) {
return this.constants_.LARGE_PADDING;
}
return this.constants_.MEDIUM_PADDING;
};

View File

@@ -70,6 +70,44 @@ Blockly.thrasos.RenderInfo.prototype.getRenderer = function() {
return /** @type {!Blockly.thrasos.Renderer} */ (this.renderer_);
};
/**
* @override
*/
Blockly.thrasos.RenderInfo.prototype.addElemSpacing_ = function() {
var hasExternalInputs = false;
for (var i = 0, row; (row = this.rows[i]); i++) {
if (row.hasExternalInput) {
hasExternalInputs = true;
}
}
for (var i = 0, row; (row = this.rows[i]); i++) {
var oldElems = row.elements;
row.elements = [];
// No spacing needed before the corner on the top row or the bottom row.
if (row.startsWithElemSpacer()) {
// There's a spacer before the first element in the row.
row.elements.push(new Blockly.blockRendering.InRowSpacer(
this.constants_, this.getInRowSpacing_(null, oldElems[0])));
}
for (var e = 0; e < oldElems.length - 1; e++) {
row.elements.push(oldElems[e]);
var spacing = this.getInRowSpacing_(oldElems[e], oldElems[e + 1]);
row.elements.push(
new Blockly.blockRendering.InRowSpacer(this.constants_, spacing));
}
row.elements.push(oldElems[oldElems.length - 1]);
if (row.endsWithElemSpacer()) {
var spacing = this.getInRowSpacing_(oldElems[oldElems.length - 1], null);
if (hasExternalInputs && row.hasDummyInput) {
spacing += this.constants_.TAB_WIDTH;
}
// There's a spacer after the last element in the row.
row.elements.push(new Blockly.blockRendering.InRowSpacer(
this.constants_, spacing));
}
}
};
/**
* @override
*/
@@ -211,23 +249,20 @@ Blockly.thrasos.RenderInfo.prototype.addAlignmentPadding_ = function(row, missin
if (row.hasExternalInput || row.hasStatement) {
row.widthWithConnectedBlocks += missingSpace;
}
var input = row.getLastInput();
if (input) {
// Decide where the extra padding goes.
if (input.align == Blockly.ALIGN_LEFT) {
// Add padding to the end of the row.
lastSpacer.width += missingSpace;
} else if (input.align == Blockly.ALIGN_CENTRE) {
// Split the padding between the beginning and end of the row.
firstSpacer.width += missingSpace / 2;
lastSpacer.width += missingSpace / 2;
} else if (input.align == Blockly.ALIGN_RIGHT) {
// Add padding at the beginning of the row.
firstSpacer.width += missingSpace;
}
// Decide where the extra padding goes.
if (row.align == Blockly.ALIGN_LEFT) {
// Add padding to the end of the row.
lastSpacer.width += missingSpace;
} else if (row.align == Blockly.ALIGN_CENTRE) {
// Split the padding between the beginning and end of the row.
firstSpacer.width += missingSpace / 2;
lastSpacer.width += missingSpace / 2;
} else if (row.align == Blockly.ALIGN_RIGHT) {
// Add padding at the beginning of the row.
firstSpacer.width += missingSpace;
} else {
// Default to left-aligning if there's no input to say where to align.
// Default to left-aligning.
lastSpacer.width += missingSpace;
}
row.width += missingSpace;
@@ -257,7 +292,7 @@ Blockly.thrasos.RenderInfo.prototype.getSpacerRowHeight_ = function(
if (prev.hasStatement && next.hasStatement) {
return this.constants_.LARGE_PADDING;
}
if (next.hasDummyInput) {
if (prev.hasDummyInput || next.hasDummyInput) {
return this.constants_.LARGE_PADDING;
}
return this.constants_.MEDIUM_PADDING;