I have two scenes in my project (Scene 1 and Scene 2) and Scene 1 includes a persistent symbol only added to that scene. I can start the symbols’s timeline with this script triggered from within the same scene:
However, I would also like to start the symbols’s timeline from the second scene. I added the script above to the second scene but it does not work. Is this even possible?
i’d say, if the symbol is just on one scene it does not have to be persistent …
anyway … you can save the state on the click-behavior and check it on sceneload …
to mention: @MaxZieb wrote an extension to cache the symbol-object, but I’m not sure at the moment if you can access the symbol-object if it is not on the active scene …
You actually cannot because the Hype runtime (re)moves the symbol from the scene and invalidates the access or rather the command hypeDocument.getSymbolInstanceById only return symbols on the current scene. Additionally, behind the scenes (in the HTML) if you inspect it: The persistent symbols HTML is moved (detached and reattached) into an invisible DIV node.
You can check by logging in your Button function: console.log(hypeDocument.getSymbolInstanceById('Progress'));
Both animations also have a regular symbols in them to illustrate that they are always destroyed and recreated. This goes even a bit further on the API-Side because everytime you request a symbolInstance the Runtime returns a JavaScript Object with the API but it’s recreated everytime you call the hypeDocument.getSymbolInstanceById or symbolInstance.getSymbolInstancesByName. So, in contrast to hypeDocument the built in symbolInstance is a hostile place to store state. If you want to override the API side of storing state you can use Hype SymbolCache as it works as an intermediary and creates the symbol API for each symbol once and return the same JavaScript Object (Symbol-API) in subsequent calls. That allows you to store information in an object-oriented fashion.
BTW You can always store information in a centralized fashion and run symbols from that central data store (like hypeDocument.customData). The reactive movement uses this approach and trickles down information from a data store to all components on the render tree. The basic premise being that its one way much like in CSS (Cascading Style Sheets) don’t allow parent sectors.
Interesting use case! I can’t recall our reason for not allowing a persistent symbol to be looked up in this manner, especially when we’ll keep running its timelines in the background.
Another workaround would be to use a custom behavior. You could add one inside the persistent symbol (I call it “starter”) that starts the main timeline. Then you can either use the Trigger Custom Behavior… action or the hypeDocument.triggerCustomBehaviorNamed('starter'); API.
Thanks for the detailed explanation Max. I’m working on a project that has the overview of all scenes in the first scene and need some kind of progress tracking to be displayed in the first scene based on various user actions in other scenes. I will look into your HypeSymbol Cache as I wast to learn more stuff you can do with Hype.
I will be honest I did not read this thread from the beginning so missed this.
Not that it is any better but you can put the symbol instance in a hypeDocument.customData var.
That’s a really cool technique! If you are doing it on symbol load you don’t even need to bother giving the symbol an ID; the “element” passed into the function is the symbol. So you could do:
