Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

An updateTo() method (feature request?) #257

Closed
adrienbrunet opened this issue Apr 11, 2016 · 6 comments
Closed

An updateTo() method (feature request?) #257

adrienbrunet opened this issue Apr 11, 2016 · 6 comments

Comments

@adrienbrunet
Copy link

Hi, I'd like to use tween.js for animation (and this library is awesome).
I need it to go from objectA to objectB. ObjectB is also constantly moving (including DURING the animation). I need to update the .to() position. Can we do that with the actual structure? I haven't found any issue or docs related to this problem.
Do we need a fonction let's say called "updateTo()" to do that? Cheers

@mikebolt
Copy link
Contributor

Yeah, the library isn't designed to do this currently, but I think it's a good idea. I think instead of an updateTo() method, it would make more sense to have a method like setDynamic() which would set dynamic to true (or false with an argument) for that tween instance, then the current update() method would support both the regular and the dynamic kind of tweening, depending on the value of that property.

In the meantime, you can hack it by doing your own interpolation inside the onUpdate() method. Note that in this example I account for the possibility that both the start and the end positions are moving.

var movingStart = {x: 5, y: 52};
var movingTarget = {x: 12, y: 112};

var object = {x: 5, y: 52};
var tweenValue = {value: 0};

TWEEN.Tween(tweenValue).setEasing(TWEEN.Easing.Cubic.InOut).to({value: 1})
  .onUpdate(function() {
    // Do some linear interpolation between the start and end values:
    object.x = movingStart.x + tweenValue.value * (movingTarget.x - movingStart.x);
    object.y = movingStart.y + tweenValue.value * (movingTarget.y - movingStart.y);
  }).start();

@JosephClay
Copy link

updateTo is very clear as to its intent. I'd prefer that to another boolean trap.

@mikebolt
Copy link
Contributor

First of all, thanks for that article. That was a good read.

I don't think that, according to Hidayat, the setDynamic method I propose is a boolean trap, and I still think that's better than a separate update method. Here's my reasoning:

Its functionality not ambiguous or unintuitive. It sets the "dynamic" property of the tween, putting it in "dynamic mode".

According to his other article, setters that start with "set" and that are not double negatives are fine.

The method will have no side effects besides setting the "dynamic" property. It will be a pure setter method, with only one argument.

"dynamic" should be considered a property of the tween.

I'm not sure how the tween would behave if you called update() then updateTo() (or updateDynamic()) before the tween finished. If you saved some kind of property to prevent switching, then that property would essentially be the one I am proposing.

Let me know what you think!

@sole
Copy link
Member

sole commented Oct 3, 2016

@adrienbrunet what did you think?

@adrienbrunet
Copy link
Author

Well, I'm not sure what the best option is. I proposed updateTo() because I saw it in use in another library about tweening things and it makes sens. Meanwhile, @mikebolt seems right. I think how we implement is more on the maintainer side than mine (it's been quite some time since I opened this issue, I'm not using it so often now). I just think being able to do it would be a good feature. =)

@franciscop
Copy link

franciscop commented May 14, 2019

Hi @adrienbrunet, a bit late but I basically made a library exactly for this. It only supports CubicInOut, but it's super smooth:
https://github.com/franciscop/ola/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants