I'm trying to create a tutorial involving propagating sound waves, and I want an animation showing expanding circles to represent the wavefronts at two different frequencies. I'm attaching a sample (test) to show progress so far.
I have a symbol which is just a red circle, which expands linearly in its own timeline (symbol::Main Timeline) over 4 seconds, and which loops back to the beginning when it reaches the end of its own timeline. I placed 4 instances of this symbol on the main scene, offsetting the start of each by 1 second.
To represent a higher frequency (double), I just duplicated the symbol, changed its colour (to blue), and put 8 instances on the scene, offsetting each by 0.5 s (and slightly offsetting them all from the existing red symbols).
This works fine (but be aware if you run the test sample that it can be visually slightly disturbing - so if you are sensitive take care).
My problem is that periodically I need to "freeze" and restart the animation of the sound waves, so that I can illustrate key points about sound reception at different phases. I have a javascript function that I think should pause both the symbol timelines and the scene timeline, and another which should continue them. I call the pause function as a action set about 8 s into the main scene timeline (for demonstration, you can also call it by clicking a central rectangle), and it pauses fine.
A key press calls the continue function, and I want the sound wave animation to continue from exactly the same state that it was in when it was paused. However, it does not! The wavefronts become offset, and sometimes apparently arbitrary changes in position seem to occur. It is as though the different timelines were not all stopping and starting in synch.
Sorry this is a bit complicated (hopefully the sample will make the problem clear). I think I must have somewhere got the wrong concept about symbol timelines or using the Hype Javascript API, so any help or advice would be much appreciated.test.hype.zip (30.6 KB)
thanks,
Bill Heitler