Trigger hype action with jQuery click (or mouseup) event

Using JavaScript with Hype
1

I have a project that uses a lot of external javascript files.

In Hype I have a control with an id=occludeBtn. Several actions happen on a click: play a sound, continue a timeline, run javascript, etc.

I’m trying to trigger a mouse click event (or mouse up event) on this control from my external javascript using javascript or jQuery, e.g.

jQuery("#occludeBtn").mouseup();
/*I've also tried .click(), .trigger("click"), and .trigger("mouseup") */

I was hoping that if I triggered an event this way that it would run all the actions in Hype. This doesn’t seem to be working though.

I can tell the click event is being captured in javascript because I can bind other events to the click, but just doesn’t seem to propagate down to trigger the Hype events.

I don’t think it will work for me to try to call the Hype actions directly from my javascript. I’m really hoping to use the click event.

2

Hype is adding events via addEventListener typically (exception on older IE). I don’t know what jQuery is doing to simulate the event, but this code would work:

var fakeEvent = document.createEvent("MouseEvents");
fakeEvent.initEvent("mousedown", true, false);
hypeDocument.getElementById("occludeBtn").dispatchEvent(fakeEvent);

I haven’t widely tested across browsers though; I have a vague recollection that there might be some issues with older browsers so I’d recommend testing.

One small note: Hype doesn’t use click events even for its own click; instead it uses a mousedown then mouseup or touchstart and touchend. So whatever you do, don’t use click within Hype if you want this to work.

You may also instead want to use custom behaviors and use the hypeDocument.triggerCustomBehaviorNamed() API.