Commit graph

53 commits

Author SHA1 Message Date
Aliaksandr Kalenik
7cc20f4cb5 LibWeb: Reset margin collapsing state only if box indeed add clearance
This fixes the issue when margin collapsing state was always reset if
a box has clear property not equal to none even if it does not actually
introduce clearance.
2023-05-26 18:11:35 +02:00
Andreas Kling
bab6796099 LibWeb: Rewrite calculation of available space between floats
This code now works in terms of *intrusion* by left and right side
floats into a given box whose insides we're trying to layout.

Previously, it worked in terms of space occupied by floats in the root
box of the BFC they participated in. That created a bunch of edge cases
since the code asking about the information wasn't operating in root
coordinate space, but in the coordinate space of some arbitrarily nested
block descendant of the root.

This finally allows horizontal margins in the containing block chain to
affect floats and nested content correctly, and it also allows us to
remove a bogus workaround in InlineFormattingContext.
2023-05-16 14:35:10 +02:00
Aliaksandr Kalenik
038283f3fc LibWeb: Rename function to find table box width inside table wrapper
compute_table_box_width_inside_table_wrapper should be a better name
considering what this function does.
2023-05-07 06:31:53 +02:00
Andreas Kling
00999a245c LibWeb: Let FormattingContext decide the automatic width of its root
Instead of special-casing FlexFormattingContext in the intrinsic sizing
layout helpers, add FormattingContext::automatic_content_width() and let
each context subclass decide what that means.

No behavior change here, just moving this responsibility.
2023-03-20 17:57:58 +01:00
Matthew Olsson
7c0c1c8f49 LibJS+LibWeb: Wrap raw JS::Cell*/& fields in GCPtr/NonnullGCPtr 2023-03-15 08:48:49 +01:00
Andreas Kling
7e76a51cb0 LibWeb: Rename Layout::InitialContainingBlock to Layout::Viewport
The name "initial containing block" was wrong for this, as it doesn't
correspond to the HTML element, and that's specifically what it's
supposed to do! :^)
2023-02-28 12:21:56 +01:00
Aliaksandr Kalenik
0cd63f851e LibWeb: Store y offset of current block container in BFC member
This change should make it possible to access y offset of current block
container in BFC without explicitly passing it using method parameters.
2023-02-10 20:55:33 +01:00
Aliaksandr Kalenik
709fe01f52 LibWeb: Override width calculation for table wrappers
Introduce `TableWrapper` type so table wrappers could be
distinguished from block containers and override width
calculation for table wrappers (CSS 2.2 spec, section 17.5.2)
 inside BFCs in the way that their width should be equal to
width of table box they wrap.
2023-01-14 19:22:08 +01:00
Sam Atkins
33f42e3490 LibWeb: Remove redundant BFC::is_block_formatting_context() method
This is marked as virtual, but the super-method isn't, and also, the
super-method already returns the correct value, so this isn't needed.
2023-01-07 11:49:04 +00:00
Sam Atkins
ace66d4a3e LibWeb: Convert BlockFormattingContext to new pixel units 2023-01-05 17:42:31 +01:00
Sam Atkins
f5f25562d1 LibWeb: Convert FormattingContext to new pixel units
Just FormattingContext and AvailableSpace, and the minor adjustments to
make everything else work.
2023-01-05 17:42:31 +01:00
Aliaksandr Kalenik
8259ff12bd LibWeb: Margin bottom collapsing between parent and last child 2022-12-30 14:21:19 +01:00
Aliaksandr Kalenik
7088a87f49 LibWeb: Margin top collapsing between parent and first child
Implement collapsing of a box margin-top and first in-flow
child margin-top by saving function that updates y position
of containing block inside BlockMarginState and then for
every child until "non-collapsed through" child is reached
y position of containing block is updated by calling
update_box_waiting_fox_final_y_position_callback.
2022-12-30 14:21:19 +01:00
Aliaksandr Kalenik
fe8304d5de LibWeb: Introduce structure that maintains collapsible margins in BFC
Previously y position of boxes in block formatting context
was calculated by looking at y position of previous in-flow
sibling and adding collapsed margin of "collapse through"
boxes lying between box currently being laid out and it's
previous in-flow sibling.

Here introduced BlockMarginState structure that maintains
array of currently collapsible margins hence we no longer
need to look at previous sibling to calculate y position
of a box.
2022-12-30 14:21:19 +01:00
Andreas Kling
db318aece0 LibWeb: Move should_treat_{width,height}_as_auto() to FormattingContext
These are not specific to BFC, so let's move them up to the super class
so that other layout classes can use them.
2022-11-03 19:22:40 +01:00
Andreas Kling
4b74f36cd0 LibWeb: Resolve vertical margins against containing block width
We were incorrectly resolving them against the available width, which
may or may not be the same as the containing block width.

The specification for these properties says that percentages resolve
against the containing block width, so that's what we should do.
2022-10-10 20:22:50 +02:00
Andreas Kling
9c44634ca5 LibWeb: Reorganize layout algorithms around available space
This is a big and messy change, and here's the gist:

- AvaliableSpace is now 2x AvailableSize (width and height)

- Layout algorithms are redesigned around the idea of available space

- When doing layout across nested formatting contexts, the parent
  context tells the child context how much space is available for the
  child's root box in both axes.

- "Available space" replaces "containing block width" in most places.

- The width and height in a box's UsedValues are considered to be
  definite after they're assigned to. Marking something as having
  definite size is no longer a separate step,

This probably introduces various regressions, but the big win here is
that our layout system now works with available space, just like the
specs are written. Fixing issues will be much easier going forward,
since you don't need to do nearly as much conversion from "spec logic"
to "LibWeb logic" as you previously did.
2022-10-02 21:14:02 +02:00
Andreas Kling
f161e20e57 LibWeb: Make FormattingContext::run() take available space as input
Instead of formatting contexts flailing around to figure out from the
"inside" how much space is available on the "outside", we should
provide the amount of available space in both axes as an input to run().

This basically means that when something creates a nested formatting
context, the parent context is responsible for telling the nested context
how much space is available for layout. This information is provided
immediately when invoking run().

Note that this commit doesn't pass accurate values in all cases yet.
This first step just makes it build, and passes available values in some
cases where getting them was trivial.
2022-09-29 18:33:41 +02:00
Andreas Kling
f0ac687823 LibWeb: Remove awkward BFC::compute_theoretical_height() function
This was used by FFC to estimate the height of flex items after
performing layout inside them.

Now that we have automatic_content_height(), we no longer need this
awkward API and we can fold it into BFC's own height calculation.
2022-09-24 13:53:23 +02:00
Andreas Kling
62974160da LibWeb: Add FormattingContext::automatic_content_height()
This function should return the automatic height of the formatting
context's root box.

Until now, we've been relying on some magical handshakes between parent
and child context, when negotiating the height of child context root
boxes. This is a step towards something more reasonable.
2022-09-24 13:41:08 +02:00
Andreas Kling
77628289c6 LibWeb: Consolidate code for resolving vertical box model metrics in BFC
We already had a helper for this, but compute_height() wasn't using it.
Tweak it so that compute_height() can use it, and remove the duplicated
code that's now redundant.
2022-09-20 10:32:12 +02:00
Andreas Kling
54e0e85581 LibWeb: Treat percentage width/height as "auto" more consistently in BFC
Since we can't resolve percentage sizes against an indefinitely-sized
containing block, treat the sizes as "auto" in all these cases.
2022-09-13 17:03:31 +02:00
Andreas Kling
7ba6eb37fc LibWeb: Rename confusing parameter to layout_block_level_box()
It wasn't the content height, but rather the the bottom edge of the
lowest margin box.
2022-09-08 15:03:55 +02:00
Andreas Kling
3ede8dbffb LibWeb: Rename IntrinsicSizeDetermination to IntrinsicSizing
This matches the exact terminology used in CSS-SIZING-3:
https://drafts.csswg.org/css-sizing-3/#intrinsic-sizing
2022-07-26 01:53:41 +02:00
Andreas Kling
52862c72d0 LibWeb: Rename FormattingState to LayoutState
This seems a bit more descriptive (and also a bit shorter).
2022-07-17 14:11:36 +02:00
Andreas Kling
61c27815e4 LibWeb: More specialization of intrinsic sizing layout
This patch adds a separate entry point for this kind of layout.
We override it in BFC to set up initial width/height values for the
BFC root block.

Resulting dimensions are assigned as content_width and content_height
at the end of intrinsic sizing, for each axis, if it's either "auto"
or there's a min-content or max-content constraint in effect.
2022-07-11 18:57:45 +02:00
Andreas Kling
9784a567d2 LibWeb: Factor out BFC "layout this block-level box" to a function 2022-07-11 18:57:45 +02:00
Andreas Kling
de6f7f0029 LibWeb: Support CSS floats in inline flow
CSS floats are now emitted by the InlineLevelIterator. When this
happens, IFC coordinates with the parent BFC to float the box to the
side, using the current LineBuilder state for vertical placement.

