Skip to content
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 19 additions & 20 deletions packages/@react-stately/virtualizer/src/tween.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,47 +16,46 @@ import {Point} from './Point';
let perf = typeof window !== 'undefined' ? window.performance : null;
// @ts-ignore
let perfNow = perf && (perf.now || perf.webkitNow || perf.msNow || perf.mozNow);
let getTime = perfNow ? perfNow.bind(perf) : function () {
return Date.now ? Date.now() : new Date().getTime();
};

// check if we need to get the time each frame (see below)
let fixTs = false;
requestAnimationFrame(function (t) {
fixTs = (t > 1e12) !== (getTime() > 1e12);
});
let getTime = perfNow
? perfNow.bind(perf)
: function () {
return Date.now ? Date.now() : new Date().getTime();
};

export interface CancelablePromise<T> extends Promise<T> {
cancel(): void
}

export function tween(begin, end, duration, ease, fn): CancelablePromise<void> {
let canceled = false;
let raf_id;
let raf_id: number = 0;

let promise = new Promise(resolve => {
let start = getTime();
let diffX = end.x - begin.x;
let diffY = end.y - begin.y;
const promise = new Promise((resolve) => {
const start = getTime();
const diffX = end.x - begin.x;
const diffY = end.y - begin.y;

raf_id = requestAnimationFrame(function run(t) {
const fixTs = t > 1e12 !== getTime() > 1e12;
// if we're using a high res timer, make sure timestamp is not the old epoch-based value.
// http://updates.html5rocks.com/2012/05/requestAnimationFrame-API-now-with-sub-millisecond-precision
if (fixTs) {
t = getTime();
}

// check if we're done
let delta = t - start;
const delta = t - start;
if (delta > duration) {
fn(end);
resolve();
} else {
// call frame callback after computing eased time and get the next frame
let proceed = fn(new Point(
begin.x + diffX * ease(delta / duration),
begin.y + diffY * ease(delta / duration)
));
const proceed = fn(
new Point(
begin.x + diffX * ease(delta / duration),
begin.y + diffY * ease(delta / duration)
)
);
if (proceed !== false && !canceled) {
raf_id = requestAnimationFrame(run);
}
Expand All @@ -78,5 +77,5 @@ export function linearEasing(t) {
}

export function easeOut(t) {
return Math.sin(t * Math.PI / 2);
return Math.sin((t * Math.PI) / 2);
}