Diff
Modified: trunk/Tools/ChangeLog (230022 => 230023)
--- trunk/Tools/ChangeLog 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/ChangeLog 2018-03-28 04:52:54 UTC (rev 230023)
@@ -1,3 +1,34 @@
+2018-03-27 Zalan Bujtas <[email protected]>
+
+ [LayoutReloaded] Start using window.collectTextRuns() to layout text lines in inline formatting context
+ https://bugs.webkit.org/show_bug.cgi?id=184070
+
+ Reviewed by Antti Koivisto.
+
+ * LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js:
+ (InlineFormattingContext.prototype._handleText):
+ (InlineFormattingContext.prototype._commitLine):
+ * LayoutReloaded/FormattingContext/InlineFormatting/Line.js:
+ (Line.prototype.addTextLineBox):
+ (Line):
+ (Line.prototype.addLineBox): Deleted.
+ * LayoutReloaded/FormattingState/BlockFormattingState.js:
+ (BlockFormattingState):
+ * LayoutReloaded/FormattingState/FormattingState.js:
+ (FormattingState.prototype.displayBox):
+ (FormattingState):
+ (FormattingState.prototype._setFormattingContext): Deleted.
+ * LayoutReloaded/FormattingState/InlineFormattingState.js:
+ (InlineFormattingState):
+ * LayoutReloaded/LayoutTree/Text.js:
+ (Text.prototype.content):
+ * LayoutReloaded/Utils.js:
+ (Utils.textRuns):
+ (Utils.textRunsForLine):
+ (Utils._dumpLines.):
+ (Utils._dumpLines):
+ * LayoutReloaded/test/simple-inline-text.html:
+
2018-03-27 Eric Carlson <[email protected]>
https://bugs.webkit.org/show_bug.cgi?id=183876
Modified: trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -76,20 +76,21 @@
_handleText(inlineBox) {
// FIXME: This is a extremely simple line breaking algorithm.
let currentPosition = 0;
- let endPosition = inlineBox.text().length() - 1;
- while (currentPosition < endPosition) {
- let breakingPosition = Utils.nextBreakingOpportunity(inlineBox.text(), currentPosition);
- if (breakingPosition == currentPosition)
- break;
- let fragmentWidth = Utils.measureText(inlineBox.text(), currentPosition, breakingPosition);
- if (this._line().availableWidth() < fragmentWidth && !this._line().isEmpty())
- this._commitLine();
- this._line().addLineBox(currentPosition, breakingPosition, new LayoutSize(fragmentWidth, Utils.textHeight(inlineBox)));
- currentPosition = breakingPosition;
+ let text = inlineBox.text().content();
+ while (currentPosition < text.length - 1) {
+ let textRuns = Utils.textRunsForLine(text, this._line().availableWidth(), this.formattingRoot());
+ for (let run of textRuns) {
+ this._line().addTextLineBox(run.startPosition, run.endPosition, new LayoutSize(run.width, Utils.textHeight(inlineBox)));
+ currentPosition = run.endPosition;
+ }
+ text = text.slice(currentPosition, text.length - 1);
+ this._commitLine();
}
}
_commitLine() {
+ if (this._line().isEmpty())
+ return;
this.formattingState().appendLine(this._line());
this.m_line = this._createNewLine();
}
Modified: trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -46,10 +46,10 @@
return this.m_lineBoxes;
}
- addLineBox(startPosition, endPosition, size) {
+ addTextLineBox(startPosition, endPosition, size) {
this.m_availableWidth -= size.width();
// TODO: use the actual height instead of the line height.
- let lineBoxRect = new LayoutRect(this.rect().topLeft(), new LayoutSize(size.width(), this.rect().height()));
+ let lineBoxRect = new LayoutRect(this.rect().topRight(), new LayoutSize(size.width(), this.rect().height()));
this.m_lineBoxes.push({startPosition, endPosition, lineBoxRect});
this.m_lineRect.growBy(new LayoutSize(size.width(), 0));
}
Modified: trunk/Tools/LayoutReloaded/FormattingState/BlockFormattingState.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/FormattingState/BlockFormattingState.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/FormattingState/BlockFormattingState.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -26,6 +26,6 @@
class BlockFormattingState extends FormattingState {
constructor(formattingRoot, layoutState) {
super(layoutState, formattingRoot);
- this._setFormattingContext(new BlockFormattingContext(this));
+ this.m_formattingContext = new BlockFormattingContext(this);
}
}
Modified: trunk/Tools/LayoutReloaded/FormattingState/FormattingState.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/FormattingState/FormattingState.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/FormattingState/FormattingState.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -73,8 +73,4 @@
ASSERT(!layoutBox.parent());
return this.layoutState().initialDisplayBox();
}
-
- _setFormattingContext(formattingContext) {
- this.m_formattingContext = formattingContext;
- }
}
Modified: trunk/Tools/LayoutReloaded/FormattingState/InlineFormattingState.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/FormattingState/InlineFormattingState.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/FormattingState/InlineFormattingState.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -26,7 +26,7 @@
class InlineFormattingState extends FormattingState {
constructor(formattingRoot, layoutState) {
super(layoutState, formattingRoot);
- this._setFormattingContext(new InlineFormattingContext(this));
+ this.m_formattingContext = new InlineFormattingContext(this);
this.m_lines = new Array();
}
Modified: trunk/Tools/LayoutReloaded/LayoutTree/Text.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/LayoutTree/Text.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/LayoutTree/Text.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -35,7 +35,7 @@
}
content() {
- return this.m_node.wholeText;
+ return this.m_node.textContent;
}
length() {
Modified: trunk/Tools/LayoutReloaded/Utils.js (230022 => 230023)
--- trunk/Tools/LayoutReloaded/Utils.js 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/Utils.js 2018-03-28 04:52:54 UTC (rev 230023)
@@ -475,6 +475,14 @@
return window.getComputedStyle(node).float == "left";
}
+ static textRuns(text, container) {
+ return window.collectTextRuns(text, container.node());
+ }
+
+ static textRunsForLine(text, availableSpace, container) {
+ return window.collectTextRuns(text, container.node(), availableSpace);
+ }
+
static nextBreakingOpportunity(textBox, currentPosition)
{
return window.nextBreakingOpportunity(textBox.content(), currentPosition);
@@ -531,7 +539,7 @@
content += indentation + "RootInlineBox at (" + lineRect.left() + "," + lineRect.top() + ") size " + Utils.precisionRound(lineRect.width(), 2) + "x" + lineRect.height() + "\n";
line.lineBoxes().forEach(function(lineBox) {
let indentation = " ".repeat(level + 1);
- content += indentation + "InlineTextBox at (" + lineBox.lineBoxRect.left() + "," + lineBox.lineBoxRect.top() + ") size " + Utils.precisionRound(lineBox.lineBoxRect.width(), 2) + "x" + lineBox.lineBoxRect.height() + "\n";
+ content += indentation + "InlineTextBox at (" + Utils.precisionRound(lineBox.lineBoxRect.left(), 2) + "," + Utils.precisionRound(lineBox.lineBoxRect.top(), 2) + ") size " + Utils.precisionRound(lineBox.lineBoxRect.width(), 2) + "x" + lineBox.lineBoxRect.height() + "\n";
});
});
return content;
Modified: trunk/Tools/LayoutReloaded/test/simple-inline-text.html (230022 => 230023)
--- trunk/Tools/LayoutReloaded/test/simple-inline-text.html 2018-03-28 03:32:09 UTC (rev 230022)
+++ trunk/Tools/LayoutReloaded/test/simple-inline-text.html 2018-03-28 04:52:54 UTC (rev 230023)
@@ -1,4 +1,12 @@
<!DOCTYPE html>
<html>
-<body><div>foobar</div></body>
+<body>
+<div>foobarfoobar</div>
+<div>foobar foobar</div>
+<div>foobar foobar</div>
+<div>foobar foobar</div>
+<div>foobar foobar</div>
+<div>foobar foobar</div>
+<div>foobar foobar</div>
+</body>
</html>