This makes the "instructions" text on Acid3 render as a single
contiguous flow of inline content.
2022-03-22 19:26:51 +01:00
Andreas Kling
c1f0d21bbe LibWeb: Rename the LayoutMode enum values and explain them
The old mode names, while mechanically accurate, didn't really reflect
their relationship to the CSS specifications.

This patch renames them as follows:

    Default => Normal
    AllPossibleLineBreaks => MinContent
    OnlyRequiredLineBreaks => MaxContent

There's also now an explainer comment with the LayoutMode enum about the
specific implications of layout in each mode.
2022-03-19 15:46:15 +01:00
Simon Wanner
a2331e8dd3 LibWeb: Implement CSS transforms on stacking contexts
Since there is currently no easy way to handle rotations and skews
with LibGfx this only implements translation and scaling by first
constructing a general 4x4 transformation matrix like outlined in
the css-transforms-1 specification. This is then downgraded to a
Gfx::AffineTransform in order to transform the destination rectangle
used with draw_scaled_bitmap()

While rotation would be nice this already looks pretty good :^)
2022-03-18 18:51:42 +01:00
Andreas Kling
39b7fbfeb9 LibWeb: Rewrite CSS float implementation to use offset-from-edge
The previous implementation used relative X offsets for both left and
right-side floats. This made right-side floats super awkward, since we
could only determine their X position once the width of the BFC root was
known, and for BFC roots with automatic width, this was not even working
at all most of the time.

This patch changes the way we deal with floats so that BFC keeps track
of the offset-from-edge for each float. The offset is the distance from
the BFC root edge (left or right, depending on float direction) to the
"innermost" margin edge of the floating box.

Floating box are now laid out in two passes: while going through the
normal flow layout, we put floats in their *static* position (i.e the
position they would have occupied if they weren't floating) and then
update the Y position value to the final one.

The second pass occurs later on, when the BFC root has had its width
assigned by the parent context. Once we know the root width, we can
set the X position value of floating boxes. (Because the X position of
right-side floats is relative to the right edge of the BFC root.)
2022-03-18 15:18:48 +01:00
Andreas Kling
ef8a72ff3f LibWeb: Move available_space_for_line() from IFC to BFC
This is preparation for allowing blocks with their own internal BFC to
flow around floating boxes in the parent BFC.

Note that IFC still has the available_space_for_line() API, which
returns space available within the IFC's own containing block, while the
BFC available_space_for_line() returns space available within its root.
2022-03-18 15:18:48 +01:00
Andreas Kling
92266d2247 LibWeb: Create list-item markers during layout tree construction
Previously, these were added during layout. This didn't fit into the new
world where layout doesn't mutate the tree incrementally, so this patch
adds logic to Layout::TreeBuilder for adding a marker to each list-item
box after its children have been constructed.
2022-02-21 18:35:12 +01:00
Andreas Kling
c9700e100e LibWeb: Start making our layout system "transactional"
This patch adds a map of Layout::Node to FormattingState::NodeState.
Instead of updating layout nodes incrementally as layout progresses
through the formatting contexts, all updates are now written to the
corresponding NodeState instead.

At the end of layout, FormattingState::commit() is called, which
transfers all the values from the NodeState objects to the Node.

This will soon allow us to perform completely non-destructive layouts
which don't affect the tree.

Note that there are many imperfections here, and still many places
where we assign to the NodeState, but later read directly from the Node
instead. I'm just committing at this stage to make subsequent diffs
easier to understand.
2022-02-21 18:35:12 +01:00
Andreas Kling
561612f219 LibWeb: Add Layout::FormattingState
The purpose of this new object will be to keep track of various states
during an ongoing layout.

Until now, we've been updating layout tree nodes as we go during layout,
which adds an invisible layer of implicit serialization to the whole
layout system.

My idea with FormattingState is that running layout will produce a
result entirely contained within the FormattingState object. At the end
of layout, it can then be applied to the layout tree, or simply queried
for some metrics we were trying to determine.

When doing subtree layouts to determine intrinsic sizes, we will
eventually be able to clone the current FormattingState, and run the
subtree layout in isolation, opening up opportunities for parallelism.

This first patch doesn't go very far though, it merely adds the object
as a skeleton class, and makes sure the root BFC has one. :^)
2022-02-21 18:35:12 +01:00
Andreas Kling
a4bc7e2d96 LibWeb: Hack BFC to always remember to handle position:absolute elements
Normally we don't layout position:absolute elements until after the
parent formatting context has assigned dimensions to the current
formatting context's root box.

However, some of our parent contexts (especially FFC) don't do this
reliably, which makes position:absolute children have 0x0 dimensions.

