Skip to content

2. API reference

Anton Kosykh edited this page Jan 11, 2018 · 6 revisions

Tweening preferences

import NanoTween from 'nanotween'
import { linear } from 'nanotween/easings'

const tween = NanoTween()
  .duration(10000)    // duration (in ms)
  .repeat(5)          // Repeats count (default - 0. You can pass Infinity for infinite loop)
  .easing(linear)     // Easing function (default - linear. For more info - see "2. Easings")
  .reverse()          // Reverse animation (calling twice returns to normal direction)

Control methods

NanoTween tweening mechanics are simple:

  • progress is a value from 0 to 1
  • Each NanoTween.update() increases progress value by timePassed / tweenDuration (time diff is calculated by nanouptime)
  • Then easing function is applied to progress
  • Result value is emited in update event.
tween.start()        // Start tweening (begins from 0)
tween.stop()         // Stop tweening and go to the end 
tween.play()         // Play tweening from current progress
tween.pause()        // Pause tweening on current progress
tween.reverse()      // Reverse animation direction. Progress always goes 0->1 even if tween is reversed
tween.set(progress)  // Sets progresss (float number from 0 to 1)
tween.complete()     // Complete one tweening step (if it's repeating - it will continue from the next step)

Extension methods

tween.convert(cb)   // Applies callback to progress before emiting update event. Can be stacked
tween.use(enhancer) // Calls enhancer with tween instance. Use it for plugins or reusable tweens

Events

Usage

Events are provided by nanoevents

tween.on(eventName, cb)

Arguments

  • eventName - name of needed event
  • cb - function that will be called with arguments from event You can also add several handlers to the single event

start

Whenever tween.start() is called

Arguments
  • None

stop

Whenever tween.stop() is called

Arguments

  • None

play

Whenever tween.play() is called

Arguments

  • meta object with meta info
    • value - current value
    • remaining - repeats count remaining
    • completed - how many iterations are completed

pause

Whenever tween.pause() is called

Arguments

  • meta object with meta info
    • value - current value
    • remaining - repeats count remaining
    • completed - how many iterations are completed

update

  • On .set(progress) call
  • On NanoTween.update() call if tween is running (because it calls .set(progress))
  • On .start() (such as .set(0)) and stop (such as .set(1)) call
  • On .complete() call or when tween is finished (because it calls .set(1) and then .set(0))

Arguments

  • progress - progress of tween with applied converters (if no converters - returns number from 0 to 1)

step

Whenever one iteration of repeating tween is completed

Arguments

  • meta object with meta info
    • value - current value
    • remaining - repeats count remaining
    • completed - how many iterations are completed

complete

Whenever tween is completed

Arguments

  • None

Clone this wiki locally