Commit graph

2137 commits

Author SHA1 Message Date
Matthew Olsson
0487485fb1 LibWeb: Limit length values to 5 decimal places when serializing 2024-03-03 19:50:25 +01:00
Matthew Olsson
7dcf060927 LibWeb: Limit ratio parts to 5 decimal places when printing
Printing 15 or so decimal places for each value is a bit excessive
2024-03-03 19:50:25 +01:00
Matthew Olsson
4d9f2bf5f1 LibWeb: Add interpolation for ratio values 2024-03-03 19:50:25 +01:00
Matthew Olsson
f02cd4d0b0 LibWeb: Add a spec comment for color interpolation 2024-03-03 19:50:25 +01:00
Matthew Olsson
1f88ca2a03 LibWeb: Remove transform interpolation optimization
The property values here will always be StyleValueLists and not
TransformationStyleValues. The handling of interpolation in this case
gets quite a bit more complex, so let's just remove the dead code for
now and attempt this optimization again in the future if it's needed.
2024-03-03 19:50:25 +01:00
Aliaksandr Kalenik
ee1d8a534d LibWeb: Remove wrappers for gradient painting command recording
These were adding unnecessary indirection, whereas recording painter
could be called directly.
2024-03-03 18:19:20 +01:00
Zac Brannelly
9165faca5e LibWeb: Support CSS property background-clip: text
From https://drafts.csswg.org/css-backgrounds-4/#background-clip
"The background is painted within (clipped to) the intersection of the
border box and the geometry of the text in the element and its in-flow
and floated descendants"

This change implements it in the following way:
1. Traverse the descendants of the element, collecting the Gfx::Path of
   glyphs into a vector.
2. The vector of collected paths is saved in the background painting
   command.
3. The painting commands executor uses the list of glyphs to paint a
   mask for background clipping.

Co-authored-by: Aliaksandr Kalenik <kalenik.aliaksandr@gmail.com>
2024-03-03 15:33:12 +01:00
Zac Brannelly
4a3680cafc LibWeb/CSS: Add "text" into list of possible "background-box" values 2024-03-03 15:33:12 +01:00
Matthew Olsson
c1ab6ca6b4 LibWeb: Do not invalidate elements with animations in the CSS cascade
See the note added to Animation::cancel for more info
2024-03-02 19:58:12 +01:00
Matthew Olsson
ec766e8669 LibWeb: Correctly set @keyframe rule's effect target 2024-03-02 15:36:48 +01:00
Andreas Kling
d8e8293b7e LibWeb: Add PercentageOr<Length>::to_px() fast path for absolute lengths
We can avoid round-tripping through a temporary Length in the simple
case here.
2024-03-02 13:00:09 +01:00
Andreas Kling
b66033720a LibWeb: Let Length::to_px(Layout::Node) be inline for absolute lengths 2024-03-02 13:00:09 +01:00
Matthew Olsson
6d0672eec0 LibWeb: Implement complex transform interpolation
With this commit, we can interpolate between transforms whose functions
don't match. For example:
    translate(100px) -> scale(2) translateX(50px)
2024-03-02 12:25:53 +01:00
Matthew Olsson
892f407d75 LibWeb: Do not abort interpolation if the StyleValue types differ
This can be perfectly valid, and depends on the property being animated.
For example, interpolating between the StyleValue "none" (an identifier)
and a TransformationStyleValue is perfectly defined.
2024-03-02 12:25:53 +01:00
Matthew Olsson
15942b4262 LibWeb: Revert changing transform's animation-type to by-computed-value
In the upcoming commits where we properly handle transformation
interpolation, it actually becomes easier to change this back to custom,
so lets do that since its more correct anyways.
2024-03-02 12:25:53 +01:00
Tim Ledbetter
4646a87eba LibWeb: Make CSSConditionRule.conditionText read-only
Previously @media rule conditions could be updated by assigning to
`conditionText`. This change aligns our implementation with the CSSOM
specification, which says `CSSConditionRule.conditionText` should be
read-only.
2024-02-28 22:14:58 +01:00
Aliaksandr Kalenik
8d9e20cb03 LibWeb: Parse the CSS scrollbar-width property 2024-02-28 07:51:13 -05:00
Matthew Olsson
aca32e298d LibWeb: Expand shorthand properties in CSS @keyframes 2024-02-28 08:05:41 +00:00
Aliaksandr Kalenik
a0dc9584de LibWeb: Add "object-position" CSS property into ComputedValues 2024-02-27 16:53:13 +01:00
Aliaksandr Kalenik
677a00ed92 LibWeb: Add "object-fit" CSS property into ComputedValues 2024-02-27 16:53:13 +01:00
Timothy Flynn
435c2c24d1 LibWeb: Create a shadow tree for <input type=file> elements
This creates a button to prompt users to select a file, and a label to
show information about the selected file(s). Clicking either shadow
element will activate the input element.
2024-02-26 14:18:49 +01:00
Matthew Olsson
0f54d797d2 LibWeb: Handle pre-existing animations when considering animation-name
If a DOM::Element has an animation-name property, then in addition to
remembering where it came from, it will also remember the
Animations::Animation object that was created for it. This allows
StyleComputer to cancel that animation if the animation-name property
changes as well as to apply any changes required (for example, if
animation-play-state changes from "running" to "paused", it needs to
call .pause() on the animation).
2024-02-25 21:12:42 +00:00
Matthew Olsson
b235620315 LibWeb: Pause keyframe animations during creation when necessary 2024-02-25 21:12:42 +00:00
Matthew Olsson
2ee022dead LibWeb: Set KeyframeEffect's pseudo-element if applicable 2024-02-25 21:12:42 +00:00
Shannon Booth
9ce8189f21 Everywhere: Use unqualified AK::URL
Now possible in LibWeb now that there is no longer a Web::URL.
2024-02-25 08:54:31 +01:00
Matthew Olsson
b33bb0997a LibWeb: Move easing parsing code out into a dedicated function
This will be used outside of StyleComputer
2024-02-25 08:51:50 +01:00
Matthew Olsson
c8b9c137a1 LibWeb: Handle discrete properties
This also changes transform's animation-type to by-computed-value. It is
far easier to handle since we switch on StyleValue::type(), and it might
be the case that this applies to all custom animated properties and we
don't need "custom" at all, but let's wait until we get to those
properties to make that decision.
2024-02-25 08:51:50 +01:00
Matthew Olsson
9e0ff9c140 LibWeb: Expose CSS shorthand -> longhand conversion
This conversion needs to be done by KeyframEffect as well
2024-02-25 08:51:50 +01:00
Matthew Olsson
af1f0c673e LibWeb: Remove old animation-direction handling from StyleComputer
This is now handled by Web Animations, so if the animation was ever
running backwards, this logic would re-reverse it so that it played
forwards again.
2024-02-25 08:51:50 +01:00
Matthew Olsson
70ded2ef42 LibGfx: Add Oklab support to Gfx::Color
Interpolation of color on the web is done via the oklab colorspace
2024-02-25 08:51:50 +01:00
Tim Ledbetter
1d825f17c0 LibWeb: Remove first rule if no argument is given for remove_rule()
While this isn't explicitly mentioned in the specification, there is a
WPT test that checks for this behavior.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
3ea318ca8b LibWeb: Implement CSSStyleSheet.addRule()
This is a legacy method that has been superseded by `insertRule()`,
although it is supported by all modern browser engines.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
87b52a1816 LibWeb: Implement CSSStyleSheet.replaceSync()
This method behaves the same as `CSSStyleSheet.replace()` but the
operation is performed synchronously.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
81c67d34eb LibWeb: Implement CSSStyleSheet.replace()
This method asynchronously replaces the content of the given stylesheet
with the content passed to it.

