Click here to Skip to main content
15,867,453 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hello

I developed a tracking application with javascript and now i can play a trace of my cars using a animation function. Next I want to create a function that can pause the trace in any moment after click of the 'pause' button [pause the animation]. i tried something like :
C#
var doChange = true;

function PAnimation() {
  if (doChange){
    PolyAnimation("../../Handler/HandlerAnimationP.ashx");
  }
}

function StopAnimation() {
  doChange = false;
}

but it doesn't work how it should be. I also searched a lot but i found something about timing events and that is unusuful for this situation. Thank you for your suggestions.
Posted

1 solution

"Pause in the function" is possible (some blocking call, whatever it is), but it won't help you. Such "pause" is just a wrong idea.

Animation is the sequence of the calls to window.requestAnimationFrame, optionally, with some data needed for frame rendering and, typically, time stamp to be taken into account in rendering. If there is no such data, it could be animation related data associated with the frame and calculated after each frame update. One of the ways to "pause" is to set a flag to stop frame updating and changing the state of the state machine you are using in rendering. The frame update code can read this flag and, say, exit the update function.

Please take a source code of my JavaScript application Tetris on Canvas published on CodeProject, and see how a pause can be organized.

[EDIT]

From my code, you will see that window.requestAnimationFrame might not be available in some some browsers. But then it can be implemented in some fallback way based on window.setTimeout, so, essentially, this function still can be used. Please see for further detail: http://paulirish.com/2011/requestanimationframe-for-smart-animating.

—SA
 
Share this answer
 
v4
Comments
Abhinav S 28-Apr-15 13:26pm    
5.
Sergey Alexandrovich Kryukov 28-Apr-15 14:42pm    
Thank you, Abhinav.
—SA

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900