I'm not screwing you, this is really small library for simple animations. Inspired by Tweenjs and animejs.
npm i --save @disorrder/screw
yarn add @disorrder/screw
With these instructions you won't screw up:
import Screw, { easing } from '@disorrder/screw';
const entity = {
visible: false,
position: { x: 10, y: 10, z: 0 },
rotation: { x: 0, y: 0, z: 0 },
_scale: { x: 1, y: 1 },
getScale() { return this.scale; }
setScale(value) { this._scale = value; }
};
const animation = new Screw()
.add({ // a keyframe
duration: 1000, // by default
easing: easing.QuadraticInOut, // by default
animate: [
{
target: entity.position, // pick a target
to: { x: 20 } // and set new value
},
{ // one more simultaneous action
target: entity.rotation,
by: { x: 2 * Math.PI } // set relative shift instead of exact value
}
],
onBegin() {
// run some code before keyframe start
entity.visible = true;
}
})
.add({
delay: 500, // next keyframe will start after 500 ms after previous end
duration: 500,
animate: [{
target() { return entity.getScale() },
to: { x: 0, y: 0 }
}],
onUpdate(frame) {
// Calls every animation update
const scale = frame.animate[0]._target;
entity.setScale(scale);
},
onComplete() {
entity.visible = false;
}
})
.play(); // Don't forget to start animation
soon or later
soon
later
never?
yarn test
- add commit for please-release
git commit --allow-empty -m "chore: release 2.0.0" -m "Release-As: 2.0.0"
yarn release
(userelease:minor
or-- release-as major
if necessary, default is patch version)- follow next instructions in console (Run
git push --follow-tags origin master && npm publish
to publish)