control video playlist with global variables

Question

I have a video playlist that plays videos one after a time. I need the playlist to continue until it reaches a video with the name loop, and loop the video until one of the global variables lvl1_win or lvl2_loose (from a different script) turn 1. Depending on the result, play a different playlist, playlist_lvl2 or playlist_lvl1_gameover This is the Playlist I am currently using. It simply loops the videos one after a time:

var activeloop;
var myvid = document.getElementById('intro_lvl1');

myvid.addEventListener('ended', function (e) 
{
    var activesource = document.querySelector("#intro_lvl1 source.active");
    var nextsource = document.querySelector("#intro_lvl1 source.active + 
source") || 
document.querySelector("#intro_lvl1 source:first-child");
    //for the video with the name "loop" in it.
    var loopsource = document.querySelector("#intro_lvl1 source.loop");

    activesource.className = "";
    nextsource.className = "active";

    myvid.src = nextsource.src;
    myvid.play();
});

Could anybody give me a few suggestions on how to implement this?

fixet grammar, made it a bit clearer and fixed layout – Vladyslav Zavalykhatko Oct 21 '17 at 21:43 — Vladyslav Zavalykhatko, Oct 21 '17 at 21:43

score 0 · Accepted Answer · answered Oct 21 '17 at 16:05

You can use RegExp.prototype.test() to check if the .src contains "loop", set .loop to true

if (/loop/.test(nextsource.src)) {
  // perform logic here
  if (myvid.loop != true) {
    myvid.loop = true
  };
  if (lvl1_win == 1 ||  lvl2_loose == 1) {
    // do other stuff
  }
}

score 0 · Answer 2 · answered Oct 21 '17 at 23:39

Thank you for your answer! I got it to work with the following:

var lvl1_win;
var lvl1_loose;

var myvid = document.getElementById('intro_lvl1');

myvid.addEventListener('ended', function (e) {
var activesource = document.querySelector("#intro_lvl1 source.active");
var nextsource = document.querySelector("#intro_lvl1 source.active + 
source") || document.querySelector("#intro_lvl1 source:first-child");

if (/loop/.test(nextsource.src)) {
if (myvid.loop != true) {
myvid.loop = true;
};
if (lvl1_win == 1) {
alert("Won level 1");
}
if (lvl1_loose == 1) {
alert("Gameover level 1");
}
} else {
activesource.className = "";
nextsource.className = "active";

myvid.src = nextsource.src;
myvid.play();
}
});

However, I cannot add the specific video for winning or loosing in the same source, otherwise it would mess up the playlist. Or is it possible to play the next video with the class loose if lost vise versa? What I mean:

if (lvl1_loose == 1) { play next video with class gameover then play pause video on last frame (ending the cycle) }

control video playlist with global variables

2 Answers2