sprotty
Version:
A next-gen framework for graphical views
99 lines • 3.68 kB
JavaScript
"use strict";
/********************************************************************************
* Copyright (c) 2017-2018 TypeFox and others.
*
* This program and the accompanying materials are made available under the
* terms of the Eclipse Public License v. 2.0 which is available at
* http://www.eclipse.org/legal/epl-2.0.
*
* This Source Code may also be made available under the following Secondary
* Licenses when the conditions for such availability set forth in the Eclipse
* Public License v. 2.0 are satisfied: GNU General Public License, version 2
* with the GNU Classpath Exception which is available at
* https://www.gnu.org/software/classpath/license.html.
*
* SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0
********************************************************************************/
Object.defineProperty(exports, "__esModule", { value: true });
exports.CompoundAnimation = exports.Animation = void 0;
const easing_1 = require("./easing");
/**
* An animation uses the rendering loop of the browser to smoothly
* calculate a transition between two states of a model element.
*/
class Animation {
constructor(context, ease = easing_1.easeInOut) {
this.context = context;
this.ease = ease;
this.stopped = false;
}
start() {
// in case start() is called multiple times, we need to reset the stopped flag
this.stopped = false;
return new Promise((resolve, reject) => {
let start = undefined;
let frames = 0;
const lambda = (time) => {
frames++;
let dtime;
if (start === undefined) {
start = time;
dtime = 0;
}
else {
dtime = time - start;
}
const t = Math.min(1, dtime / this.context.duration);
const current = this.tween(this.ease(t), this.context);
this.context.modelChanged.update(current);
if (t === 1) {
this.context.logger.log(this, (frames * 1000 / this.context.duration) + ' fps');
resolve(current);
}
else if (this.stopped) {
this.context.logger.log(this, 'Animation stopped at ' + (t * 100) + '%');
resolve(current);
}
else {
this.context.syncer.onNextFrame(lambda);
}
};
if (this.context.syncer.isAvailable()) {
this.context.syncer.onNextFrame(lambda);
}
else {
const finalModel = this.tween(1, this.context);
resolve(finalModel);
}
});
}
/**
* Stop the animation at the current state.
* The promise returned by start() will be resolved with the current state after the next tweening step.
*/
stop() {
this.stopped = true;
}
}
exports.Animation = Animation;
class CompoundAnimation extends Animation {
constructor(model, context, components = [], ease = easing_1.easeInOut) {
super(context, ease);
this.model = model;
this.context = context;
this.components = components;
this.ease = ease;
}
include(animation) {
this.components.push(animation);
return this;
}
tween(t, context) {
for (const a of this.components) {
a.tween(t, context);
}
return this.model;
}
}
exports.CompoundAnimation = CompoundAnimation;
//# sourceMappingURL=animation.js.map