How do i control(play and pause + timeline scrubber) on a timeline that is inside HTML Widget

Using JavaScript with Hype
,
1

Hi Guys, I’m trying to create a play, pause and a timeline scrubber for an animation that is created in adobe animate and i import it in Hype through the HTML Widget. I know there are more simple ways doing this by importing the animation as a mp4 and it’s easier to make control button for mp4. So is there a way to control the timeline that is in the HTML Widget?

Thanks,
Jian

2

once, you’ve got the abstraction this’ll be your best friend and swiss knife! :slight_smile:

1 Like
3

Hi @h_classen

Appreciate the reply, as I’m still relatively new to coding and Hype is there any example that you can show it to me and it can help me as a guide

Thanks!

4

it’s @MaxZieb’s extension and he does some more explanation here: https://playground.maxziebell.de/Hype/GlobalBehavior/

the forum may also have a few threads regarding the extension. the forumlink: Hype Global Behavior (Custom Behavior Extension)

first learn about globalbehaviours within hype, then step further … :slight_smile:

5

apologize, i may have misunderstood your question ... if you explizit want to know how to control a adobe animate export ... i don't know

it's more of a question for an Adobe-forum ...:slight_smile:

6

That sounds very redundant using Adobe animate in Hype. Much like a Russian doll :slight_smile:

In general you can communicate across iframes using postMessage in JS. Hype GlobalBehavior uses this technic to broadcast across iframes. As postMessage needs to have a receiver and sender you need to define the function handler and emitter in the host and iframe.

With Hype GlobalBehavior you have this implemented out of the box but it is only used to forward the simple custom behavior string. If you need a more complex setup with function calls with complex parameters you’d have to implement this yourself.

Also you could try to put the two into the same document scope without the iframe barrier. Then one could directly trigger the opposing API.