Bug Tracker

Modify

Ticket #11797 (closed enhancement: fixed)

Opened 2 years ago

Last modified 21 months ago

New animation related events

Reported by: imdad.sk@… Owned by: gnarf
Priority: high Milestone: 1.8
Component: effects Version: 1.7.2
Keywords: Cc:
Blocking: Blocked by:

Description

 http://api.jquery.com/animate/ The .animate() supports properties [, duration] [, easing] [, complete]

There should be more animation related events in addition to complete

like start which will be fired when animation is started. And finish which will be fired when animation is completed or stopped/aborted some how.

Change History

comment:1 Changed 23 months ago by gnarf

  • Owner set to gnarf
  • Status changed from new to assigned

This might be really easy to implement with the new base of code in 1.8 -- If we want to, I suppose now would be the time to do it?

comment:2 Changed 23 months ago by dmethvin

Not sure about the use cases and semantics here. Actual events, or just callbacks? If callbacks, would these be added to the property hash or to the arg list? If events, would the event be fired on the element being animated and would it bubble, which would be relatively expensive?

comment:3 Changed 23 months ago by gnarf

Callbacks - the "options" hash.

$.fn.animate( props, opts );

opts = {
    start: // called during animation startup ( after prefilters)
    complete: // called when animation plays its last frame - not called when interrupted early
    stopped: // called when animation is stopped early ( has a boolean indicating "gotoEnd" )
    always: // called when animation is done
};

I'm not happy with the name "always", but I like it more than "finish" since finish seems to imply the animation completed. "complete" currently is the only defined callback.

start seems useful, stopped could also be useful, and "always" (or a better name) more so...

I'd also like to propose that the "first argument" to each of these functions (none is currently defined for "complete" ) be the "animation" object from jQuery 1.8.

Just to go over the expected calling for various ways an animation finishes, when an animation is stopped by:

.stop( false, true /*gotoEnd*/ ) - calls stopped( anim, true ) , complete( anim , always( anim )

.stop( false, false ) - calls stopped( anim, false ) , always( anim )

natural completion - calls complete( anim ) , always( anim )

Last edited 23 months ago by gnarf (previous) (diff)

comment:4 Changed 23 months ago by gibson042

Why come so close to Promise without going all the way?

  • .stop( false, gotoEnd = true ) calls:
    1. done( anim, jumpedToEnd = true )
    2. always( anim, jumpedToEnd = true )
  • .stop( false, gotoEnd = false ) calls:
    1. fail( anim, jumpedToEnd = false )
    2. always( anim, jumpedToEnd = false )
  • natural completion calls:
    1. done( anim, jumpedToEnd = undefined )
    2. always( anim, jumpedToEnd = undefined )

and let done fallback to complete for backwards compatibility.

comment:5 Changed 23 months ago by gnarf

Maybe it is just that simple... +1 gibson

comment:6 Changed 23 months ago by dmethvin

I like that, and prefer it to creating new callbacks.

comment:7 follow-ups: ↓ 9 ↓ 13 Changed 23 months ago by imdad.sk@…

Will it be good to have another event/callback for animation progress. I think it should be fired in each frame of animation.

The event should have properties like status (notStarted, Running, Completed, Aborted/interrupted) and progress (the progress percentage)

I know it will cost processor time. But it will be useful for tracking event percentage and also it will make jQuery's animation much flexible.

comment:8 Changed 23 months ago by gibson042

  • Owner changed from gnarf to gibson042
  • Milestone changed from None to 1.8

comment:9 in reply to: ↑ 7 Changed 23 months ago by gnarf

Replying to imdad.sk@…:

Will it be good to have another event/callback for animation progress. I think it should be fired in each frame of animation.

The event should have properties like status (notStarted, Running, Completed, Aborted/interrupted) and progress (the progress percentage)

I know it will cost processor time. But it will be useful for tracking event percentage and also it will make jQuery's animation much flexible.

There are other ways to get this information, also there is currently the step callback which is called for each property on each frame of the animation.

comment:10 Changed 22 months ago by mikesherov

  • Priority changed from undecided to high
  • Component changed from unfiled to effects

comment:12 Changed 22 months ago by Corey Frang

  • Status changed from assigned to closed
  • Resolution set to fixed

Fix #11797. Use Deferred for better animation callbacks. Closes gh-830.

In particular, an animation stopped with gotoEnd will be rejected.

Changeset: 36369ce50ff276dcf2959add7dc949af83b221c2

comment:13 in reply to: ↑ 7 Changed 22 months ago by gnarf

  • Status changed from closed to reopened
  • Resolution fixed deleted

Replying to imdad.sk@…:

Will it be good to have another event/callback for animation progress. I think it should be fired in each frame of animation.

On second thought, this is way too useful... Filing a pull request to amend in the "progress" callback which is function( anim, progress, remainingMS ) Called once per FRAME after all properties have been set.

comment:14 Changed 22 months ago by gnarf

  • Owner changed from gibson042 to gnarf
  • Status changed from reopened to assigned

comment:15 Changed 22 months ago by mikesherov

#11910 is a duplicate of this ticket.

comment:16 Changed 21 months ago by gnarf

  • Status changed from assigned to closed
  • Resolution set to fixed

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

View

Add a comment

Modify Ticket

Action
as closed
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.