avocado-old/packages/timing/transition/index.js
2019-04-28 23:45:03 -05:00

40 lines
1.1 KiB
JavaScript

// **Transition** is a **Mixin** which lends the ability to handle timed
// transitions of arbitrary property methods residing on the mixed-in object.
//
// You can use this mixin like this:
//
// @Transition
// class YourClass {
// constructor() {
// this.x = 0;
// }
// get x() {
// return this.x;
// }
// set x(x) {
// this.x = x;
// }
// }
//
// const yourObject = new YourClass();
// yourObject.transition({x: 100}, 2000, 'easeOutQuad');
//
// The value of yourObject.x will transition towards 100 over the course of
// 2000 milliseconds. ***NOTE:*** yourObject **must** have a getter and a
// setter for "x" defined.
//
// This function was heavily inspired by the existence of
// [jQuery.animate](http://api.jquery.com/animate/), though the API is ***NOT***
// compatible.
import TransitionResult from './result';
export {TransitionResult};
export function TransitionMixin(Superclass) {
return class Transition extends Superclass {
transition(props, duration, easing) {
return new TransitionResult(this, props, duration, easing);
}
};
}