search

naver / egjs-axes

A module used to change the information of user action entered by various input devices such as touch screen or mouse into the logical virtual coordinates.
https://naver.github.io/egjs-axes/
MIT License
179 stars 32 forks source link

feat: add useAcceleration option to PanInput #205

Open malangfox opened 2 years ago

malangfox commented 2 years ago

Details

bandicam 2022-10-13 19-13-05-360

animateOn option adds a new way to trigger change events by continuous animation.

Usage

const axes = new Axes({
  x: {
    range: [0, 200],
  },
  y: {
    range: [0, 200],
  },
}, {
  animateOn: "change",
});

This is an example of applying animateOn option.

How it works

Legacy behavior animateOn: "release" triggers change event directly to the destination from the input.

Newly added behavior animateOn: "change" will play the animation with the destination from the input.

animateOn: "change" uses the new changeTo method in AnimationManager. changeTo calls _animateLoop that starts the animation set by the user and fires continuous change events. Movement through the changeTo method does not trigger animationStart and animationEnd events.

When the input is released, the existing animation behavior works for both options triggering animationStart and animationEnd events, and the sequence of events does not change.