RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-30 23:28:12 +00:00
Code Issues Activity Actions

LibWeb: Allow auto as animation-duration and make that the default

Browse source 
This is a spec change: 2a7cc4b58f
This commit is contained in:
Sam Atkins 2023-06-09 14:25:32 +01:00 • committed by Andreas Kling
parent c4c35ce9b9
commit 7a2c8d30b9
3 changed files with 19 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

5
Userland/Libraries/LibWeb/CSS/Properties.json
View file

@ -67,9 +67,12 @@
"animation-duration": {
"affects-layout": true,
"inherited": false,
"initial": "0s",
"initial": "auto",
"valid-types": [
"time [0,∞]"
],
"valid-identifiers": [
"auto"
]
},
"animation-fill-mode": {

18
Userland/Libraries/LibWeb/CSS/StyleComputer.cpp
View file

@ -1090,7 +1090,11 @@ StyleComputer::AnimationStepTransition StyleComputer::Animation::step(CSS::Time
remaining_delay = CSS::Time { 0, CSS::Time::Type::Ms };
time_step_ms -= delay_ms;
auto added_progress = time_step_ms / duration.to_milliseconds();
// "auto": For time-driven animations, equivalent to 0s.
// https://www.w3.org/TR/2023/WD-css-animations-2-20230602/#valdef-animation-duration-auto
auto used_duration = duration.value_or(CSS::Time { 0, CSS::Time::Type::S });
auto added_progress = time_step_ms / used_duration.to_milliseconds();
auto new_progress = progress.as_fraction() + added_progress;
auto changed_iteration = false;
if (new_progress >= 1) {
@ -1498,9 +1502,15 @@ ErrorOr<void> StyleComputer::compute_cascaded_values(StyleProperties& style, DOM
auto active_animation = m_active_animations.get(animation_key);
if (!active_animation.has_value()) {
// New animation!
CSS::Time duration { 0, CSS::Time::Type::S };
if (auto duration_value = style.maybe_null_property(PropertyID::AnimationDuration); duration_value && duration_value->is_time())
duration = duration_value->as_time().time();
Optional<CSS::Time> duration;
if (auto duration_value = style.maybe_null_property(PropertyID::AnimationDuration); duration_value) {
if (duration_value->is_time()) {
duration = duration_value->as_time().time();
} else if (duration_value->is_identifier() && duration_value->as_identifier().id() == ValueID::Auto) {
// We use empty optional to represent "auto".
duration = {};
}
}
CSS::Time delay { 0, CSS::Time::Type::S };
if (auto delay_value = style.maybe_null_property(PropertyID::AnimationDelay); delay_value && delay_value->is_time())

2
Userland/Libraries/LibWeb/CSS/StyleComputer.h
View file

@ -199,7 +199,7 @@ private:
struct Animation {
String name;
CSS::Time duration;
Optional<CSS::Time> duration; // "auto" if not set.
CSS::Time delay;
Optional<size_t> iteration_count; // Infinite if not set.
CSS::AnimationDirection direction;