JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://popcornjs.org/code/dist/popcorn-complete.min.js"></script>

<script src="popcorn-complete.js"></script>
<video height="180" width="300" id="video" controls> 
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.mp4"></source>
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.ogv"></source>
<source src="http://videos.mozilla.org/serv/webmademovies/popcornplug.webm"></source>
</video>

JavaScript

src="popcorn-complete.js";

var popcorn = Popcorn( "#video" ),
    count = 0;

//  an exec block would look like this:
//  popcorn.exec( 1, function() {
//    console.log( "Exec ran" );
//  });

// cue is almost identical

popcorn.cue( 1, function() {
  // log count, which is 0 by default
  console.log( count );
});

// Another example with some more functionality included

popcorn.cue( 3, function() {
  //set current time to 1 and increase a simple counter
  count++;
  this.currentTime( 1 );
});

// Play our video
popcorn.play();

// This demo will log our current time at 1 second and seek back to 1 second in the video at
// 3 seconds and increase our counter