Commit graph

146 commits

Author SHA1 Message Date
Aliaksandr Kalenik
df57d7ca68 LibGfx+LibWeb: Update for_each_glyph_position to use font cascade list
This change updates function that builds list of glyphs to use font
cascade list to find font for each code point.
2023-12-10 17:32:04 +01:00
Aliaksandr Kalenik
2cb0039a13 LibGfx+LibWeb: Produce font cascade list in CSS font matching algorithm
According to the CSS font matching algorithm specification, it is
supposed to be executed for each glyph instead of each text run, as is
currently done. This change partially implements this by having the
font matching algorithm produce a list of fonts against which each
glyph will be tested to find its suitable font.

Now, it becomes possible to have per-glyph fallback fonts: if the
needed glyph is not present in a font, we can check the subsequent
fonts in the list.
2023-12-10 17:32:04 +01:00
Aliaksandr Kalenik
0d03257e69 LibGfx+LibAccelGfx+LibWeb: Use RefPtr for font in DrawGlyphOrEmoji 2023-12-10 17:32:04 +01:00
Aliaksandr Kalenik
d1d6da6ab6 LibWeb: Resolve border radius during layout and save it in paintables
This change fixes a problem that we should not call `to_px()` to
resolve any length or percentage values during paintables traversal
because that is supposed to happen while performing layout.

Also it improves performance because before we were resolving border
radii during each painting phase but now it happens only once during
layout.
2023-12-07 10:52:47 +01:00
Aliaksandr Kalenik
e8960cf754 LibWeb: Move BorderRadiusCornerClipper allocation into CPU executor
BorderRadiusCornerClipper usage to clip border radius is specific to
CPU painter so it should not be stored in painting commands.

Also with this change bitmaps for corner sampling are allocated during
painting commands replaying instead of commands recording.
2023-12-06 13:05:59 +01:00
Aliaksandr Kalenik
f93cab7679 LibWeb/Painting: Use scaled font for selected text
Fixes regression introduced in:
681771d210
2023-12-03 23:16:17 +01:00
Aliaksandr Kalenik
681771d210 LibGfx+LibWeb: Calculate and save glyph positions during layout
Previously, we determined the positions of glyphs for each text run at
the time of painting, which constituted a significant portion of the
painting process according to profiles. However, since we already go
through each glyph to figure out the width of each fragment during
layout, we can simultaneously gather data about the position of each
glyph in the layout phase and utilize this information in the painting
phase.

I had to update expectations for a couple of reference tests. These
updates are due to the fact that we now measure glyph positions during
layout using a 1x font, and then linearly scale each glyph's position
to device pixels during painting. This approach should be acceptable,
considering we measure a fragment's width and height with an unscaled
font during layout.
2023-12-02 22:06:11 +01:00
Shannon Booth
56d10bf198 LibWeb: Port Layout::TextNode from DeprecatedString 2023-11-28 17:15:27 -05:00
Aliaksandr Kalenik
1b3223dd9e LibWeb: Rename painter() to recording_painter() in PaintContext
Using recording_painter() as a name is less misleading, indicating
the painter in stacking context traversal doesn't perform actual
painting commands.
2023-11-27 21:53:38 +01:00
Aliaksandr Kalenik
29ff1f67be LibWeb: Introduce dedicated painting command for borders
Currently, in CPU painter, border painting is implemented by building
a Gfx::Path that is filled by Gfx::AntiAliasingPainter. In the GPU
painter, we will likely want to do something different, and with a
special command, it becomes possible.

Also, by making this change, the CPU executor also benefits because now
we can skip building paths for borders that are out of the viewport.
2023-11-20 14:59:47 +01:00
Aliaksandr Kalenik
70353b79af LibWeb: Change paint_all_borders() to accept only device pixel values
By consistently accepting only device pixel values instead of a mix of
CSSPixels and DevicePixels values, we can simplify the implementation
of paint_border() and paint_all_borders().
2023-11-20 14:59:47 +01:00
Aliaksandr Kalenik
fd3411c868 LibWeb: Ignore document's box during overflow clip rect calculation
Reduction of bug:
```html
<!DOCTYPE html><style>
html {
    overflow-x: hidden;
    overflow-y: scroll;
}
div {
    background: orange;
    height: 1000px;
    width: 500px;
}
</style><body><div>
```

