The sprite are effectively symbols.
So you can use limited sprite actions to start, pause, go to time, continue.
.
You can pause at a given frame.
This also means you can use some of the symbol API to control a sprite.
A sprite only has one time line; 'Main Timeline'. ( remember this timeline is within the sprite like a symbols main time line )
You cannot add any other timelines.
If you wanted to control the sprite’s timeline via JS then you would just use similar code you would to control a symbols Main Timeline.
Unfortunately you cannot use custom Math equations on the sprites easing as you do not have access to it. Which means you cannot use a custom Math Equation as a call back
So you would need to use things like
requestAnimationFrame() and/or setTimeout(function()
A basic rough code example.
var sprite_ = hypeDocument.getSymbolInstanceById('sp1')
sprite_.startTimelineNamed('Main Timeline', hypeDocument.kDirectionForward)
window.globalID;
repeatOften() // run time checking function
function repeatOften() {
setTimeout(function(){
var currentTime = sprite_.currentTimeInTimelineNamed('Main Timeline');
console.log(currentTime);
if (currentTime > 2.95 ){
sprite_.pauseTimelineNamed('Main Timeline')
cancelAnimationFrame(window.globalID);//- Stop checking as we don't need it now
console.log("stopped for 5 seconds")
///--- re start in 5 second
setTimeout(function(){
sprite_.startTimelineNamed('Main Timeline', hypeDocument.kDirectionForward)
}, 5000); //--
//-- last setTime will run in 5 seconds so we can exit this function block for good.
return
}
window.globalID = requestAnimationFrame(repeatOften);
}, 100); //--> Animation Speed.
}
This all can be done in the UI without code.
If you put the sprite start action on a second scene timeline.
for example.
On a second scene timeline you place a start sprite action.
In the same timeline you add a pause action ( for the scene timeline, you do not need to put the pause on a sprite action, the scene timeline pause will be sufficient to pause the sprite )
On the Main scene timeline you start the second scene time line when you want your sprite to start.
And further along on the Scene’s main timeline you add another timeline action to continue the second timeline.
Timing is key here.
If we want the sprite to start at 4s after the scene's main time line starts
We put the first action to start the second scene at the 4s mark.
Once the sprite starts we want it to pause after 3s.
So on the second timeline for the scene we put a pause at the 3s mark.
Back on the Scene's Main timeline at the 12s mark we restart the second scene.
Which restarts the sprite 5s after the pause. ( 4+3 =7) + 5 = 12
Hope that makes sense.
It would be nice to have more actions in the UI. Like call JS/ custom behaviours etc.
