I’m building an interactive animation in Hype 4, and it will have a Play mode to make it run and look like a screencast. To make it work, the Play mode needs to highlight “clicks” so the viewer can see what they would click on to run it interactively. I’ve built a symbol that’s just a circle, which fades in and out with on a symbol timeline named “Activated”. So far, so good - running the Activated timeline in Hype causes the symbol to appear and then fade.
To tie this symbol timeline into the scene, I created created the following function:
function clickTap (hypeDocument, element, event) {
var tc = hypeDocument.getSymbolInstanceById('tc-1');
tc.startTimelineNamed('Activated', hypeDocument.kDirectionForward);
console.log(tc.symbolName()); // testing
console.log(tc.element()); // testing
}
Then I added an action to my “Autoplay” scene timeline to call the “clickTap” function. When I run the scene timeline, the circle doesn’t appear at all (in Hype or the browser). The console logging does in my function does work, so I know the function is being called.
Here’s the “Activated” symbol timeline:
And the “Autoplay” scene timeline (which is being called by the Main scene timeline):
Maybe my issue is related to the External Element Visibility Mode for symbols? I tried all variations of that but no luck, but I couldn’t find any documentation on it.