Fixes https://github.com/SerenityOS/serenity/issues/21690 and painting
on many other websites (null.com, servo.org).
2023-11-09 07:56:34 +01:00
Aliaksandr Kalenik
4318bcf447 LibWeb: Record painting commands in coordinates of stacking context
By storing painting command coordinates relative to the nearest
stacking context we can get rid of the Translate command.

Additionally, this allows us to easily check if the bounding
rectangles of the commands cover or intersect within a stacking
context. This should be useful if we decide to optimize by avoiding
the execution of commands that will be overpainted by the results of
subsequent commands.
2023-10-25 05:53:36 +02:00
MacDue
1c012f0a4a LibWeb: Remove "cached corner bitmap" and its use in the corner clipper
With the recording painter the actual painting operations are delayed,
so now if multiple corner clippers are constructed, and they use a
shared bitmap they can interfere with each other. The use of this shared
bitmap was somewhat questionable anyway, so this is not much of a loss.

This fixes the border-radius.html test page.
2023-10-21 23:16:17 +02:00
Aliaksandr Kalenik
063e66cae9 LibWeb: Introduce RecordingPainter to serialize painting commands
This modification introduces a new layer to the painting process. The
stacking context traversal no longer immediately calls the
Gfx::Painter methods. Instead, it writes serialized painting commands
into newly introduced RecordingPainter. Created list of commands is
executed later to produce resulting bitmap.

Producing painting command list will make it easier to add new
optimizations:
- It's simpler to check if the painting result is not visible in the
  viewport at the command level rather than during stacking context
  traversal.
- Run painting in a separate thread. The painting thread can process
  serialized painting commands, while the main thread can work on the
  next paintable tree and safely invalidate the previous one.
- As we consider GPU-accelerated painting support, it would be easier
  to back each painting command rather than constructing an alternative
  for the entire Gfx::Painter API.
2023-10-18 10:58:42 +02:00
Aliaksandr Kalenik
7803dcfcf9 LibWeb: Resolve backdrop filter length in apply_style()
Instead of resolving lengths used in the backdrop-filter during
painting, we can do that earlier in apply_style().

This change moves us a bit closer to the point when the stacking
context tree will be completely separated from the layout tree :)
2023-10-12 07:38:48 +02:00
Aliaksandr Kalenik
46254101f7 LibWeb: Change DOM::Position to be GC-allocated 2023-09-26 21:25:54 +02:00
Andreas Kling
1f69e9cddf LibWeb: Remove Layout::Node::m_visible and compute it on the fly
This fixes an issue where the value would be out of sync with reality
in anonymous wrapper block boxes, since we forgot to compute m_visible
after assigning the computed values to them.

Fixes #21106
2023-09-18 14:45:20 +02:00
Zaggy1024
709767cc4b LibWeb: Don't convert to floating point in CSS::EdgeRect 2023-09-01 09:40:14 +02:00
Zaggy1024
9d4a1ac2b3 LibWeb: Apply CSS clip property to an element as well as its children
d06d4eb made the `clip` property apply to children of an absolute-
positioned element, but caused it not to be applied to the element the
property was applied to directly.

To fix this, apply the clip in new `before_paint()` and `after_paint()`
functions. Doing so keeps painter state from leaking from `paint()`,
but still allows subclasses of `PaintableBox` clip their contents
correctly without repeating the application of the clip rectangle.
2023-09-01 09:40:14 +02:00
Andreas Kling
6238860c6d LibWeb: Simplify PaintableBox::enclosing_stacking_context() 2023-08-28 23:36:22 +02:00
MacDue
71baa8c31a LibWeb: Add CSSPixels::nearest_value_for(FloatingPoint)
This is intended to annotate conversions from unknown floating-point
values to CSSPixels, and make it more obvious the fp value will be
rounded to the nearest fixed-point value.
2023-08-26 23:53:45 +02:00
MacDue
360c0eb509 LibWeb: Remove implicit conversion from float and double to CSSPixels
In general it is not safe to convert any arbitrary floating-point value
to CSSPixels. CSSPixels has a resolution of 0.015625, which for small
values (e.g. scale factors between 0 and 1), can produce bad results
if converted to CSSPixels then scaled back up. In the worst case values
can underflow to zero and produce incorrect results.
2023-08-26 23:53:45 +02:00
Sam Atkins
84a5c67d6b LibWeb: Use system colors in more places 2023-08-25 20:30:20 +01:00
Aliaksandr Kalenik
d06d4eb388 LibWeb: Apply "clip" property in apply_clip_overflow_rect()
Fixes bug when "clip" property does not affect abspos children.
This change makes "clip" property to be applied together with
"overflow: hidden" in `apply_clip_overflow_rect()` that already
handles abspos children correctly.
2023-08-23 15:49:06 +02:00
Andreas Kling
8bb275f2ea LibWeb: Move painting logic from Layout::Viewport to ViewportPaintable 2023-08-20 05:02:59 +02:00
Andreas Kling
79db9c27c6 LibWeb: Rename PaintableBox::effective_offset() => offset()
Since this function no longer does any computation, just "offset" seems
like a fine name.
2023-08-15 16:37:11 +02:00
Andreas Kling
25a3d0d643 LibWeb: Resolve relative offsets *once* after layout
Instead of applying relative offsets (like position:relative insets)
during painting and hit testing, we now do a pass at the end of layout
and assign the final resolved offsets to paintables.

This makes painting and hit testing easier since they don't have to
think about relative offsets, and it also fixes a bug where offsets were
not applied to text fragments inside inline-flow elements that were
themselves position:relative.
2023-08-15 16:37:11 +02:00
Aliaksandr Kalenik
5f364e9bc1 LibWeb: Rename is_scrollable() to is_user_scrollable()
is_user_scrollable() is more appropriate name since this function
returns true only for boxes scrollable by user interaction.
2023-08-08 16:55:14 +02:00
Aliaksandr Kalenik
1b63095271 LibWeb: Compensate scroll offset translation before clip rect is applied
Position where box clip rect is applied should not be affected by
current scroll offset.
2023-08-08 16:55:14 +02:00
Aliaksandr Kalenik
cdf8b9e943 LibWeb/Painting: Translate by scroll offset before painting descendants
Fixes painting of nested nodes in scrollable containers by moving
painter's scroll offset translation from paint_node() to
before_children_paint() and after_children_paint().
2023-08-08 16:55:14 +02:00
Andi Gallo
7bd00d6a42 LibWeb: Snap table grid to device pixels in separate borders mode
Build a grid snapped to device pixels and use it to construct the
rectangles for the cell edges, same as for collapsed borders. This is
especially important when border-spacing is set to 0 since it avoids
gaps between adjacent cells which have borders set.
2023-08-08 12:26:11 +02:00
Aliaksandr Kalenik
b89481564b LibWeb: Null check dom_node() in PaintableBox::scroll_offset() 2023-08-07 05:23:31 +02:00
Aliaksandr Kalenik
fee5b4deb6 LibWeb: Move set_scroll_offset() from Layout::Box to PaintableBox
Nodes in layout tree should not be aware of scroll state.
2023-08-07 05:23:31 +02:00
Aliaksandr Kalenik
5b7926fa53 LibWeb: Move scroll_offset() from Layout::Box to PaintableBox
Nodes in layout tree should not be aware of scroll state.
2023-08-07 05:23:31 +02:00
Aliaksandr Kalenik
23a07a8ab6 LibWeb: Introduce PaintableBox::scroll_by()
Moves code responsible for calculation of new scroll offset into
scroll_by() so it could be reused for JS functions that trigger
scroll.
2023-08-07 05:23:31 +02:00
Aliaksandr Kalenik
c7673605bb LibWeb: Move mouse wheel handling from Paintable to PaintableBox
It is only PaintableBox that can have scrollable overflow so it doesn't
make sense to have handle_mousewheel() implementation in Paintable.

