Skip to content

Instantly share code, notes, and snippets.

@basilesimon
Created March 16, 2014 22:17
Show Gist options
  • Save basilesimon/9590640 to your computer and use it in GitHub Desktop.
Save basilesimon/9590640 to your computer and use it in GitHub Desktop.
Popcorn Chain videos
<!DOCTYPE html>
<html>
<head>
<title>test popcorn player</title>
<meta charset="utf-8">
<script src="http://cdn.popcornjs.org/code/dist/popcorn-complete.js"></script>
<script src="https://raw.github.com/rwaldron/popcorn.sequence/master/popcorn.sequence.js"></script>
<script src="http://code.jquery.com/jquery-2.1.0.js"></script>
<!-- <script src="popcorn-chain.js"></script> -->
<!-- <script src="script1.js"></script> -->
<style>
content{
width:400px;
height: 300px;
position: absolute;
}
</style>
<script>
var sequence = Popcorn.sequence(
"container-id",
[
{
src: "http://videos.mozilla.org/serv/webmademovies/atultroll.webm",
in: 0,
out: 3
},
{
src: "http://videos.mozilla.org/serv/webmademovies/justintime.ogv",
in: 174,
out: 180
},
{
src: "http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv",
in: 0,
out: 6
}
]);
// play popcorn
sequence.play();
sequence.footnote({
start: 0,
end: 2,
text: "footnote",
target: "foo"
});
// get popcorn object of first video
console.log( sequence.eq( 0 ) );
//exec something at 4 seconds
sequence.exec( 4, function() {
console.log( "AT 4 SECONDS" );
});
</script>
</head>
<body>
<div>
<div id="container-id"></div>
</div>
<div id="foo"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment