redshift/src/defaults/value-props.js

A JavaScript UX framework. Handles animation, UI physics and user input tracking.

module.exports = {
    // [number]: Current target value
    to: undefined,

    // [number]: Maximum permitted value during .track and .run
    min: undefined,
    
    // [number]: Minimum permitted value during .track and .run
    max: undefined,
    
    // [number]: Origin
    origin: 0,
    
    // [boolean]: Set to true when both min and max detected
    hasRange: false,

    // [boolean]: Round output if true
    round: false,
    
    // [string]: Route
    route: 'values',
    
    // [string]: Non-namespaced output value
    name: '',
    
    // [string]: Unit string to append to value on ourput
    unit: undefined,
    
    parent: '',
    
    unitName: '',

    /*
        Link properties
    */

    // [string]: Name of value to listen to
    link: undefined,
    
    // [array]: Linear range of values (eg [-100, -50, 50, 100]) of linked value to map to .mapTo
    mapLink: undefined,
    
    // [array]: Non-linear range of values (eg [0, 1, 1, 0]) to map to .mapLink - here the linked value being 75 would result in a value of 0.5
    mapTo: undefined,
    
	// [number]: Factor of input movement to direct output
	amp: 1,


    /*
        .run() properties
    */

    // [string]: Simulation to .run
    simulate: 'velocity',
    
    // [number]: Deceleration to apply to value, in units per second
    deceleration: 0,
    
    // [number]: Acceleration to apply to value, in units per second
    acceleration: 0,
    
    // [number]: Factor to multiply velocity by on bounce
    bounce: 0,
    
    // [number]: Spring strength during 'string'
    spring: 80,
    
    // [number]: Timeconstant of glide
    timeConstant: 395,
    
    // [number]: Stop simulation under this speed
    stopSpeed: 10,
    
    // [boolean]: Capture with spring physics on limit breach
    capture: false,
    
    // [number]: Friction to apply per frame
    friction: 0.05,

    /*
        .play() properties
    */

    // [number]: Duration of animation in ms
    duration: 400,
    
    // [number]: Duration of delay in ms
    delay: 0,
    
    // [number]: Stagger delay as factor of duration (ie 0.2 with duration of 1000ms = 200ms)
    stagger: 0,
    
    // [string]: Easing to apply
    ease: 'easeInOut',
    
    // [number]: Number of steps to execute animation
    steps: 0,
    
    // [string]: Tells Redshift when to step, at the start or end of a step. Other option is 'start' as per CSS spec
    stepDirection: 'end',

    /*
        .track() properties
    */

    // [number]: Factor of movement outside of maximum range (ie 0.5 will move half as much as 1)
    escapeAmp: 0
};