Also new implementation of handle_mousewheel() takes in account overflow
limits from scrollable_overflow_rect().
2023-08-07 05:23:31 +02:00
Sam Atkins
73fa58da34 LibWeb: Implement the CSS outline-offset property
This allows you to push the outline a certain distance away from the
border (or inside it, if the offset is negative).
2023-08-03 05:25:48 +02:00
Sam Atkins
fe7e797483 LibWeb: Implement the CSS outline property :^)
...along with `outline-color`, `outline-style`, and `outline-width`.

This re-uses the existing border-painting code, which seems to work well
enough!

This replaces the previous code for drawing focus-outlines, with generic
outline painting for any elements that want it. Focus outlines are now
instead supported by this code in Default.css:

```css
:focus-visible {
    outline: auto;
}
```
2023-08-03 05:25:48 +02:00
Sam Atkins
8520afaa11 LibWeb: Rename PaintPhase::FocusOutline -> Outline
Any element can have an outline, whether because of focus or not.
2023-08-03 05:25:48 +02:00
Sam Atkins
5ee1b7db7c LibWeb: Convert BorderData::width to CSSPixels
The `clip_shrink` optimization in `paint_background()` now also
correctly uses DevicePixels, instead of reducing a DevicePixel rect by
a CSSPixels amount.
2023-07-30 22:18:26 +01:00
Andi Gallo
a7166eb103 LibWeb: Complete table border conflict resolution
Add the element type and grid position to the algorithm and change the
table borders painting to apply the new criteria to corners as well.
2023-07-25 15:21:04 +02:00
Aliaksandr Kalenik
bec07d4af7 LibWeb: Use fixed-point saturated arithmetics for CSSPixels
Using fixed-point saturated arithmetics for CSSPixels allows to avoid
accumulating floating-point errors.

This implementation is not complete yet: currently saturated
arithmetics implemented only for addition. But it is enough to not
regress any of layout tests we have :)

See https://github.com/SerenityOS/serenity/issues/18566
2023-07-25 11:52:02 +02:00
Andreas Kling
158caf1b91 LibWeb: Include scrollable overflow in the "absolute paint rect"
This finally fixes the issue where stacking contexts that have either a
transform or opacity != 1 would clip their descendants to the root of
the stacking context.
2023-07-13 05:09:08 +02:00
Aliaksandr Kalenik
b37fbcb159 LibWeb: Use PaintContext::would_be_fully_clipped_by_painter() everywhere
Always use `would_be_fully_clipped_by_painter` to check if painting can
be skipped.

This allows to quickly find all the places where this check happens and
also removes incosistency that before we checked for intersection with
viewport rect in some places and for intersection with painter clip
rect in other places.
2023-06-20 06:58:47 +02:00
MacDue
5f8b9f7936 LibWeb: Use enclosing (rather than rounded) rect for overflow clipping
If we use a rounded rect we'll clip off subpixels around the edge.
2023-06-19 21:19:08 +02:00
Andi Gallo
8090adf268 LibWeb: Add partial implementation of border conflict resolution
Fix handling of border style specified per column as well.
2023-06-10 11:17:21 +02:00
Andi Gallo
af1798dd04 LibWeb: Add support for inset shadows
Also move code for outer shadows to a helper.
2023-06-07 10:14:21 +02:00
Simon Wanner
ee7282cbe4 LibWeb: Make pseudo-elements inspectable
This makes it possible to set a pseudo-element as the inspected node
using Document::set_inspected_node(), Document then provides
inspected_layout_node() for the painting related functions.
2023-06-03 05:54:49 +02:00
Andreas Kling
b7d2f6fa88 LibWeb: Clip overflow in descendant boxes for non-visible CSS overflow
We were only clipping for hidden, when we should be clipping for hidden,
clip, scroll and auto. Basically everything but visible. :^)
2023-06-01 13:33:35 +02:00