@internet/spring NPM

:wavy_dash: Spring

:books: Documentation | :tada: Example | :globe_with_meridians: Internet modules

Framerate-independant spring physics
Small, < 1kb gzipped
Control the spring with tension and friction
Adjustable timestep for the physics solver
onStart / onStop callbacks
This lib was made to learn more about fixed timesteps and integration.
- It's a pretty basic Euler integration - not sure it will work for complex structures like spring chaining.
- If you need a rock-solid spring physics library, use ReboundJS
Articles used :

Requirements

ES6 Modules support
- Using a module bundler like Webpack, Rollup or Parcel
- Native support from browser
- From NodeJS with esm

API

Spring
- new Spring([options])
- Methods
- Properties
  - .initial : number
  - .value : number
  - .previous : number
  - .velocity : number
  - .onStart : function
  - .onStop : function

new Spring(options)

Create a new Spring instance.

Param	Type	Default	Description
options	Object	{}	Spring options.
options.initial	number	0	Initial value / targetValue of your spring.
options.tension	number	0.1	Tension/Stifness of your spring.
options.friction	number	0.2	From 0 to 1. Friction (Damping) of your spring.
options.step	number	10	Timestep of the physics solver (in ms). Step > 16.67ms will give you pretty bad results.
options.onStart	function		`onStart` will be called when the spring starts moving.
options.onStop	function		`onStop` will be called when your the spring stops moving.
options.precisionStop	number	0.0001	Minimum distance between `value` and `target` to consider the spring stopped.
options.perfectStop	boolean	false	Define if `value` is set precisely to targetValue when the spring stops moving.

Example

import { raf } from '@internet/raf'
import Spring from '@internet/spring'

const move = new Spring({ initial: 0 })
move.setTarget(300)
raf.add(dt => {
  move.update(dt)
  console.log(move.value)
})