skidx / tweene Goto Github PK

Just noticed that calls to .pause() on timelines have no affect following a call to .restart() a timeline.

Not seeing anything in the docs, so not sure if this is a "feature" or a bug?

If it matters I am running nested timelines when this occurs.

Otherwise this is a great library that has helped a ton.

Thanks.

John

To me, having a truly 'unified API' would require they take the same input, thus all conform to ms, don't you think? A bit of extra maths, but less programming & worry when switching. Or am I missing something here?

I've never heard of it and don't feel like reading a ton of legal jargon. Is the lib free to use or what? If it is, MIT it like every single other modern lib out there?

no support for webpack / browserify is a major downer

When tweening an object's scale with to, the initial value set by the stylesheet is ignored, and it tweens from 1.0 regardless of what is set. This looks even worse when you restart: because the object's scale is set to 1.0, it no longer looks correct at the beginning of the animation.

I thought forcefeeding the value by using fromTo, with the correct initial scale, would fix the problem, but that doesn't work either! It starts from 1.0 even with fromTo.

What's going on here? Why is it ignoring the initial scale/transform?

Any chance of a fix?

Thanks!

The docs state, "The event implementation relies on library's native progress event if available." The progress event fires but the values for "complete", "remaining", "start", and "tweenValue" are undefined. Is this a bug or should I get the values a different way?

When calling play() on a tween created with jquery as a driver, the error mentioned above arises..

The following code doesn't work as expected:

Tweene.defaultDriver = 'velocity'
Tweene.to($('#circle'), {transform: 'translateX(12em)'}, 500)

Using

Tweene.to($('#circle'), {x: '12em)'}, 500)

does the job. The documentation states

Tweene takes care of this thing for you, accepting a wide range of different names and replacing them accordingly to those accepted by the library currently used.

To me, that sounds like 'if you are using something other than expected by the underlying library, i will fix this for you' . I'm unsure whether it's a bug or the documentation lacks a good explanation how to supply an appropriate property.

Is it possible to simultaneously tween multiple objects on a timeline? I tried inserting a label and then adding two tweens at the label position but they get executed immediately instead of waiting for child1 and child2 to complete:

Tweene.line()
.add(child1)
.add(child2)
.add('myLabel')
.add(child3, 'myLabel')
.add(child5, 'myLabel');

Hello, thanks for the great work!

Any plans or tips for how to implement seek or set progress functionality for timelines in Tweene, so that an animation position can be set to a particular point in a timeline? This is a very handy feature of GSAP, that allows cool effects like controlling an animation from scroll position, or setting a certain timeline point on certain events, etc. It would be awesome to have that ability across different backends beside GSAP :)

https://github.com/sole/tween.js/

How do I create timelines that are equivalent to AnimationGroup and AnimationSequence in web-animations?

A group play all animations together and a sequence play each animation when the previous ends.
Both take animation delay into account if set.

var animationGroup = new AnimationGroup([new Animation(...), new Animation(...)]);
var animationSequence = new AnimationSequence([new Animation(...), new Animation(...)]);

Thanks

Are those map files mapping the /minified/*.min.js files? Should they be hosted together (eg will Chrome & Fx find them & read them)?
I'm about to host your project on jsDelivr CDN; that is why I'm being so picky ;)

I am getting an error, jQuery is not defined, when I am trying to use velocity version of this library.

It is on the line that says "if (jQuery&&a) var x=jQuery"

Do I need to have jQuery installed? I am not using it, I want this to work without jQuery.

Hi,
I come up from velocity to your example site but no example works.
I use Chrome latest version (72.0.3626.109).

Cheers

I'm curious if http://www.pixijs.com/ might be a good fit for adding as a backend driver.

Causes problems with Windows vs Linux/OSX, Bower, AMD, NPM...
ractivejs/ractive#527 (comment)
cheers :)

Hello,

I'm trying to animate several objects with tweene. I want the animation to pause each time one tween finishes so I tried adding a callback after each .to() call.

But it does nothing. Is it supposed to work that way?
Example
Thanks

I was using your awesome library successfully until I want to switch the driver from Velocity to GSAP.

I am using both tweens and timelines but the timeScale method no longer works on a timeline since then (it does nothing).

Should I load the TimelineLite library from GSAP as well ?

I'm having the following code:

Tweene.defaultDriver = 'velocity'
Tweene.set($('#header'),{opacity: 0})
Tweene.to($('#header'), {opacity: 1}, {duration: 1000})

I'm trying to set the opacity of this element to 0 instantly and then fading it in. But the opacity seems to be 1 all the time, as if none of the operations are applied. Is this how things are supposed to work?

Hello. I just found this project few hours ago and I've got quite excited about it at first. It was nice to find out that I can have power of GSAP-like timelines with Velocity animation engine... However it's quite big in size and in some... actually in many cases most of the features it comes will not be needed.

Real example: Currently I have some UI components in works (just like those fancy javascript-powered things from Bootstrap or Semantic-UI frameworks) which I'd like to release to the public in the future. But right now it's being developed in context of the project where Velocity.js is used all over the board, so those components are relying on it as well.

And it may look like switching from using Velocity directly to Tweene is a good idea, because this way it will make use of whatever existing animation engine instead, so this is probably going to be the most lightweight dependency that will enable us to have animations, right? Well, not really. Current package of Tweene is about 140kb in size uncompressed, which is more than half a size of Velocity.js size and twice bigger than GSAP's TweenLite.

I'm not familiar with the code, so I don't if it's functional without Timelines or not. I would assume that is and this alone can save us like 20% of the size. But without knowing details of the code internals it hard to even assume what components can be omitted from the bundle to get minimal working configuration.

And because of all that I would love to see some sort of minimal package or maybe even a simplified version of Tweene (like TweenLite/TweenMax in GSAP) to be a part of the project.

Because currently it's just cheaper to go with a dependency of gsap's TweenLite, rather than Tweene. And even then 70kb of extra code is still a lot