[LayoutReloaded] Start using window.collectTextRuns() to layout text lines in inline...
authorzalan@apple.com <zalan@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 28 Mar 2018 04:52:54 +0000 (04:52 +0000)
committerzalan@apple.com <zalan@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 28 Mar 2018 04:52:54 +0000 (04:52 +0000)
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:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@230023 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Tools/ChangeLog
Tools/LayoutReloaded/FormattingContext/InlineFormatting/InlineFormattingContext.js
Tools/LayoutReloaded/FormattingContext/InlineFormatting/Line.js
Tools/LayoutReloaded/FormattingState/BlockFormattingState.js
Tools/LayoutReloaded/FormattingState/FormattingState.js
Tools/LayoutReloaded/FormattingState/InlineFormattingState.js
Tools/LayoutReloaded/LayoutTree/Text.js
Tools/LayoutReloaded/Utils.js
Tools/LayoutReloaded/test/simple-inline-text.html

index a0a8f0b..9a0e835 100644 (file)
@@ -1,3 +1,34 @@
+2018-03-27  Zalan Bujtas  <zalan@apple.com>
+
+        [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  <eric.carlson@apple.com>
 
         https://bugs.webkit.org/show_bug.cgi?id=183876
index 15aef67..5b8e194 100644 (file)
@@ -76,20 +76,21 @@ class InlineFormattingContext extends FormattingContext {
     _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();
     }
index 2699134..67e02dd 100644 (file)
@@ -46,10 +46,10 @@ class Line {
         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));
     }
index 447ff5d..e4fa533 100644 (file)
@@ -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);
     }
 }
index ef2194d..41b561a 100644 (file)
@@ -73,8 +73,4 @@ class FormattingState {
         ASSERT(!layoutBox.parent());
         return this.layoutState().initialDisplayBox();
     }
-
-    _setFormattingContext(formattingContext) {
-        this.m_formattingContext = formattingContext;
-    }
 }
index 8169b02..b236719 100644 (file)
@@ -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();
     }
 
index 2bd04c1..6e9f0e5 100644 (file)
@@ -35,7 +35,7 @@ class Text {
     }
 
     content() {
-        return this.m_node.wholeText;
+        return this.m_node.textContent;
     }
 
     length() {
index 7c6f3b0..6537066 100644 (file)
@@ -475,6 +475,14 @@ class Utils {
         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 @@ class Utils {
             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;
index 47a7127..e2b2e7f 100644 (file)
@@ -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>