Skip to content

Instantly share code, notes, and snippets.

@joshrieken
Created January 22, 2016 03:49
Show Gist options
  • Save joshrieken/a4e44f8830eef4299bd6 to your computer and use it in GitHub Desktop.
Save joshrieken/a4e44f8830eef4299bd6 to your computer and use it in GitHub Desktop.
Ardent Camper looping videos code
$(function() {
var $video = $('.hero-video');
var $hero = $('.hero');
if (!!$video.length) {
function playVideos() {
var videos = [
{
src: [
'http://ardent-camper-production.s3.amazonaws.com/rootglacier.webm',
'http://ardent-camper-production.s3.amazonaws.com/rootglacier.mp4'
],
title: 'Root Glacier'
},
{
src: [
'http://ardent-camper-production.s3.amazonaws.com/flagstaff.webm',
'http://ardent-camper-production.s3.amazonaws.com/flagstaff.mp4',
],
title: 'Flagstaff',
},
{
src: [
'http://ardent-camper-production.s3.amazonaws.com/sedona.webm',
'http://ardent-camper-production.s3.amazonaws.com/sedona.mp4',
],
title: 'Sedona',
},
{
src: [
'http://ardent-camper-production.s3.amazonaws.com/sedona2.webm',
'http://ardent-camper-production.s3.amazonaws.com/sedona2.mp4',
],
title: 'Sedona 2',
},
];
var player = videojs($video[0]);
var fadedIn = false;
var fadedOut = false;
player.on('timeupdate', function() {
if (player.currentTime() > 0.75 && player.remainingTime() >= 1.75) {
if (!fadedIn) {
$('.video-container').fadeTo(1000, 1);
fadedIn = true;
fadedOut = false;
}
}
if (player.remainingTime() < 1.75 && player.currentTime() >= 0.75) {
if (!fadedOut) {
$('.video-container').fadeTo(1000, 0);
fadedIn = false;
fadedOut = true;
}
}
});
player.ready(function() {
this.on('lastVideoEnded', function() {
player.playList(0);
});
player.play();
});
player.playList(videos);
}
playVideos();
}
});
function setHeaderHeightToVideoHeight() {
var $video = $('video');
if ($video.is(':visible')) {
var videoHeight = $video.height();
var newHeight = videoHeight > 506 ? videoHeight : 506;
$('.content-head').css('min-height', newHeight);
}
}
$(window).resize(setHeaderHeightToVideoHeight);
$(document).ready(function() {
// Give time for video to load and start playing, then set the height.
setTimeout(setHeaderHeightToVideoHeight, 6000);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment