shifty

This release includes a new feature from @hoomanaskari (#171). Now you can specify an array of numbers to represent a cubic Bezier curve! Check out the updated API documentation for this feature:

• https://jeremyckahn.github.io/shifty/doc/shifty.html#.tweenConfig
• https://jeremyckahn.github.io/shifty/doc/tutorial-easing-function-in-depth.html

This release contains #160, courtesy of @jspears. Thanks also to @arthuro555 for TypeScript guidance!

This release fixes #156 by implementing shouldScheduleUpdate. It is recommended for use in projects that use both Shifty and Jest.

Thanks to @BoldBigflank for reporting this bug!

• Implements hasEnded method (#151).

Thanks to @arthuro555 for adding this feature!

This is a big one!

This release introduces TypeScript definitions for Shifty (requested in #68, implemented in #135). This is entirely thanks to the efforts of @arthuro555. Thank you @arthuro555! 👏 👏 👏

Types should "just work" in your TypeScript projects when you upgrade. Enjoy!

This release adds full support for rgba strings. It was mostly working before, but now rgba strings will have integer values instead of decimals for the rgb parts.

Thanks to @hoomanaskari for bringing attention to this!

• #136
• #137

Fixes #133 by allowing completed tweens to restart when calling tween() upon a finished Tweenable.

Thanks to @tfsJoe for reporting this lack of functionality!

This is an extremely minor followup to v2.15.2. It just switches to a more declarative Webpack configuration: https://github.com/jeremyckahn/shifty/commit/76f01a047adec8405ec64d240b4eca4627e3c90e

I just wanted to isolate this change into its own patch release in case of the (extremely) off chance that there is a regression. However, it should be a safe upgrade.

This is a fix for #129. Thanks @Hilbertangers!

This builds adds a new build target for web environments: shifty.core.js. It contains a minimal version of the library:

• Tweenable
• tween
• Easing formulas

This release delivers a (very) small performance improvement. It serves more to make the code more maintainable, but it also speeds it up ever so slightly. You can see a full breakdown of the motivation and implementation in #128.

Defines Tweenable#catch to fix backwards compatibility with pre-2.14.0 versions.

See https://github.com/4ian/GDevelop/pull/2128 for the story behind this fix.

2.14.0 brings another round of performance improvements. This release brings Shifty's CPU performance characteristics in-line with GSAP's and delivers superior memory utilization.

• CodePen link

To achieve this level of performance, a handful of small API modifications were made, but everything is fully backwards-compatible with 2.13.x.

• Promises are no longer returned by Tweenable#tween and Tweenable#resume. They return their Tweenable instance.
• To account for the changed return type, there is now Tweenable#tween that returns a Promise instance.
• This release also re-introduces the finish option for tweenConfig.

Documentation: https://jeremyckahn.github.io/shifty/doc/index.html

Video about performance optimizations and techniques

Fixes an unsafe method reference: https://github.com/jeremyckahn/shifty/commit/fe485ceb6dc460a3b518808bd9283ff45cf41082

A teeny-tiny release that won't affect most folks. It'll make animation timing slightly more accurate for animations with a very large number of synchronized tweens (as in, thousands).

• https://github.com/jeremyckahn/shifty/commit/d464c9482ef1b0777bc31236aa8dd5e4f69bc634

This release makes Shifty faster. It significantly reduces memory overhead by reusing objects and variables instead of re-declaring and initializing them.

The only functional change is trivial, but may potentially result in harmless warnings in some environments (specifically Node): https://github.com/jeremyckahn/shifty/commit/e277dc795e67ae2dc82a510a1845e1d485ad9536

If you see a warning in Node, simply add a .catch() to the Tween Promise or wrap it in a try/catch (which is a good practice for Promises generally).

Diff: https://github.com/jeremyckahn/shifty/compare/v2.12.0...v2.13.0

Adds cancel and data methods.

const { Tweenable } = shifty

const tweenable = new Tweenable()

;(async () => {
  const element = document.querySelector('#tweenable')

  while (true) {
    try {
      await tweenable.tween({
        render: ({ x }) => {
          element.style.transform = `translateX(${x}px)`
        },
        data: { hello: 'world' },
        easing: 'easeInOutQuad',
        duration: 400,
        from: { x: 0 },
        to: { x: 200 },
      })

      await tweenable.tween({
        to: { x: 0 },
      })
    } catch (e) {
      console.log(e.tweenable.data())
      break
    }
  }
})()

document.querySelector('#cancel').addEventListener('click', () => {
  tweenable.cancel()
})

See:

• #122
• #123

Fixes a compatibility bug introduced by https://github.com/jeremyckahn/shifty/releases/tag/2.11.0.

Shifty 2.11.0 improves support for async/await. Now code like this can be written:

import { tween } from 'shifty'

const animate = async () => {
  const element = document.querySelector('#tweenable')

  const { tweenable } = await tween({
    render: ({ scale, x }) => {
      element.style.transform = `translateX(${x}px) scale(${scale})`
    },
    easing: 'easeInOutQuad',
    duration: 500,
    from: { scale: 1, x: 0 },
    to: { x: 200 },
  })

  await tweenable.tween({
    to: { x: 0 },
  })

  await tweenable.tween({
    to: { scale: 3 },
  })
}

This release also changes how tweens resolve, implicitly reuses config across tweens, renames step to render and attachment to data (with legacy property names supported).

See:

• #118
• #120
• #121

Removes Promise rejection logic and updates devDependencies to stable versions.

See:

• #115
• #116