An exception is thrown if this method is used by a stylesheet not
created with the `CSSStyleSheet()` constructor.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
d209d5a84f LibWeb: Ensure CSSStyleSheet::css_rules() always returns the same object
Instead of having a method that replaces the stylesheet's CSSRuleList,
we now have a method on CSSRuleList to modify it's underlying CSSRules.
2024-02-24 21:59:28 +01:00
Tim Ledbetter
811033ec19 LibWeb: Disallow inserting @import rules into a constructed stylesheet 2024-02-24 21:59:28 +01:00
Tim Ledbetter
b0f57a2785 LibWeb: Add CSSStyleSheet constructor binding 2024-02-24 21:59:28 +01:00
Tim Ledbetter
f303905875 LibWeb: Add the CSSStyleSheet.rules alias for CSSStyleSheet.cssRules 2024-02-24 21:59:28 +01:00
Tim Ledbetter
9b1ea4e2fc LibWeb: Add CSSStyleSheet.ownerRule attribute
This returns the `CSSImportRule` corresponding to the `@import` at-rule
that imported the stylesheet into the document. If the stylesheet
wasn't imported then this property is null.
2024-02-24 21:59:28 +01:00
Matthew Olsson
4e27d07ff2 LibWeb: Use initial value for animation start if it does not exist
This fixes an issue where a property could not be animated unless the
element had a specified value for that property somewhere in its
styling.
2024-02-23 20:52:37 +01:00
Matthew Olsson
ae3326a447 LibWeb: Transition StyleComputer to Web Animations
With this commit, we are finally running animations off of the web
animations spec! A lot of the work StyleComputer is doing is now done
elsewhere. For example, fill-forward animations are handled by
Animation::is_relevant() returning true in the after phase, meaning the
"active_state_if_fill_forward" map is no longer needed.
2024-02-23 20:52:37 +01:00
Matthew Olsson
ceb9d0f8dc LibWeb: Record position of Animations in global animation list
"position of an Animation in the global animation list" is a fancy way
of saying "which animation object was created first"
2024-02-21 19:52:35 +01:00
Matthew Olsson
c3b689488e LibWeb: Implement animation class-specific composite order
This is a part of determining the composite order of two animations
2024-02-21 19:52:35 +01:00
Tim Ledbetter
c5d1ec4dea LibWeb/CSS: Ensure length is absolute before converting to pixels
Previously, creating a DOMMatrix with a transform that contained
non-absolute units would cause a crash.
2024-02-21 19:38:17 +01:00
Nico Weber
24a469f521 Everywhere: Prefer {:#x} over 0x{:x} in format strings
The former automatically adapts the prefix to binary and octal
output, and is what we already use in the majority of cases.

Patch generated by:

    rg -l '0x\{' | xargs sed -i '' -e 's/0x{:/{:#/'

I ran it 4 times (until it stopped changing things) since each
invocation only converted one instance per line.

No behavior change.
2024-02-21 17:54:38 +01:00
Timothy Flynn
debb5690ce LibWeb: Begin implementing the HTMLInputElement 'image' type state
This implements enough to represent <input type=image> with its loaded
source image (or fallback to its alt text, if applicable). This does not
implement acquring coordinates from user-activated click events on the
image.
2024-02-19 11:07:30 +01:00
Tim Ledbetter
ea9bc8ed6b LibWeb: Set cursor: default for button and select elements
This prevents an IBeam cursor being shown when these elements are
moused over.
2024-02-18 15:44:49 -05:00
Matthew Olsson
faaf5b9652 LibWeb: Add the AnimationEvent IDL objects 2024-02-16 12:02:11 -07:00
Matthew Olsson
3a87c000c4 LibWeb: Add the CSSAnimation IDL object 2024-02-16 12:02:11 -07:00
Matthew Olsson
212a139292 LibWeb: Add a way to test if a CSS::PropertyID is animatable 2024-02-13 19:44:44 +01:00