Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-07-23 15:23:42 +01:00
Code Issues Projects Releases Packages Wiki Activity

animations: Don't convert linear easing to a bezier

Browse source 
This conversion can lead to floating point errors and extra work when
computing animations. Avoiding it allows animation-iteration-count-009.html
to pass.
This commit is contained in:
Martin Robinson 2020-06-24 16:19:36 +02:00
parent 954b5177f0
commit cf4510011f
2 changed files with 11 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

14
components/style/animation.rs
View file

@ -27,7 +27,9 @@ use crate::stylesheets::keyframes_rule::{KeyframesAnimation, KeyframesStep, Keyf
use crate::values::animated::{Animate, Procedure};
use crate::values::computed::{Time, TimingFunction};
use crate::values::generics::box_::AnimationIterationCount;
use crate::values::generics::easing::{StepPosition, TimingFunction as GenericTimingFunction};
use crate::values::generics::easing::{
StepPosition, TimingFunction as GenericTimingFunction, TimingKeyword,
};
use crate::Atom;
use fxhash::FxHashMap;
use parking_lot::RwLock;
@ -125,8 +127,14 @@ impl PropertyAnimation {
(current_step as f64) / (jumps as f64)
},
GenericTimingFunction::Keyword(keyword) => {
let (x1, x2, y1, y2) = keyword.to_bezier();
Bezier::new(x1, x2, y1, y2).solve(progress, epsilon)
let bezier = match keyword {
TimingKeyword::Linear => return progress,
TimingKeyword::Ease => Bezier::new(0.25, 0.1, 0.25, 1.),
TimingKeyword::EaseIn => Bezier::new(0.42, 0., 1., 1.),
TimingKeyword::EaseOut => Bezier::new(0., 0., 0.58, 1.),
TimingKeyword::EaseInOut => Bezier::new(0.42, 0., 0.58, 1.),
};
bezier.solve(progress, epsilon)
},
}
}

16
components/style/values/generics/easing.rs
View file

@ -6,7 +6,6 @@
//! https://drafts.csswg.org/css-easing/#timing-functions
use crate::parser::ParserContext;
use crate::values::CSSFloat;
/// A generic easing function.
#[derive(
@ -118,18 +117,3 @@ impl<Integer, Number> TimingFunction<Integer, Number> {
TimingFunction::Keyword(TimingKeyword::Ease)
}
}
impl TimingKeyword {
/// Returns the keyword as a quadruplet of Bezier point coordinates
/// `(x1, y1, x2, y2)`.
#[inline]
pub fn to_bezier(self) -> (CSSFloat, CSSFloat, CSSFloat, CSSFloat) {
match self {
TimingKeyword::Linear => (0., 0., 1., 1.),
TimingKeyword::Ease => (0.25, 0.1, 0.25, 1.),
TimingKeyword::EaseIn => (0.42, 0., 1., 1.),
TimingKeyword::EaseOut => (0., 0., 0.58, 1.),
TimingKeyword::EaseInOut => (0.42, 0., 0.58, 1.),
}
}
}