Fatina Helpers

Small & Light tweening library for Games / Web

• Website: Here
• API: Here
• Samples: Here

Description

This plugin is just a set of helpers to provide a better integration of Fatina with javascript games library (pixi, phaser, ...)

This plugin requires Fatina : Here

Getting Started

Install

If you use directly the minified version

<script src="fatina-plugin-helpers.min.js"></script>

Or if you use NPM

> npm install fatina-plugin-helpers

Init

// standard node.js require
var FatinaHelpers = require('fatina-plugin-helpers');
// OR
// standard import with typescript (typed version)
import * as FatinaHelpers from 'fatina-plugin-helpers';

and initialize (add this plugin to Fatina)

Fatina.init();
Fatina.loadPlugin(FatinaHelpers.get());

Usage

You can now populate any kind of object with the following method (container, sprites, camera, ...)

Fatina.plugin.addHelpers(myObject);

Methods

Here are the helpers automatically added:

Position

Following methods use .position.x and .position.y

• myObject.moveTo(x, y, duration) : Move to an absolute position
• myObject.moveXTo(x, duration)
• myObject.moveYTo(y, duration)
• myObject.moveToRel(x, y, duration) : Move to a relative position
• myObject.moveXToRel(x, duration)
• myObject.moveYToRel(y, duration)
• myObject.punchPosition(x, y, duration, iteration) : Oscillate around the current position
• myObject.shake(x, y, duration, iteration) : Shake around the current position

Rotation

Following methods use .rotation

• myObject.rotateTo(angle, duration) : Rotate to a specific angle in radiant (to PI/2)
• myObject.rotateToRel(angle, duration) : Rotate by a relative radiant angle (+PI/2)
• myObject.rotateDegTo(angle, duration) : Rotate to a specific angle in degrees (to 90°)
• myObject.rotateDegToRel(angle, duration) : Rotate to a specific angle in degrees (+90°)
• myObject.punchRotate(angle, duration, iteration)

Alpha

Following method use .alpha

• myObject.fadeTo(alpha, duration) : Alpha is a float between 0 and 1 (1: fadeIn, 0: fadeOut)

Scale

Following methods use .scale.x and .scale.y

• myObject.scaleTo(x, y, duration) : Scale to a specified value
• myObject.scaleXTo(x, duration)
• myObject.scaleYTo(y, duration)
• myObject.scaleToRel(x, y, duration)
• myObject.scaleXToRel(x, duration)
• myObject.scaleYToRel(y, duration)
• myObject.punchScale(x, y, duration, iteration)

Color / Tint

Following methods use .tint or .hue (the color API are slightly different between libs)

• myObject.colorTo(r, g, b, duration) : R,G,B are float between 0-1
• myObject.colorToRel(r, g, b, duration)
• myObject.colorRGBTo(hex, duration) : hex is a string representation '#FFFFFF'
• myObject.colorRGBToRel(hex, duration)
• myObject.punchColor(r, g, b, duration, iteration)