',
''];
// Restart button
if (_inArray(config.controls, 'restart')) {
html.push(
''
);
}
// Rewind button
if (_inArray(config.controls, 'rewind')) {
html.push(
''
);
}
// Play/pause button
if (_inArray(config.controls, 'play')) {
html.push(
'',
''
);
}
// Fast forward button
if (_inArray(config.controls, 'fast-forward')) {
html.push(
''
);
}
// Media current time display
if (_inArray(config.controls, 'current-time')) {
html.push(
'',
'' + config.i18n.currentTime + '',
'00:00',
''
);
}
// Media duration display
if (_inArray(config.controls, 'duration')) {
html.push(
'',
'' + config.i18n.duration + '',
'00:00',
''
);
}
// Close left controls
html.push(
'',
''
);
// Toggle mute button
if (_inArray(config.controls, 'mute')) {
html.push(
''
);
}
// Volume range control
if (_inArray(config.controls, 'volume')) {
html.push(
'',
''
);
}
// Toggle captions button
if (_inArray(config.controls, 'captions')) {
html.push(
''
);
}
// Toggle fullscreen button
if (_inArray(config.controls, 'fullscreen')) {
html.push(
''
);
}
// Close everything
html.push(
'',
'
'
);
return html.join('');
}
// Debugging
function _log(text, error) {
if (config.debug && window.console) {
console[(error ? 'error' : 'log')](text);
}
}
// Credits: http://paypal.github.io/accessible-html5-video-player/
// Unfortunately, due to mixed support, UA sniffing is required
function _browserSniff() {
var nAgt = navigator.userAgent,
name = navigator.appName,
fullVersion = '' + parseFloat(navigator.appVersion),
majorVersion = parseInt(navigator.appVersion, 10),
nameOffset,
verOffset,
ix;
// MSIE 11
if ((navigator.appVersion.indexOf('Windows NT') !== -1) && (navigator.appVersion.indexOf('rv:11') !== -1)) {
name = 'IE';
fullVersion = '11;';
}
// MSIE
else if ((verOffset=nAgt.indexOf('MSIE')) !== -1) {
name = 'IE';
fullVersion = nAgt.substring(verOffset + 5);
}
// Chrome
else if ((verOffset=nAgt.indexOf('Chrome')) !== -1) {
name = 'Chrome';
fullVersion = nAgt.substring(verOffset + 7);
}
// Safari
else if ((verOffset=nAgt.indexOf('Safari')) !== -1) {
name = 'Safari';
fullVersion = nAgt.substring(verOffset + 7);
if ((verOffset=nAgt.indexOf('Version')) !== -1) {
fullVersion = nAgt.substring(verOffset + 8);
}
}
// Firefox
else if ((verOffset=nAgt.indexOf('Firefox')) !== -1) {
name = 'Firefox';
fullVersion = nAgt.substring(verOffset + 8);
}
// In most other browsers, 'name/version' is at the end of userAgent
else if ((nameOffset=nAgt.lastIndexOf(' ') + 1) < (verOffset=nAgt.lastIndexOf('/'))) {
name = nAgt.substring(nameOffset,verOffset);
fullVersion = nAgt.substring(verOffset + 1);
if (name.toLowerCase() == name.toUpperCase()) {
name = navigator.appName;
}
}
// Trim the fullVersion string at semicolon/space if present
if ((ix = fullVersion.indexOf(';')) !== -1) {
fullVersion = fullVersion.substring(0, ix);
}
if ((ix = fullVersion.indexOf(' ')) !== -1) {
fullVersion = fullVersion.substring(0, ix);
}
// Get major version
majorVersion = parseInt('' + fullVersion, 10);
if (isNaN(majorVersion)) {
fullVersion = '' + parseFloat(navigator.appVersion);
majorVersion = parseInt(navigator.appVersion, 10);
}
// Return data
return {
name: name,
version: majorVersion,
ios: /(iPad|iPhone|iPod)/g.test(navigator.platform)
};
}
// Check for mime type support against a player instance
// Credits: http://diveintohtml5.info/everything.html
// Related: http://www.leanbackplyr.com/test/h5mt.html
function _supportMime(plyr, mimeType) {
var media = plyr.media;
// Only check video types for video players
if (plyr.type == 'video') {
// Check type
switch (mimeType) {
case 'video/webm': return !!(media.canPlayType && media.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/, ''));
case 'video/mp4': return !!(media.canPlayType && media.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/, ''));
case 'video/ogg': return !!(media.canPlayType && media.canPlayType('video/ogg; codecs="theora"').replace(/no/, ''));
}
}
// Only check audio types for audio players
else if (plyr.type == 'audio') {
// Check type
switch (mimeType) {
case 'audio/mpeg': return !!(media.canPlayType && media.canPlayType('audio/mpeg;').replace(/no/, ''));
case 'audio/ogg': return !!(media.canPlayType && media.canPlayType('audio/ogg; codecs="vorbis"').replace(/no/, ''));
case 'audio/wav': return !!(media.canPlayType && media.canPlayType('audio/wav; codecs="1"').replace(/no/, ''));
}
}
// If we got this far, we're stuffed
return false;
}
// Inject a script
function _injectScript(source) {
if (document.querySelectorAll('script[src="' + source + '"]').length) {
return;
}
var tag = document.createElement('script');
tag.src = source;
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
}
// Element exists in an array
function _inArray(haystack, needle) {
return Array.prototype.indexOf && (haystack.indexOf(needle) != -1);
}
// Replace all
function _replaceAll(string, find, replace) {
return string.replace(new RegExp(find.replace(/([.*+?\^=!:${}()|\[\]\/\\])/g, '\\$1'), 'g'), replace);
}
// Wrap an element
function _wrap(elements, wrapper) {
// Convert `elements` to an array, if necessary.
if (!elements.length) {
elements = [elements];
}
// Loops backwards to prevent having to clone the wrapper on the
// first element (see `child` below).
for (var i = elements.length - 1; i >= 0; i--) {
var child = (i > 0) ? wrapper.cloneNode(true) : wrapper;
var element = elements[i];
// Cache the current parent and sibling.
var parent = element.parentNode;
var sibling = element.nextSibling;
// Wrap the element (is automatically removed from its current
// parent).
child.appendChild(element);
// If the element had a sibling, insert the wrapper before
// the sibling to maintain the HTML structure; otherwise, just
// append it to the parent.
if (sibling) {
parent.insertBefore(child, sibling);
}
else {
parent.appendChild(child);
}
}
}
// Unwrap an element
// http://plainjs.com/javascript/manipulation/unwrap-a-dom-element-35/
function _unwrap(wrapper) {
// Get the element's parent node
var parent = wrapper.parentNode;
// Move all children out of the element
while (wrapper.firstChild) {
parent.insertBefore(wrapper.firstChild, wrapper);
}
// Remove the empty element
parent.removeChild(wrapper);
}
// Remove an element
function _remove(element) {
element.parentNode.removeChild(element);
}
// Prepend child
function _prependChild(parent, element) {
parent.insertBefore(element, parent.firstChild);
}
// Set attributes
function _setAttributes(element, attributes) {
for (var key in attributes) {
element.setAttribute(key, (typeof attributes[key] === 'boolean' && attributes[key]) ? '' : attributes[key]);
}
}
// Insert a HTML element
function _insertElement(type, parent, attributes) {
// Create a new
var element = document.createElement(type);
// Set all passed attributes
_setAttributes(element, attributes);
// Inject the new element
_prependChild(parent, element);
}
// Get a classname from selector
function _getClassname(selector) {
return selector.replace('.', '');
}
// Toggle class on an element
function _toggleClass(element, name, state) {
if (element) {
if (element.classList) {
element.classList[state ? 'add' : 'remove'](name);
}
else {
var className = (' ' + element.className + ' ').replace(/\s+/g, ' ').replace(' ' + name + ' ', '');
element.className = className + (state ? ' ' + name : '');
}
}
}
// Toggle event
function _toggleHandler(element, events, callback, toggle) {
var eventList = events.split(' ');
// If a nodelist is passed, call itself on each node
if (element instanceof NodeList) {
for (var x = 0; x < element.length; x++) {
if (element[x] instanceof Node) {
_toggleHandler(element[x], arguments[1], arguments[2], arguments[3]);
}
}
return;
}
// If a single node is passed, bind the event listener
for (var i = 0; i < eventList.length; i++) {
element[toggle ? 'addEventListener' : 'removeEventListener'](eventList[i], callback, false);
}
}
// Bind event
function _on(element, events, callback) {
if (element) {
_toggleHandler(element, events, callback, true);
}
}
// Unbind event
function _off(element, events, callback) {
if (element) {
_toggleHandler(element, events, callback, false);
}
}
// Trigger event
function _triggerEvent(element, event) {
// Create faux event
var fauxEvent = document.createEvent('MouseEvents');
// Set the event type
fauxEvent.initEvent(event, true, true);
// Dispatch the event
element.dispatchEvent(fauxEvent);
}
// Toggle aria-pressed state on a toggle button
function _toggleState(target, state) {
// Get state
state = (typeof state === 'boolean' ? state : !target.getAttribute('aria-pressed'));
// Set the attribute on target
target.setAttribute('aria-pressed', state);
return state;
}
// Get percentage
function _getPercentage(current, max) {
if (current === 0 || max === 0 || isNaN(current) || isNaN(max)) {
return 0;
}
return ((current / max) * 100).toFixed(2);
}
// Deep extend/merge two Objects
// http://andrewdupont.net/2009/08/28/deep-extending-objects-in-javascript/
// Removed call to arguments.callee (used explicit function name instead)
function _extend(destination, source) {
for (var property in source) {
if (source[property] && source[property].constructor && source[property].constructor === Object) {
destination[property] = destination[property] || {};
_extend(destination[property], source[property]);
}
else {
destination[property] = source[property];
}
}
return destination;
}
// Fullscreen API
function _fullscreen() {
var fullscreen = {
supportsFullScreen: false,
isFullScreen: function() { return false; },
requestFullScreen: function() {},
cancelFullScreen: function() {},
fullScreenEventName: '',
element: null,
prefix: ''
},
browserPrefixes = 'webkit moz o ms khtml'.split(' ');
// Check for native support
if (typeof document.cancelFullScreen !== 'undefined') {
fullscreen.supportsFullScreen = true;
}
else {
// Check for fullscreen support by vendor prefix
for (var i = 0, il = browserPrefixes.length; i < il; i++ ) {
fullscreen.prefix = browserPrefixes[i];
if (typeof document[fullscreen.prefix + 'CancelFullScreen'] !== 'undefined') {
fullscreen.supportsFullScreen = true;
break;
}
// Special case for MS (when isn't it?)
else if (typeof document.msExitFullscreen !== 'undefined' && document.msFullscreenEnabled) {
fullscreen.prefix = 'ms';
fullscreen.supportsFullScreen = true;
break;
}
}
}
// Update methods to do something useful
if (fullscreen.supportsFullScreen) {
// Yet again Microsoft awesomeness,
// Sometimes the prefix is 'ms', sometimes 'MS' to keep you on your toes
fullscreen.fullScreenEventName = (fullscreen.prefix == 'ms' ? 'MSFullscreenChange' : fullscreen.prefix + 'fullscreenchange');
fullscreen.isFullScreen = function(element) {
if (typeof element === 'undefined') {
element = document.body;
}
switch (this.prefix) {
case '':
return document.fullscreenElement == element;
case 'moz':
return document.mozFullScreenElement == element;
default:
return document[this.prefix + 'FullscreenElement'] == element;
}
};
fullscreen.requestFullScreen = function(element) {
if (typeof element === 'undefined') {
element = document.body;
}
return (this.prefix === '') ? element.requestFullScreen() : element[this.prefix + (this.prefix == 'ms' ? 'RequestFullscreen' : 'RequestFullScreen')]();
};
fullscreen.cancelFullScreen = function() {
return (this.prefix === '') ? document.cancelFullScreen() : document[this.prefix + (this.prefix == 'ms' ? 'ExitFullscreen' : 'CancelFullScreen')]();
};
fullscreen.element = function() {
return (this.prefix === '') ? document.fullscreenElement : document[this.prefix + 'FullscreenElement'];
};
}
return fullscreen;
}
// Local storage
function _storage() {
var storage = {
supported: (function() {
try {
return 'localStorage' in window && window.localStorage !== null;
}
catch(e) {
return false;
}
})()
};
return storage;
}
// Player instance
function Plyr(container) {
var plyr = this;
plyr.container = container;
// Captions functions
// Seek the manual caption time and update UI
function _seekManualCaptions(time) {
// If it's not video, or we're using textTracks, bail.
if (plyr.usingTextTracks || plyr.type !== 'video' || !plyr.supported.full) {
return;
}
// Reset subcount
plyr.subcount = 0;
// Check time is a number, if not use currentTime
// IE has a bug where currentTime doesn't go to 0
// https://twitter.com/Sam_Potts/status/573715746506731521
time = typeof time === 'number' ? time : plyr.media.currentTime;
// If there's no subs available, bail
if (!plyr.captions[plyr.subcount]) {
return;
}
while (_timecodeMax(plyr.captions[plyr.subcount][0]) < time.toFixed(1)) {
plyr.subcount++;
if (plyr.subcount > plyr.captions.length-1) {
plyr.subcount = plyr.captions.length-1;
break;
}
}
// Check if the next caption is in the current time range
if (plyr.media.currentTime.toFixed(1) >= _timecodeMin(plyr.captions[plyr.subcount][0]) &&
plyr.media.currentTime.toFixed(1) <= _timecodeMax(plyr.captions[plyr.subcount][0])) {
plyr.currentCaption = plyr.captions[plyr.subcount][1];
// Trim caption text
var content = plyr.currentCaption.trim();
// Render the caption (only if changed)
if (plyr.captionsContainer.innerHTML != content) {
// Empty caption
// Otherwise NVDA reads it twice
plyr.captionsContainer.innerHTML = '';
// Set new caption text
plyr.captionsContainer.innerHTML = content;
}
}
else {
plyr.captionsContainer.innerHTML = '';
}
}
// Display captions container and button (for initialization)
function _showCaptions() {
// If there's no caption toggle, bail
if (!plyr.buttons.captions) {
return;
}
_toggleClass(plyr.container, config.classes.captions.enabled, true);
if (config.captions.defaultActive) {
_toggleClass(plyr.container, config.classes.captions.active, true);
_toggleState(plyr.buttons.captions, true);
}
}
// Utilities for caption time codes
function _timecodeMin(tc) {
var tcpair = [];
tcpair = tc.split(' --> ');
return _subTcSecs(tcpair[0]);
}
function _timecodeMax(tc) {
var tcpair = [];
tcpair = tc.split(' --> ');
return _subTcSecs(tcpair[1]);
}
function _subTcSecs(tc) {
if (tc === null || tc === undefined) {
return 0;
}
else {
var tc1 = [],
tc2 = [],
seconds;
tc1 = tc.split(',');
tc2 = tc1[0].split(':');
seconds = Math.floor(tc2[0]*60*60) + Math.floor(tc2[1]*60) + Math.floor(tc2[2]);
return seconds;
}
}
// Find all elements
function _getElements(selector) {
return plyr.container.querySelectorAll(selector);
}
// Find a single element
function _getElement(selector) {
return _getElements(selector)[0];
}
// Determine if we're in an iframe
function _inFrame() {
try {
return window.self !== window.top;
}
catch (e) {
return true;
}
}
// Insert controls
function _injectControls() {
// Make a copy of the html
var html = config.html;
// Insert custom video controls
_log('Injecting custom controls.');
// If no controls are specified, create default
if (!html) {
html = _buildControls();
}
// Replace seek time instances
html = _replaceAll(html, '{seektime}', config.seekTime);
// Replace all id references with random numbers
html = _replaceAll(html, '{id}', Math.floor(Math.random() * (10000)));
// Inject into the container
plyr.container.insertAdjacentHTML('beforeend', html);
// Setup tooltips
if (config.tooltips) {
var labels = _getElements(config.selectors.labels);
for (var i = labels.length - 1; i >= 0; i--) {
var label = labels[i];
_toggleClass(label, config.classes.hidden, false);
_toggleClass(label, config.classes.tooltip, true);
}
}
}
// Find the UI controls and store references
function _findElements() {
try {
plyr.controls = _getElement(config.selectors.controls);
// Buttons
plyr.buttons = {};
plyr.buttons.seek = _getElement(config.selectors.buttons.seek);
plyr.buttons.play = _getElement(config.selectors.buttons.play);
plyr.buttons.pause = _getElement(config.selectors.buttons.pause);
plyr.buttons.restart = _getElement(config.selectors.buttons.restart);
plyr.buttons.rewind = _getElement(config.selectors.buttons.rewind);
plyr.buttons.forward = _getElement(config.selectors.buttons.forward);
plyr.buttons.fullscreen = _getElement(config.selectors.buttons.fullscreen);
// Inputs
plyr.buttons.mute = _getElement(config.selectors.buttons.mute);
plyr.buttons.captions = _getElement(config.selectors.buttons.captions);
plyr.checkboxes = _getElements('[type="checkbox"]');
// Progress
plyr.progress = {};
plyr.progress.container = _getElement(config.selectors.progress.container);
// Progress - Buffering
plyr.progress.buffer = {};
plyr.progress.buffer.bar = _getElement(config.selectors.progress.buffer);
plyr.progress.buffer.text = plyr.progress.buffer.bar && plyr.progress.buffer.bar.getElementsByTagName('span')[0];
// Progress - Played
plyr.progress.played = {};
plyr.progress.played.bar = _getElement(config.selectors.progress.played);
plyr.progress.played.text = plyr.progress.played.bar && plyr.progress.played.bar.getElementsByTagName('span')[0];
// Volume
plyr.volume = _getElement(config.selectors.buttons.volume);
// Timing
plyr.duration = _getElement(config.selectors.duration);
plyr.currentTime = _getElement(config.selectors.currentTime);
plyr.seekTime = _getElements(config.selectors.seekTime);
return true;
}
catch(e) {
_log('It looks like there\'s a problem with your controls html. Bailing.', true);
// Restore native video controls
plyr.media.setAttribute('controls', '');
return false;
}
}
// Setup aria attribute for play
function _setupPlayAria() {
// If there's no play button, bail
if (!plyr.buttons.play) {
return;
}
// Find the current text
var label = plyr.buttons.play.innerText || config.i18n.play;
// If there's a media title set, use that for the label
if (typeof(config.title) !== 'undefined' && config.title.length) {
label += ', ' + config.title;
}
plyr.buttons.play.setAttribute('aria-label', label);
}
// Setup media
function _setupMedia() {
// If there's no media, bail
if (!plyr.media) {
_log('No audio or video element found!', true);
return false;
}
if (plyr.supported.full) {
// Remove native video controls
plyr.media.removeAttribute('controls');
// Add type class
_toggleClass(plyr.container, config.classes.type.replace('{0}', plyr.type), true);
// If there's no autoplay attribute, assume the video is stopped and add state class
_toggleClass(plyr.container, config.classes.stopped, config.autoplay);
// Add iOS class
if (plyr.browser.ios) {
_toggleClass(plyr.container, 'ios', true);
}
// Inject the player wrapper
if (plyr.type === 'video') {
// Create the wrapper div
var wrapper = document.createElement('div');
wrapper.setAttribute('class', config.classes.videoWrapper);
// Wrap the video in a container
_wrap(plyr.media, wrapper);
// Cache the container
plyr.videoContainer = wrapper;
}
}
// Embeds
if (_inArray(config.types.embed, plyr.type)) {
_setupEmbed(plyr.embedId, plyr.type);
// Clean up
plyr.embedId = null;
}
else {
// Autoplay
if (config.autoplay) {
_play();
}
}
}
// Setup YouTube/Vimeo
function _setupEmbed(videoId) {
var container = document.createElement('div'),
id = plyr.type + '-' + Math.floor(Math.random() * (10000));
// Remove old containers
var containers = _getElements('[id^="' + plyr.type + '-"]');
for (var i = containers.length - 1; i >= 0; i--) {
_remove(containers[i]);
}
// Add embed class for responsive
_toggleClass(plyr.media, config.classes.videoWrapper, true);
_toggleClass(plyr.media, config.classes.embedWrapper, true);
// YouTube
if (plyr.type === 'youtube') {
// Create the YouTube container
plyr.media.appendChild(container);
// Set ID
container.setAttribute('id', id);
// Setup API
if (typeof YT === 'object') {
_youTubeReady(videoId, container);
}
else {
// Load the API
_injectScript(config.urls.youtube.api);
// Setup callback for the API
window.onYouTubeIframeAPIReady = function () { _youTubeReady(videoId, container); };
}
}
// Vimeo
else if (plyr.type === 'vimeo') {
// Inject the iframe
var iframe = document.createElement('iframe');
// Watch for iframe load
iframe.loaded = false;
_on(iframe, 'load', function() { iframe.loaded = true; });
_setAttributes(iframe, {
'src': 'https://player.vimeo.com/video/' + videoId + '?player_id=' + id + '&api=1&badge=0&byline=0&portrait=0&title=0',
'id': id,
'webkitallowfullscreen': '',
'mozallowfullscreen': '',
'allowfullscreen': '',
'frameborder': 0
});
container.appendChild(iframe);
plyr.media.appendChild(container);
// Setup API
if (typeof Froogaloop === 'function') {
_on(iframe, 'load', _vimeoReady);
}
else {
// Load the API
_injectScript(config.urls.vimeo.api);
// Wait for fragaloop load
var timer = window.setInterval(function() {
if ('$f' in window && iframe.loaded) {
window.clearInterval(timer);
_vimeoReady.call(iframe);
}
}, 50);
}
}
}
// When embeds are ready
function _embedReady() {
// Inject and update UI
if (plyr.supported.full) {
// Only setup controls once
if (!plyr.container.querySelectorAll(config.selectors.controls).length) {
_setupInterface();
}
}
// Set the volume
_setVolume();
_updateVolume();
}
// Handle YouTube API ready
function _youTubeReady(videoId, container) {
// Setup timers object
// We have to poll YouTube for updates
if (!('timer' in plyr)) {
plyr.timer = {};
}
// Setup instance
// https://developers.google.com/youtube/iframe_api_reference
plyr.embed = new YT.Player(container.id, {
videoId: videoId,
playerVars: {
autoplay: (config.autoplay ? 1 : 0),
controls: (plyr.supported.full ? 0 : 1),
rel: 0,
showinfo: 0,
iv_load_policy: 3,
cc_load_policy: (config.captions.defaultActive ? 1 : 0),
cc_lang_pref: 'en',
wmode: 'transparent',
modestbranding: 1,
disablekb: 1
},
events: {
'onReady': function(event) {
// Get the instance
var instance = event.target;
// Create a faux HTML5 API using the YouTube API
plyr.media.play = function() { instance.playVideo(); };
plyr.media.pause = function() { instance.pauseVideo(); };
plyr.media.stop = function() { instance.stopVideo(); };
plyr.media.duration = instance.getDuration();
plyr.media.paused = !config.autoplay;
plyr.media.currentTime = instance.getCurrentTime();
plyr.media.muted = instance.isMuted();
// Trigger timeupdate
_triggerEvent(plyr.media, 'timeupdate');
// Reset timer
window.clearInterval(plyr.timer.buffering);
// Setup buffering
plyr.timer.buffering = window.setInterval(function() {
// Get loaded % from YouTube
plyr.media.buffered = instance.getVideoLoadedFraction();
// Trigger progress
_triggerEvent(plyr.media, 'progress');
// Bail if we're at 100%
if (plyr.media.buffered === 1) {
window.clearInterval(plyr.timer.buffering);
}
}, 200);
// Update UI
_embedReady();
// Display duration if available
if (config.displayDuration) {
_displayDuration();
}
},
'onStateChange': function(event) {
// Get the instance
var instance = event.target;
// Reset timer
window.clearInterval(plyr.timer.playing);
// Handle events
// -1 Unstarted
// 0 Ended
// 1 Playing
// 2 Paused
// 3 Buffering
// 5 Video cued
switch (event.data) {
case 0:
plyr.media.paused = true;
_triggerEvent(plyr.media, 'ended');
break;
case 1:
plyr.media.paused = false;
_triggerEvent(plyr.media, 'play');
// Poll to get playback progress
plyr.timer.playing = window.setInterval(function() {
// Set the current time
plyr.media.currentTime = instance.getCurrentTime();
// Trigger timeupdate
_triggerEvent(plyr.media, 'timeupdate');
}, 200);
break;
case 2:
plyr.media.paused = true;
_triggerEvent(plyr.media, 'pause');
}
}
}
});
}
// Vimeo ready
function _vimeoReady() {
/* jshint validthis: true */
plyr.embed = $f(this);
// Setup on ready
plyr.embed.addEvent('ready', function() {
// Create a faux HTML5 API using the Vimeo API
plyr.media.play = function() { plyr.embed.api('play'); };
plyr.media.pause = function() { plyr.embed.api('pause'); };
plyr.media.stop = function() { plyr.embed.api('stop') };
plyr.media.paused = !config.autoplay;
plyr.media.currentTime = 0;
// Update UI
_embedReady();
plyr.embed.api('getCurrentTime', function (value) {
plyr.media.currentTime = value;
// Trigger timeupdate
_triggerEvent(plyr.media, 'timeupdate');
});
plyr.embed.api('getDuration', function(value) {
plyr.media.duration = value;
// Display duration if available
if (plyr.supported.full && config.displayDuration) {
_displayDuration();
}
});
plyr.embed.addEvent('play', function() {
plyr.media.paused = false;
_triggerEvent(plyr.media, 'play');
});
plyr.embed.addEvent('pause', function() {
plyr.media.paused = true;
_triggerEvent(plyr.media, 'pause');
});
plyr.embed.addEvent('playProgress', function(data) {
plyr.media.currentTime = data.seconds;
_triggerEvent(plyr.media, 'timeupdate');
});
plyr.embed.addEvent('loadProgress', function(data) {
plyr.media.buffered = data.percent;
_triggerEvent(plyr.media, 'progress');
});
plyr.embed.addEvent('finish', function() {
plyr.media.paused = true;
_triggerEvent(plyr.media, 'ended');
});
// Always seek to 0
//plyr.embed.api('seekTo', 0);
// Prevent autoplay if needed (seek will play)
//if (!config.autoplay) {
// plyr.embed.api('pause');
//}
});
}
// Setup captions
function _setupCaptions() {
if (plyr.type === 'video') {
// Inject the container
if (!_getElement(config.selectors.captions)) {
plyr.videoContainer.insertAdjacentHTML('afterbegin', '
');
}
// Cache selector
plyr.captionsContainer = _getElement(config.selectors.captions).querySelector('span');
// Determine if HTML5 textTracks is supported
plyr.usingTextTracks = false;
if (plyr.media.textTracks) {
plyr.usingTextTracks = true;
}
// Get URL of caption file if exists
var captionSrc = '',
kind,
children = plyr.media.childNodes;
for (var i = 0; i < children.length; i++) {
if (children[i].nodeName.toLowerCase() === 'track') {
kind = children[i].kind;
if (kind === 'captions' || kind === 'subtitles') {
captionSrc = children[i].getAttribute('src');
}
}
}
// Record if caption file exists or not
plyr.captionExists = true;
if (captionSrc === '') {
plyr.captionExists = false;
_log('No caption track found.');
}
else {
_log('Caption track found; URI: ' + captionSrc);
}
// If no caption file exists, hide container for caption text
if (!plyr.captionExists) {
_toggleClass(plyr.container, config.classes.captions.enabled);
}
// If caption file exists, process captions
else {
// Turn off native caption rendering to avoid double captions
// This doesn't seem to work in Safari 7+, so the