https://bugs.webkit.org/show_bug.cgi?id=183779
Reviewed by Antti Koivisto.
* LayoutReloaded/FormattingContext/BlockFormatting/BlockFormattingContext.js:
(BlockFormattingContext.prototype._computeStaticPosition):
(BlockFormattingContext.prototype._computeOutOfFlowWidth):
(BlockFormattingContext.prototype._computeFloatingWidth):
(BlockFormattingContext.prototype._computeInFlowWidth):
(BlockFormattingContext.prototype._computeOutOfFlowHeight):
(BlockFormattingContext.prototype._computeFloatingHeight):
(BlockFormattingContext.prototype._computeInFlowHeight):
(BlockFormattingContext.prototype._horizontalConstraint):
(BlockFormattingContext.prototype._contentHeight):
(BlockFormattingContext.prototype._adjustBottomWithFIXME):
(BlockFormattingContext.prototype._computeInFlowPositionedPosition):
(BlockFormattingContext.prototype._computeOutOfFlowPosition):
* LayoutReloaded/FormattingContext/FloatingContext.js:
(FloatingContext.prototype.computePosition):
(FloatingContext.prototype._positionForClear):
(FloatingContext.prototype._computePositionToAvoidIntrudingFloats):
(FloatingContext.prototype._availableSpace):
(FloatingContext.prototype._adjustedFloatingPosition):
* LayoutReloaded/FormattingContext/FormattingContext.js:
(FormattingContext):
(FormattingContext.prototype.absoluteMarginBox):
(FormattingContext.prototype.absoluteBorderBox):
(FormattingContext.prototype.absolutePaddingBox):
(FormattingContext.prototype.absoluteContentBox):
(FormattingContext.prototype._toAbsolutePosition):
(FormattingContext.prototype._toRootAbsolutePosition):
(FormattingContext.prototype._addToLayoutQueue):
(FormattingContext.prototype.displayBox):
(FormattingContext.prototype._createDisplayBox): Deleted.
(FormattingContext.prototype.toDisplayBox): Deleted.
(FormattingContext.prototype.toLayoutBox): Deleted.
* LayoutReloaded/FormattingState/FormattingState.js:
(FormattingState):
(FormattingState.prototype.createDisplayBox):
(FormattingState.prototype.displayBox):
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@229758
268f45cc-cd09-0410-ab3c-
d52691b4dbfc
+2018-03-20 Zalan Bujtas <zalan@apple.com>
+
+ [LayoutReloaded] Move Display.Box handling from FormattingContext to FormattingState
+ https://bugs.webkit.org/show_bug.cgi?id=183779
+
+ Reviewed by Antti Koivisto.
+
+ * LayoutReloaded/FormattingContext/BlockFormatting/BlockFormattingContext.js:
+ (BlockFormattingContext.prototype._computeStaticPosition):
+ (BlockFormattingContext.prototype._computeOutOfFlowWidth):
+ (BlockFormattingContext.prototype._computeFloatingWidth):
+ (BlockFormattingContext.prototype._computeInFlowWidth):
+ (BlockFormattingContext.prototype._computeOutOfFlowHeight):
+ (BlockFormattingContext.prototype._computeFloatingHeight):
+ (BlockFormattingContext.prototype._computeInFlowHeight):
+ (BlockFormattingContext.prototype._horizontalConstraint):
+ (BlockFormattingContext.prototype._contentHeight):
+ (BlockFormattingContext.prototype._adjustBottomWithFIXME):
+ (BlockFormattingContext.prototype._computeInFlowPositionedPosition):
+ (BlockFormattingContext.prototype._computeOutOfFlowPosition):
+ * LayoutReloaded/FormattingContext/FloatingContext.js:
+ (FloatingContext.prototype.computePosition):
+ (FloatingContext.prototype._positionForClear):
+ (FloatingContext.prototype._computePositionToAvoidIntrudingFloats):
+ (FloatingContext.prototype._availableSpace):
+ (FloatingContext.prototype._adjustedFloatingPosition):
+ * LayoutReloaded/FormattingContext/FormattingContext.js:
+ (FormattingContext):
+ (FormattingContext.prototype.absoluteMarginBox):
+ (FormattingContext.prototype.absoluteBorderBox):
+ (FormattingContext.prototype.absolutePaddingBox):
+ (FormattingContext.prototype.absoluteContentBox):
+ (FormattingContext.prototype._toAbsolutePosition):
+ (FormattingContext.prototype._toRootAbsolutePosition):
+ (FormattingContext.prototype._addToLayoutQueue):
+ (FormattingContext.prototype.displayBox):
+ (FormattingContext.prototype._createDisplayBox): Deleted.
+ (FormattingContext.prototype.toDisplayBox): Deleted.
+ (FormattingContext.prototype.toLayoutBox): Deleted.
+ * LayoutReloaded/FormattingState/FormattingState.js:
+ (FormattingState):
+ (FormattingState.prototype.createDisplayBox):
+ (FormattingState.prototype.displayBox):
+
2018-03-20 Zalan Bujtas <zalan@apple.com>
[LayoutReloaded] Introduce FormattingState (Block/Inline/etc)
// In a block formatting context, boxes are laid out one after the other, vertically, beginning at the top of a containing block.
// The vertical distance between two sibling boxes is determined by the 'margin' properties.
// Vertical margins between adjacent block-level boxes in a block formatting context collapse.
- let containingBlockContentBox = this.toDisplayBox(layoutBox.containingBlock()).contentBox();
+ let containingBlockContentBox = this.displayBox(layoutBox.containingBlock()).contentBox();
// Start from the top of the container's content box.
let previousInFlowSibling = layoutBox.previousInFlowSibling();
let contentBottom = containingBlockContentBox.top()
if (previousInFlowSibling)
- contentBottom = this.toDisplayBox(previousInFlowSibling).bottom() + this.marginBottom(previousInFlowSibling);
+ contentBottom = this.displayBox(previousInFlowSibling).bottom() + this.marginBottom(previousInFlowSibling);
let position = new LayoutPoint(contentBottom, containingBlockContentBox.left());
position.moveBy(new LayoutSize(this.marginLeft(layoutBox), this.marginTop(layoutBox)));
- this.toDisplayBox(layoutBox).setTopLeft(position);
+ this.displayBox(layoutBox).setTopLeft(position);
}
_placeInFlowPositionedChildren(container) {
else if (Utils.isLeftAuto(layoutBox) && !Utils.isWidthAuto(layoutBox) && !Utils.isRightAuto(layoutBox))
width = Utils.width(layoutBox); // 4
else if (Utils.isWidthAuto(layoutBox) && !Utils.isLeftAuto(layoutBox) && !Utils.isRightAuto(layoutBox))
- width = Math.max(0, this.toDisplayBox(layoutBox.containingBlock()).contentBox().width() - Utils.right(layoutBox) - Utils.left(layoutBox)); // 5
+ width = Math.max(0, this.displayBox(layoutBox.containingBlock()).contentBox().width() - Utils.right(layoutBox) - Utils.left(layoutBox)); // 5
else if (Utils.isRightAuto(layoutBox) && !Utils.isLeftAuto(layoutBox) && !Utils.isWidthAuto(layoutBox))
width = Utils.width(layoutBox); // 6
else
ASSERT_NOT_REACHED();
width += Utils.computedHorizontalBorderAndPadding(layoutBox.node());
- this.toDisplayBox(layoutBox).setWidth(width);
+ this.displayBox(layoutBox).setWidth(width);
}
_computeFloatingWidth(layoutBox) {
// FIXME: missing cases
- this.toDisplayBox(layoutBox).setWidth(Utils.width(layoutBox) + Utils.computedHorizontalBorderAndPadding(layoutBox.node()));
+ this.displayBox(layoutBox).setWidth(Utils.width(layoutBox) + Utils.computedHorizontalBorderAndPadding(layoutBox.node()));
}
_computeInFlowWidth(layoutBox) {
if (Utils.isWidthAuto(layoutBox))
- return this.toDisplayBox(layoutBox).setWidth(this._horizontalConstraint(layoutBox));
- return this.toDisplayBox(layoutBox).setWidth(Utils.width(layoutBox) + Utils.computedHorizontalBorderAndPadding(layoutBox.node()));
+ return this.displayBox(layoutBox).setWidth(this._horizontalConstraint(layoutBox));
+ return this.displayBox(layoutBox).setWidth(Utils.width(layoutBox) + Utils.computedHorizontalBorderAndPadding(layoutBox.node()));
}
_computeOutOfFlowHeight(layoutBox) {
else if (Utils.isTopAuto((layoutBox)) && !Utils.isHeightAuto((layoutBox)) && !Utils.isBottomAuto((layoutBox)))
height = Utils.height(layoutBox); // 6
else if (Utils.isHeightAuto((layoutBox)) && !Utils.isTopAuto((layoutBox)) && !Utils.isBottomAuto((layoutBox)))
- height = Math.max(0, this.toDisplayBox(layoutBox.containingBlock()).contentBox().height() - Utils.bottom(layoutBox) - Utils.top(layoutBox)); // 7
+ height = Math.max(0, this.displayBox(layoutBox.containingBlock()).contentBox().height() - Utils.bottom(layoutBox) - Utils.top(layoutBox)); // 7
else if (Utils.isBottomAuto((layoutBox)) && !Utils.isTopAuto((layoutBox)) && !Utils.isHeightAuto((layoutBox)))
height = Utils.height(layoutBox); // 8
else
ASSERT_NOT_REACHED();
height += Utils.computedVerticalBorderAndPadding(layoutBox.node());
- this.toDisplayBox(layoutBox).setHeight(height);
+ this.displayBox(layoutBox).setHeight(height);
}
_computeFloatingHeight(layoutBox) {
// FIXME: missing cases
- this.toDisplayBox(layoutBox).setHeight(Utils.height(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
+ this.displayBox(layoutBox).setHeight(Utils.height(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
}
_computeInFlowHeight(layoutBox) {
// The element's height is the distance from its top content edge to the first applicable of the following:
// 1. the bottom edge of the last line box, if the box establishes a inline formatting context with one or more lines
- return this.toDisplayBox(layoutBox).setHeight(this._contentHeight(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
+ return this.displayBox(layoutBox).setHeight(this._contentHeight(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
}
- return this.toDisplayBox(layoutBox).setHeight(Utils.height(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
+ return this.displayBox(layoutBox).setHeight(Utils.height(layoutBox) + Utils.computedVerticalBorderAndPadding(layoutBox.node()));
}
_horizontalConstraint(layoutBox) {
- let horizontalConstraint = this.toDisplayBox(layoutBox.containingBlock()).contentBox().width();
+ let horizontalConstraint = this.displayBox(layoutBox.containingBlock()).contentBox().width();
horizontalConstraint -= this.marginLeft(layoutBox) + this.marginRight(layoutBox);
return horizontalConstraint;
}
let lastLine = lines[lines.length - 1];
return lastLine.rect().bottom();
}
- let top = this.toDisplayBox(layoutBox).contentBox().top();
+ let top = this.displayBox(layoutBox).contentBox().top();
let bottom = this._adjustBottomWithFIXME(layoutBox);
return bottom - top;
}
let lastInFlowDisplayBox = lastInFlowChild.displayBox();
let bottom = lastInFlowDisplayBox.bottom() + this.marginBottom(lastInFlowChild);
// FIXME: margin for body
- if (lastInFlowChild.name() == "RenderBody" && Utils.isHeightAuto(lastInFlowChild) && !this.toDisplayBox(lastInFlowChild).contentBox().height())
+ if (lastInFlowChild.name() == "RenderBody" && Utils.isHeightAuto(lastInFlowChild) && !this.displayBox(lastInFlowChild).contentBox().height())
bottom -= this.marginBottom(lastInFlowChild);
// FIXME: figure out why floatings part of the initial block formatting context get propagated to HTML
if (layoutBox.node().tagName == "HTML") {
_computeInFlowPositionedPosition(layoutBox) {
// Start with the original, static position.
- let displayBox = this.toDisplayBox(layoutBox);
+ let displayBox = this.displayBox(layoutBox);
let relativePosition = displayBox.topLeft();
// Top/bottom
if (!Utils.isTopAuto(layoutBox))
}
_computeOutOfFlowPosition(layoutBox) {
- let displayBox = this.toDisplayBox(layoutBox);
+ let displayBox = this.displayBox(layoutBox);
let top = Number.NaN;
- let containerSize = this.toDisplayBox(layoutBox.containingBlock()).contentBox().size();
+ let containerSize = this.displayBox(layoutBox.containingBlock()).contentBox().size();
// Top/bottom
if (Utils.isTopAuto(layoutBox) && Utils.isBottomAuto(layoutBox)) {
ASSERT(Utils.isStaticallyPositioned(layoutBox));
computePosition(layoutBox) {
if (layoutBox.isOutOfFlowPositioned())
return;
- let displayBox = this._formattingContext().toDisplayBox(layoutBox);
+ let displayBox = this._formattingContext().displayBox(layoutBox);
if (layoutBox.isFloatingPositioned()) {
let position = this._positionForFloating(layoutBox);
this._addFloating(layoutBox);
_positionForClear(layoutBox) {
ASSERT(Utils.hasClear(layoutBox));
- let displayBox = this._formattingContext().toDisplayBox(layoutBox);
+ let displayBox = this._formattingContext().displayBox(layoutBox);
if (this._isEmpty())
return displayBox.topLeft();
_computePositionToAvoidIntrudingFloats(layoutBox) {
if (!layoutBox.establishesBlockFormattingContext() || this._isEmpty())
- return this._formattingContext().toDisplayBox(layoutBox).topLeft();
+ return this._formattingContext().displayBox(layoutBox).topLeft();
// The border box of a table, a block-level replaced element, or an element in the normal flow that establishes
// a new block formatting context (such as an element with 'overflow' other than 'visible') must not overlap the
// margin box of any floats in the same block formatting context as the element itself.
}
_availableSpace(containingBlock, floatingPair) {
- let containingBlockContentBox = this._formattingContext().toDisplayBox(containingBlock);
+ let containingBlockContentBox = this._formattingContext().displayBox(containingBlock);
if (floatingPair.left && floatingPair.right)
return this._formattingContext().absoluteMarginBox(floatingPair.right).left() - this._formattingContext().absoluteMarginBox(floatingPair.left).right();
if (floatingPair.left)
if (Utils.isFloatingLeft(floatingBox) || !Utils.isFloatingPositioned(floatingBox))
return new LayoutPoint(verticalPosition, left);
- return new LayoutPoint(verticalPosition, right - this._formattingContext().toDisplayBox(floatingBox).rect().width());
+ return new LayoutPoint(verticalPosition, right - this._formattingContext().displayBox(floatingBox).rect().width());
}
_bottom(floatingStack) {
this.m_rootContainer = rootContainer;
this.m_layoutState = layoutState;
this.m_floatingContext = null;
- this.m_displayToLayout = new Map();
- this.m_layoutToDisplay = new Map();
this.m_layoutStack = new Array();
}
}
absoluteMarginBox(layoutBox) {
- let displayBox = this.toDisplayBox(layoutBox);
+ let displayBox = this.displayBox(layoutBox);
let absoluteContentBox = new LayoutRect(this._toRootAbsolutePosition(layoutBox), displayBox.size());
absoluteContentBox.moveBy(new LayoutSize(-this.marginLeft(layoutBox), -this.marginTop(layoutBox)));
absoluteContentBox.growBy(new LayoutSize(this.marginLeft(layoutBox) + this.marginRight(layoutBox), this.marginTop(layoutBox) + this.marginBottom(layoutBox)));
}
absoluteBorderBox(layoutBox) {
- let borderBox = this.toDisplayBox(layoutBox).borderBox();
+ let borderBox = this.displayBox(layoutBox).borderBox();
let absoluteRect = new LayoutRect(this._toRootAbsolutePosition(layoutBox), borderBox.size());
absoluteRect.moveBy(borderBox.topLeft());
return absoluteRect;
}
absolutePaddingBox(layoutBox) {
- let paddingBox = this.toDisplayBox(layoutBox).paddingBox();
+ let paddingBox = this.displayBox(layoutBox).paddingBox();
let absoluteRect = new LayoutRect(this._toRootAbsolutePosition(layoutBox), paddingBox.size());
absoluteRect.moveBy(paddingBox.topLeft());
return absoluteRect;
}
absoluteContentBox(layoutBox) {
- let contentBox = this.toDisplayBox(layoutBox).contentBox();
+ let contentBox = this.displayBox(layoutBox).contentBox();
let absoluteRect = new LayoutRect(this._toRootAbsolutePosition(layoutBox), contentBox.size());
absoluteRect.moveBy(contentBox.topLeft());
return absoluteRect;
let ascendant = layoutBox.containingBlock();
while (ascendant && ascendant != container) {
ASSERT(ascendant.isDescendantOf(this.rootContainer()));
- absolutePosition.moveBy(this.toDisplayBox(ascendant).topLeft());
+ absolutePosition.moveBy(this.displayBox(ascendant).topLeft());
ascendant = ascendant.containingBlock();
}
return absolutePosition;
}
_toRootAbsolutePosition(layoutBox) {
- return this._toAbsolutePosition(this.toDisplayBox(layoutBox).topLeft(), layoutBox, this.rootContainer());
+ return this._toAbsolutePosition(this.displayBox(layoutBox).topLeft(), layoutBox, this.rootContainer());
}
_descendantNeedsLayout() {
_addToLayoutQueue(layoutBox) {
// Initialize the corresponding display box.
- this._createDisplayBox(layoutBox);
+ this.layoutState().createDisplayBox(layoutBox);
this.m_layoutStack.push(layoutBox);
}
this.m_layoutStack.splice(this.m_layoutStack.indexOf(layoutBox), 1);
}
- _createDisplayBox(layoutBox) {
- let displayBox = new Display.Box(layoutBox.node());
- this.m_displayToLayout.set(displayBox, layoutBox);
- this.m_layoutToDisplay.set(layoutBox, displayBox);
- // This is temporary.
- layoutBox.setDisplayBox(displayBox);
- }
-
- toDisplayBox(layoutBox) {
- ASSERT(layoutBox);
- return layoutBox.displayBox();
- }
-
- toLayoutBox(displayBox) {
- ASSERT(displayBox);
- ASSERT(this.m_displayToLayout.has(displayBox));
- return this.m_displayToLayout.get(displayBox);
+ displayBox(layoutBox) {
+ return this.layoutState().displayBox(layoutBox);
}
_outOfFlowDescendants() {
constructor(layoutContext) {
this.m_layoutContext = layoutContext;
this.m_formattingContext = null;
+ this.m_displayToLayout = new Map();
}
formattingContext() {
return this.m_layoutContext;
}
+ createDisplayBox(layoutBox) {
+ let displayBox = new Display.Box(layoutBox.node());
+ this.m_displayToLayout.set(layoutBox, displayBox);
+ // This is temporary.
+ layoutBox.setDisplayBox(displayBox);
+ }
+
+ displayBox(layoutBox) {
+ ASSERT(layoutBox);
+ return layoutBox.displayBox();
+ }
+
_setFormattingContext(formattingContext) {
this.m_formattingContext = formattingContext;
}