Hack this for now by making ~BFC() pretend that the parent assigned
dimensions if it hadn't done it already.
2022-02-19 16:42:02 +01:00
Andreas Kling
dcc2568439 LibWeb: Make IFC register absolutely positioned descendants with BFC
This allows BFC to position all absolutely positioned descendants in the
same pass.
2022-02-15 02:05:53 +01:00
Andreas Kling
0532d7d255 LibWeb: Stop sizing the context root box in formatting contexts
Until now, some formatting contexts (BFC in particular) have been
assigning size to the root box. This is really the responsibility of the
parent formatting context, so let's stop doing it.

To keep position:absolute working, parent formatting contexts now notify
child contexts when the child's root box has been sized. (Note that the
important thing here is for the child root to have its final used height
before it's able to place bottom-relative boxes.)

This breaks flexbox layout in some ways, but we'll have to address those
by improving the spec compliance of FFC.)
2022-02-12 22:30:50 +01:00
Andreas Kling
54beb7433e LibWeb: Place block-level boxes vertically before formatting them inside
Block placement is now divided into a vertical and horizontal step. The
vertical step runs before formatting boxes internally. The horizontal
step still runs after (since we may need the final width value.)

This solves a long-standing architectural problem where IFC didn't know
its origin Y position within the BFC root box. This is required for
figuring out how to flow around floating objects. (Floating objects are
always relative to the BFC root.)
2022-01-24 02:09:17 +01:00
Andreas Kling
bb6af641d4 LibWeb: Unify placement of replaced and non-replaced elements in BFC
Seems like we can share the code for these.
2022-01-24 02:09:17 +01:00
Andreas Kling
d58f60c953 LibWeb: Unify code for assigning vertical box model metrics in BFC
We were doing the exact same thing for both replaced and non-replaced
elements, so let's share the code. :^)
2022-01-24 02:09:17 +01:00
Andreas Kling
f5c5efa067 LibWeb: Allow CSS floating objects to flow across multiple lines
If we run out of horizontal space when placing floating objects,
we now perform a "break" and continue with a new line of floats
below the bottommost margin edge of the current line.

This is definitely not 100% to-spec yet, but a huge improvement
on ACID1 already. :^)
2022-01-23 01:22:41 +01:00
Andreas Kling
0ea438e45b LibWeb: Put BFC floating object state into a struct
This patch adds a BFC::FloatSideData struct so we can contain left and
right floating object layout state in a struct. This is preparation for
adding more per-side state.
2022-01-23 01:22:41 +01:00
Sam Atkins
7879b98f60 LibWeb: Use W3C urls for CSS-DISPLAY spec links 2021-10-15 21:05:35 +01:00
Andreas Kling
f73aa8e2bd LibWeb: Move line boxes from Layout::Box to BlockContainer
Per the spec, only a BlockContainer" can have line boxes, so let's not
clutter up every Layout::Box with line boxes.

This also allows us to establish an invariant that BFC and IFC always
operate on a Layout::BlockContainer.

Note that if BlockContainer has all block-level children, its line boxes
are not used for anything. They are only used in the all inline-level
children scenario.
2021-10-06 21:53:25 +02:00
Andreas Kling
5408913b22 LibWeb: Add BlockFormattingContext::root()
The CSS spec uses the name "block formatting context root" when talking
about a box that establishes a BFC. So let's call it BFC::root() in our
code as well, instead of the less specific BFC::context_box().
2021-10-06 20:10:36 +02:00
Tobias Christiansen
6e1f6bd684 LibWeb: Add transform: translateY() support
This is very naive.
2021-09-18 21:53:37 +02:00
Tobias Christiansen
c51dbb4372 LibWeb: Expose size calculation of BlockFormattingContext
This is a hack for the FlexFormattingContext
2021-06-06 01:46:06 +04:30
Brian Gianforcaro
1682f0b760 Everything: Move to SPDX license identifiers in all files.
SPDX License Identifiers are a more compact / standardized
way of representing file license information.

See: https://spdx.dev/resources/use/#identifiers

This was done with the `ambr` search and replace tool.

 ambr --no-parent-ignore --key-from-file --rep-from-file key.txt rep.txt *
2021-04-22 11:22:27 +02:00
Egor Ananyin
1d343116a9 LibWeb: Fix height calculation for absolutely positioned boxes
This commit fixes algorithm for computing auto height (CSS 2.2 10.6.7)
by including floating boxes into computation and implements one of the cases
for computing the height of absolutely positioned, non-replaced elements (10.6.4 rule 3)
2021-04-17 09:48:27 +02:00