Stopping Video When Changing Scenes

Thanks for replying JimScott!

I’ve recreated the problem in the two smaller Hype docs attached. vid_test.zip (2.3 MB)

One has Autoplay checked and the other doesn’t but uses Javascript to play the video.

The problem isn’t that the video is autoplaying, I actually want that. My problem is that it pauses when switching scenes and resumes when switching back. Also, if you switch scenes after the video is finished, and switch back again, the video restarts.

I just want the video to play once and stop on the last frame, whether you are viewing that scene or not - no pausing or restarting after switching scenes.

Hope I’m making sense, thanks.

Just but a true/false boolean in the code

    if(typeof playVid == "undefined") {
	
	hypeDocument.getElementById('vid').play();
	
	playVid =  true
	}
1 Like

Nice MarkHunte! Thanks, that partially solved it. The video now continues to play when changing scenes but if you watch the video until it finishes then switch scenes and back again, it still restarts (and reverts back to the old pause/unpause behaviour).

I’ve put your code in both my showNextScene and showPreviousScene button functions.

You can probably tell I’m an idiot when it comes to Javascript but I’m going to fiddle with a few things to see if I can fix it. If you have any suggestions in the meantime, please let me know. Cheers!

Not sure what you are doing…:smile:

It should only play once… ever.

You have the vid play function called via the Custom Behaviour from a main timeline action.
This is pretty much the same as onload.

So the code is run each time the scene loads and the main timeline starts.
The extra code checks for a global var. The first time the code runs the Global is not undefined so the if condition is met and the video plays.

After that regardless of playing the video in full or switching scenes the video will not play because the code also defined the Global var right after it started the video. So the if conditon will now never be met.

vid test 2 MHv1.hype.zip (790.1 KB)

Ok, do you mind having a quick look at this doc and letting me know where I went wrong please? Appreciate it!

vid_test3.zip (1.5 MB)

Why are you doing it in next and previous scene ?
Did you look at the example I posted above

Yes I did, it still pauses the vid when changing scenes… at least on my end

Oh, Even though you switch scenes you want the video to continue while you are on the other scene ?

Or do you want the video just to be on the last frame when you go back ?

Yes I would like it to continue regardless of scene change, play to the end and never restart unless someone uses a restart button

And what if they come back while it is still playing…

That’s fine, it just continues to the end. it’s not integral that users see all of the video so if they miss parts of it while switching scenes, that’s ok

Hmm,

I would say put the video into a Persistant Symbol and add to all scenes… but hide it on othere scenes but I think even that may not be straight forward. If I get sometime I will see what I can come up with. I or someone else may have already done this. So it is worth having a didg through the site in the mean time.

Ok, thanks for your help anyway, much appreciated. I’ve had a search around but not found anything yet. Will fiddle some more…

There may be another way of doing this (to make my life easier) by having the video pause/unpause like we’ve already done but I would still need the video to stop on the last frame and not restart until someone uses a restart button. For some reason I can’t figure that out either (not the restart button).

It works on the doc you sent me but that doc doesn’t continue playing when you return to the original scene part way through the video.

I’m aware that you’ve spent some time on this already though, so please feel free to ignore me :slight_smile:

@richarker

Here is a version that stops with no restart (if finished) when the transitioning back to "Scene 1". It is based on @MarkHunte's version so it pauses when "Scene 1" transitions to another (e.g. "Scene 2"):
vid test 2 MHv1-JHSv1.hype.zip (795.6 KB)

I've kept your Custom Behaviors & Symbols though I am not sure why they are needed (at least in your provided example).


Overview
We compare the current time in the video with its (full) duration. If "current time" = "duration", i.e. it is finished playing then we set the variable "replay" to "False" ("replay" originally set to "0" in the Head HTML). Every time Scene 1 is opened the conditional section of the "playvid" function checks to see if "replay" is "0" (play video) or "False" (don't play video and set its time to its duration).

Note: There is another way to check to see if the video has completed using the "ended" property.

SCRIPTS

Head HTML:

<script>
		window.replay = "0"; // used in both functions below
</script>


The "playvid" function triggered by Timeline acton ~ Custom Behavior "play vid"

//hypeDocument.getElementById('vid').play(); -- no longer used

window.vid01 = hypeDocument.getElementById('vid');

if(replay == "False") { // set in "returnFlag" function
	vid01.currentTime = vidDuration;
	}
 else if(replay == "0"){ // replay originally set to "0" in "Head HTML"
 vid01.play();
}


The "returnFlag" function triggered by "Next Scene" element in "Scene 1":

if(vid01.currentTime == vid01.duration) {
		window.vidDuration = vid01.duration;
		replay = "False"; // replay originally set to "0" in "Head HTML"
	}
2 Likes

That’s awesome, many thanks JimScott!

Appreciate you breaking it down for me as well, very helpful for my slow brain :slight_smile:

1 Like