Search code examples
popcornjs

Change embed options on Vimeo when using popcorn.js

My question is simple. Can you change the embed options (e.g., hide the title, your avatar, etc) on a vimeo video that is being played via Popcorn.js?

Solution

  • Yes, as long as you use the new Vimeo "wrapper." (The original player modules are being deprecated as of Popcorn 1.4.)

    The wrapper is here:

    https://github.com/mozilla/popcorn-js/blob/master/wrappers/vimeo/popcorn.HTMLVimeoVideoElement.js

    You also need to include this file first.

    By default, the Vimeo wrapper disables the title, byline and portrait.

    Edit: You just need three scripts from the popcorn-js repo, and include them in script tags in this order:

    1. popcorn.js
    2. popcorn._MediaElementProto.js
    3. HTMLVimeoVideoElement.js

    Create a container element in which to put the video:

    <div id="video"></div>

    Instantiate the video wrapper and popcorn:

    var video = Popcorn.HTMLVimeoVideoElement('#video');
video.src = 'vimeo url goes here';
var popcorn = Popcorn(video);