Popcorn Plugins

Popcorn offers a plugin factory that allows user to create their own plugins to synchronize with the playable media timeline.

Document and Directory Setup

  1. Create a folder popcorn-js/plugins/pluginname
  2. Create 4 files:
    • popcorn.pluginname.html – The demo file, contains html to run plugin
    • popcorn.pluginname.js – The code file, contains plugin
    • popcorn.pluginname.unit.html – The demo test file, contains html test framework
    • popcorn.pluginname.unit.js – The code test file, contains unit tests

Making the plugin

Choose a pattern from the Popcorn Plugin API section below.

Be sure to eliminate dependencies. A plugin should not require jQuery to run.

Making unit tests

qunit is used for unit tests. The unit test files are only necessary if you wish to make your plugin an official popcorn.js plugin and get it reviewed.

Popcorn Plugin API

Popcorn also offers a plugin factory. Popcorn plugins are a way for developers to wrap functionality that responds to a point in a video. Pattern 1 below lets you manage time updating by your self, where as patterns 2 and 3 offer a structure to manage your video events for you.

Plugin Manifest Interface for Butter

Butter, popcorn’s point and click authoring tool offers plugin authors a turnkey interface to it’s UI through plugin manifests as demonstrated below: