[Javascript] end of a function

[Mike Dougherty]

Rather than incrementing a single variable, you could have each animation register itself into an 
array (hash) - the registration first checks to see if the animation is already started (if it 
exists in the hash) then it won't duplicate the entry on an incomplete animation restart.  Upon 
reaching the final destination, the animation is removed from the hash.  Your hash could contain 
the id, destination coordinates, speed, etc. - and your animation routine could cycle over the 
hash and move each item accordingly.  The "start" routine would simply add a reference to the 
hash, "stop" would remove it.  This would scale much better than an independant timer for each 
animation.

note:  i've never used js for animation, but your question prompted me to think of this solution.

On Thu, 12 May 2005 21:56:42 +0100
  "Dash" <forgetful54341087097153001984 at hotmail.com> wrote:
>hi,
>
>i have a script which animates a layer to a given set of coords on the page (below). (it does it 
>in as straight a line as possible, and slows down the closer it gets to final position.) It can 
>be used for multiple layers at once. I was trying to come up with a way of detecting when all 
>layers being animated had arrived at their final location - ie. a script that constantly checks 
>whether they have or not - but i cant think of a way of doing it. it has to be a little cleverer 
>than doing an else statement on the "recall" part if it's to detect multiple "animation complete" 
>events. does anyone have any ideas?
>
>possibilities:
>
>1)create a variable in an array for each animation that is started. delete the variable for the 
>animation when it finishes. have the script check for when _array_.length==0. 
>
>2)increase the value of a variable by one each time a new animation is started and decrease it's 
>value by one each time it is completed
>
>problems:
>- i don't have a clue how i could pull either of these off
>- deleting a variable that is part of an array does not decrease _array_.length - or at least i 
>dont know how to.
>- the animation is triggerred by a user event, if they restart it before the animation is 
>finished, neither of these ideas will ever know when the animation has finished.the same anim 
>will have started twice, but finished only once
>    - so then i thought how about something that uses a dynamically assigned variable of an 
>object (like the way i'm using animTimer object), combined with number 1 above and check for when 
>it's length is zero, but animTimer.length (or similar) always returns undefined :-(
>
>thanks
>
>Dash
>
> var animTimer = new Object();
>function slideTo(layerID,finalLeft,finalTop){
>
> eval("clearTimeout(animTimer."+layerID+")"); //incase the animation is restarted half-way 
>through
>
> var initLeft=parseInt(document.getElementById(layerID).style.left); //find out where
> var initTop=parseInt(document.getElementById(layerID).style.top); //the layer is now
>
> var newLeft=finalLeft-Math.round(0.68*(finalLeft-initLeft)); //calculate new coords of the 
>element
> var newTop=finalTop-Math.round(0.68*(finalTop-initTop)); //it'll move a percentage of the 
>distance that it currently is from its final position
>
> document.getElementById(layerID).style.left = newLeft; //move the layer to its calculated coords
> document.getElementById(layerID).style.top = newTop;
>
> if((newLeft==initLeft) && (newLeft!=finalLeft)){
>  moveTo(layerID,finalLeft,initTop);  //if its not going to be moved but is not at its final 
>destination, put it there
>  }
>
> if((newTop==initTop) && (newTop!=finalTop)){
>  moveTo(layerID,initLeft,finalTop)  //same again but for y coord
> }
>
> if((finalLeft!=initLeft) || (finalTop!=initTop)){
>  eval("animTimer."+layerID+'=setTimeout("slideTo('+"'"+layerID+"',"+finalLeft+","+finalTop+')"'+",30)"); 
>//recall function if it's not at it's final destination
>  }
>}
>
>
>
>__________________________________________________________
>This message was scanned by ATX
>5:14:08 PM ET - 5/12/2005