assistant panel: Animate assistant label if message is pending (#16152)

This adds a pulsating effect to the assistant header in case the message
is pending.

The pulsating effect is capped between 0.2 and 1.0 and I tried (with the
help of Claude) to give it a "breathing" effect, since I found the
normal bounce a bit too much.

Also opted for setting the `alpha` on the `LabelLike` things, vs.
overwriting the color, since I think that's cleaner instead of exposing
the color and mutating that.


https://github.com/user-attachments/assets/4a94a1c5-8dc7-4c40-b30f-d92d112db7b5


Release Notes:

- N/A
This commit is contained in:
Thorsten Ball 2024-08-13 11:41:44 +02:00 committed by GitHub
parent b36d1386a9
commit af36d4934c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 98 additions and 10 deletions

View file

@ -170,6 +170,8 @@ impl<E: IntoElement + 'static> Element for AnimationElement<E> {
}
mod easing {
use std::f32::consts::PI;
/// The linear easing function, or delta itself
pub fn linear(delta: f32) -> f32 {
delta
@ -200,4 +202,20 @@ mod easing {
}
}
}
/// A custom easing function for pulsating alpha that slows down as it approaches 0.1
pub fn pulsating_between(min: f32, max: f32) -> impl Fn(f32) -> f32 {
let range = max - min;
move |delta| {
// Use a combination of sine and cubic functions for a more natural breathing rhythm
let t = (delta * 2.0 * PI).sin();
let breath = (t * t * t + t) / 2.0;
// Map the breath to our desired alpha range
let normalized_alpha = (breath + 1.0) / 2.0;
min + (normalized_alpha * range)
}
}
}