JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://popcornjs.org/code/dist/popcorn-complete.min.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

// create an instance of popcorn
var popcorn = Popcorn( "#video", { 
      frameAnimation: true, 
      frameRate: 5,
      defaults: {
        footnote: {
          target: "my-footnote-default-id",
          text: "I'm a default footnote!"
        }
      }
    }),
    options = popcorn.options;

// Log each of the values for the passed in options
console.log( options.frameAnimation );
console.log( options.frameRate );
console.log( options.defaults );
console.log( options.defaults.footnote.target );
console.log( options.defaults.footnote.text );