Run JavaScript when a video has ended using addEventListener('ended')

Using JavaScript with Hype
7

For others looking to perform an action (like jump to another scene) when a video has ended, here's a quick code snippet you can use:

  1. Set a unique element ID for your video in the Identity inspector: myVideo

  2. Next, run the following code 'on scene load' for the scene containing the video. When the video reaches its final moment on that scene, the scene MySceneName will be transitioned to:

    var videoElement = hypeDocument.getElementById('myVideo');
if(videoElement.getAttribute("data-has-added-ended-listener") == null) {
    videoElement.setAttribute("data-has-added-ended-listener", "true");
    videoElement.addEventListener('ended',(function (e) {
    
        // What you want to do after the event
        hypeDocument.showSceneNamed('MySceneName', hypeDocument.kSceneTransitionCrossfade, 1.1)
        
    }),false);
}
9 Likes