https://bugs.webkit.org/show_bug.cgi?id=184212
Reviewed by Antti Koivisto.
This is in preparation for moving margin box out of formatting context to Display.Box.
* LayoutReloaded/DisplayTree/Box.js:
(Display.Box):
(Display.Box.prototype.setRect):
(Display.Box.prototype.setTopLeft):
(Display.Box.prototype.setTop):
(Display.Box.prototype.setLeft):
(Display.Box.prototype.setSize):
(Display.Box.prototype.setWidth):
(Display.Box.prototype.setHeight):
(Display.Box.prototype.width):
(Display.Box.prototype.setMarginTop):
(Display.Box.prototype.setMarginLeft):
(Display.Box.prototype.setMarginBottom):
(Display.Box.prototype.setMarginRight):
(Display.Box.prototype.marginTop):
(Display.Box.prototype.marginLeft):
(Display.Box.prototype.marginBottom):
(Display.Box.prototype.marginRight):
(Display.Box.prototype.marginBox):
* LayoutReloaded/FormattingContext/FormattingContext.js:
(FormattingContext.prototype.absoluteMarginBox):
(FormattingContext.prototype._addToLayoutQueue):
* LayoutReloaded/FormattingState/FormattingState.js:
(FormattingState.prototype.createDisplayBox):
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@230135
268f45cc-cd09-0410-ab3c-
d52691b4dbfc
+2018-03-31 Zalan Bujtas <zalan@apple.com>
+
+ [layoutReloaded] Introduce margin to Display.Box
+ https://bugs.webkit.org/show_bug.cgi?id=184212
+
+ Reviewed by Antti Koivisto.
+
+ This is in preparation for moving margin box out of formatting context to Display.Box.
+
+ * LayoutReloaded/DisplayTree/Box.js:
+ (Display.Box):
+ (Display.Box.prototype.setRect):
+ (Display.Box.prototype.setTopLeft):
+ (Display.Box.prototype.setTop):
+ (Display.Box.prototype.setLeft):
+ (Display.Box.prototype.setSize):
+ (Display.Box.prototype.setWidth):
+ (Display.Box.prototype.setHeight):
+ (Display.Box.prototype.width):
+ (Display.Box.prototype.setMarginTop):
+ (Display.Box.prototype.setMarginLeft):
+ (Display.Box.prototype.setMarginBottom):
+ (Display.Box.prototype.setMarginRight):
+ (Display.Box.prototype.marginTop):
+ (Display.Box.prototype.marginLeft):
+ (Display.Box.prototype.marginBottom):
+ (Display.Box.prototype.marginRight):
+ (Display.Box.prototype.marginBox):
+ * LayoutReloaded/FormattingContext/FormattingContext.js:
+ (FormattingContext.prototype.absoluteMarginBox):
+ (FormattingContext.prototype._addToLayoutQueue):
+ * LayoutReloaded/FormattingState/FormattingState.js:
+ (FormattingState.prototype.createDisplayBox):
+
2018-03-31 Zalan Bujtas <zalan@apple.com>
[LayoutReloaded] Add tree context to Display.Box
constructor(node) {
this.m_node = node;
this.m_rect = new LayoutRect(new LayoutPoint(0, 0), new LayoutSize(0, 0));
+ this.m_marginTop = 0;
+ this.m_marginLeft = 0;
+ this.m_marginBottom = 0;
+ this.m_marginRight = 0;
this.m_parent = null;
this.m_nextSibling = null;
this.m_previousSibling = null;
return cloneBox;
}
+ setRect(rect) {
+ return this.m_rect = rect;
+ }
+
+ setTopLeft(topLeft) {
+ this.m_rect.setTopLeft(topLeft);
+ }
+
+ setTop(top) {
+ this.m_rect.setTop(top);
+ }
+
+ setLeft(left) {
+ this.m_rect.setLeft(left);
+ }
+
+ setSize(size) {
+ this.m_rect.setSize(size);
+ }
+
+ setWidth(width) {
+ this.m_rect.setWidth(width);
+ }
+
+ setHeight(height) {
+ this.m_rect.setHeight(height);
+ }
+
rect() {
return this.m_rect.clone();
}
- setRect(rect) {
- return this.m_rect = rect;
- }
-
top() {
return this.rect().top();
}
return this.rect().size();
}
+ width() {
+ return this.rect().width();
+ }
+
height() {
return this.rect().height();
}
- width() {
- return this.rect().width();
- }
+ setMarginTop(marginTop) {
+ this.m_marginTop = marginTop;
+ }
- setTopLeft(topLeft) {
- this.m_rect.setTopLeft(topLeft);
+ setMarginLeft(marginLeft) {
+ this.m_marginLeft = marginLeft;
+ }
+
+ setMarginBottom(marginBottom) {
+ this.m_marginBottom = marginBottom;
+ }
+
+ setMarginRight(marginRight) {
+ this.m_marginRight = marginRight;
}
- setTop(top) {
- this.m_rect.setTop(top);
+ marginTop() {
+ return this.m_marginTop;
}
- setSize(size) {
- this.m_rect.setSize(size);
+ marginLeft() {
+ return this.m_marginLeft;
}
- setWidth(width) {
- this.m_rect.setWidth(width);
+ marginBottom() {
+ return this.m_marginBottom;
}
- setHeight(height) {
- this.m_rect.setHeight(height);
+ marginRight() {
+ return this.m_marginRight;
}
+ marginBox() {
+ let marginBox = this.rect();
+ marginBox.moveBy(new LayoutSize(-this.m_marginLeft, -this.m_marginTop));
+ marginBox.growBy(new LayoutSize(this.m_marginLeft + this.m_marginRight, this.m_marginTop + this.m_marginBottom));
+ return marginBox;
+ }
+
borderBox() {
return new LayoutRect(new LayoutPoint(0, 0), this.rect().size());
}
absoluteMarginBox(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)));
- return absoluteContentBox;
+ let absoluteRect = new LayoutRect(this._toRootAbsolutePosition(layoutBox), displayBox.borderBox().size());
+ absoluteRect.moveBy(new LayoutSize(-displayBox.marginLeft(), -displayBox.marginTop()));
+ absoluteRect.growBy(new LayoutSize(displayBox.marginLeft() + displayBox.marginRight(), displayBox.marginTop() + displayBox.marginBottom()));
+ return absoluteRect;
}
absoluteBorderBox(layoutBox) {
_addToLayoutQueue(layoutBox) {
// Initialize the corresponding display box.
- this.formattingState().createDisplayBox(layoutBox);
+ let displayBox = this.formattingState().createDisplayBox(layoutBox, this);
+ if (layoutBox.node()) {
+ displayBox.setMarginTop(this.marginTop(layoutBox));
+ displayBox.setMarginLeft(this.marginLeft(layoutBox));
+ displayBox.setMarginBottom(this.marginBottom(layoutBox));
+ displayBox.setMarginRight(this.marginRight(layoutBox));
+ }
+
this.m_layoutStack.push(layoutBox);
}
parentDisplayBox.setLastChild(displayBox);
}
this.m_displayToLayout.set(layoutBox, displayBox);
+ return displayBox;
}
displayBoxMap() {