Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Plays commercials and music in CLR browser
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Commercials</title>
<style type="text/css">
#commercial {
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 0.1s;
}
</style>
</head>
<body>
<video id="commercial"></video>
<audio id="music"></audio>
<script>
// How many commercials before playing a song
var VID_PER_SONG = 2;
// how many seconds delay between each commercial
var DELAY = 3
// List of all commercial videos
var COMMERCIALS = [
"http://ehsankia.com/twitch/adrian/alert.mp4",
"http://ehsankia.com/twitch/adrian/alert.mp4",
"http://ehsankia.com/twitch/adrian/alert.mp4",
"http://ehsankia.com/twitch/adrian/alert.mp4",
"http://ehsankia.com/twitch/adrian/alert.mp4",
];
// List of all songs
var SONGS = [
'http://ehsankia.com/twitch/adrian/cup/money.ogg',
'http://ehsankia.com/twitch/adrian/cup/money.ogg',
];
var videoPlayer = document.getElementById('commercial');
var musicPlayer = document.getElementById('music');
var video_index = 0;
var song_index = 0;
// Plays the next video
function play_video() {
videoPlayer.style.opacity = 1;
videoPlayer.src = COMMERCIALS[video_index++ % COMMERCIALS.length];
videoPlayer.play();
}
// Plays the next song
function play_song() {
musicPlayer.src = SONGS[song_index++ % SONGS.length];
musicPlayer.play();
}
// Plays the next song or video after a delay
function play_next() {
videoPlayer.style.opacity = 0;
var next = video_index % VID_PER_SONG == 0 ? play_song : play_video;
setTimeout(next, DELAY * 1000);
}
videoPlayer.onended = play_next;
musicPlayer.onended = play_video;
play_video();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment