mirror of
https://github.com/gosticks/DefinitelyTyped.git
synced 2025-10-16 12:05:41 +00:00
KeyFrame type for onsample, added remove().
Added test for onsample and addEventListener. Corrected type for AnimationKeyFrame, array [0, "1"] is allowed.
This commit is contained in:
parent
d2d933019a
commit
b223e64754
10
types/web-animations-js/index.d.ts
vendored
10
types/web-animations-js/index.d.ts
vendored
@ -24,7 +24,7 @@ declare class AnimationPlaybackEvent {
|
||||
interface AnimationKeyFrame {
|
||||
easing?: string;
|
||||
offset?: number;
|
||||
[key: string]: string | string[] | number | number[] | undefined;
|
||||
[key: string]: string | number | [string | number, string | number] | undefined;
|
||||
}
|
||||
|
||||
interface AnimationTimeline {
|
||||
@ -46,15 +46,17 @@ interface AnimationEffectTiming {
|
||||
declare class KeyframeEffect {
|
||||
constructor(target: HTMLElement, effect: AnimationKeyFrame | AnimationKeyFrame[], timing: number | AnimationEffectTiming, id?: string);
|
||||
activeDuration: number;
|
||||
onsample: any;
|
||||
parent: any;
|
||||
target: any;
|
||||
onsample: (timeFraction: number | null, effect: KeyframeEffect, animation: Animation) => void | undefined;
|
||||
parent: KeyframeEffect | null;
|
||||
target: HTMLElement;
|
||||
timing: AnimationEffectTiming;
|
||||
getFrames(): AnimationKeyFrame[];
|
||||
remove(): void;
|
||||
}
|
||||
interface AnimationEventListener {
|
||||
(evt: AnimationPlaybackEvent): void;
|
||||
}
|
||||
|
||||
declare class Animation {
|
||||
constructor(effect: KeyframeEffect, timeline?: AnimationTimeline);
|
||||
currentTime: number;
|
||||
|
||||
@ -94,3 +94,28 @@ function test_whiteRabbit() {
|
||||
|
||||
|
||||
}
|
||||
// Testing onsample
|
||||
// https://github.com/web-animations/web-animations-js/releases
|
||||
function test_onsample_And_addEventListener() {
|
||||
var elem = document.createElement("div");
|
||||
if (elem) {
|
||||
elem.style.width = '150px';
|
||||
elem.style.color = 'black';
|
||||
elem.textContent = "HELLO";
|
||||
document.body.appendChild(elem);
|
||||
let myEffect = new KeyframeEffect(elem, [], 1000);
|
||||
myEffect.onsample = (timeFraction, effect, animation) => {
|
||||
console.log("fraction", timeFraction);
|
||||
// After finish event, timeFraction is null
|
||||
if (timeFraction) {
|
||||
effect.target.style.opacity = timeFraction.toFixed(2);
|
||||
}
|
||||
};
|
||||
// onsample is write only
|
||||
console.log(myEffect.onsample); // => undefined
|
||||
var myAnimation = document.timeline.play(myEffect);
|
||||
myAnimation.addEventListener("finish", (e) => {
|
||||
console.log("finished", e);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user