ProximaEntertainment/plyr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Standardized syntax

Browse Source
This commit is contained in:
Calvin Tam 2015-08-12 22:58:33 -07:00
parent 45d4091c20
commit e56132ae3b
1 changed files with 112 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

222
src/js/plyr.js
View File

@ -118,7 +118,7 @@
"<span class='player-controls-left'>"]; "<span class='player-controls-left'>"];
// Restart button // Restart button
if(_inArray(config.controls, "restart")) { if (_inArray(config.controls, "restart")) {
html.push( html.push(
"<button type='button' data-player='restart'>", "<button type='button' data-player='restart'>",
"<svg><use xlink:href='#" + config.iconPrefix + "-restart'></use></svg>", "<svg><use xlink:href='#" + config.iconPrefix + "-restart'></use></svg>",
@ -128,7 +128,7 @@
} }
// Rewind button // Rewind button
if(_inArray(config.controls, "rewind")) { if (_inArray(config.controls, "rewind")) {
html.push( html.push(
"<button type='button' data-player='rewind'>", "<button type='button' data-player='rewind'>",
"<svg><use xlink:href='#" + config.iconPrefix + "-rewind'></use></svg>", "<svg><use xlink:href='#" + config.iconPrefix + "-rewind'></use></svg>",
@ -138,7 +138,7 @@
} }
// Play/pause button // Play/pause button
if(_inArray(config.controls, "play")) { if (_inArray(config.controls, "play")) {
html.push( html.push(
"<button type='button' data-player='play'>", "<button type='button' data-player='play'>",
"<svg><use xlink:href='#" + config.iconPrefix + "-play'></use></svg>", "<svg><use xlink:href='#" + config.iconPrefix + "-play'></use></svg>",
@ -152,7 +152,7 @@
} }
// Fast forward button // Fast forward button
if(_inArray(config.controls, "fast-forward")) { if (_inArray(config.controls, "fast-forward")) {
html.push( html.push(
"<button type='button' data-player='fast-forward'>", "<button type='button' data-player='fast-forward'>",
"<svg><use xlink:href='#" + config.iconPrefix + "-fast-forward'></use></svg>", "<svg><use xlink:href='#" + config.iconPrefix + "-fast-forward'></use></svg>",
@ -162,7 +162,7 @@
} }
// Media current time display // Media current time display
if(_inArray(config.controls, "current-time")) { if (_inArray(config.controls, "current-time")) {
html.push( html.push(
"<span class='player-time'>", "<span class='player-time'>",
"<span class='sr-only'>" + config.i18n.currentTime + "</span>", "<span class='sr-only'>" + config.i18n.currentTime + "</span>",
@ -172,7 +172,7 @@
} }
// Media duration display // Media duration display
if(_inArray(config.controls, "duration")) { if (_inArray(config.controls, "duration")) {
html.push( html.push(
"<span class='player-time'>", "<span class='player-time'>",
"<span class='sr-only'>" + config.i18n.duration + "</span>", "<span class='sr-only'>" + config.i18n.duration + "</span>",
@ -188,7 +188,7 @@
); );
// Toggle mute button // Toggle mute button
if(_inArray(config.controls, "mute")) { if (_inArray(config.controls, "mute")) {
html.push( html.push(
"<button type='button' data-player='mute'>", "<button type='button' data-player='mute'>",
"<svg class='icon-muted'><use xlink:href='#" + config.iconPrefix + "-muted'></use></svg>", "<svg class='icon-muted'><use xlink:href='#" + config.iconPrefix + "-muted'></use></svg>",
@ -199,7 +199,7 @@
} }
// Volume range control // Volume range control
if(_inArray(config.controls, "volume")) { if (_inArray(config.controls, "volume")) {
html.push( html.push(
"<label for='volume{id}' class='sr-only'>" + config.i18n.volume + "</label>", "<label for='volume{id}' class='sr-only'>" + config.i18n.volume + "</label>",
"<input id='volume{id}' class='player-volume' type='range' min='0' max='10' value='5' data-player='volume'>" "<input id='volume{id}' class='player-volume' type='range' min='0' max='10' value='5' data-player='volume'>"
@ -207,7 +207,7 @@
} }
// Toggle captions button // Toggle captions button
if(_inArray(config.controls, "captions")) { if (_inArray(config.controls, "captions")) {
html.push( html.push(
"<button type='button' data-player='captions'>", "<button type='button' data-player='captions'>",
"<svg class='icon-captions-on'><use xlink:href='#" + config.iconPrefix + "-captions-on'></use></svg>", "<svg class='icon-captions-on'><use xlink:href='#" + config.iconPrefix + "-captions-on'></use></svg>",
@ -218,7 +218,7 @@
} }
// Toggle fullscreen button // Toggle fullscreen button
if(_inArray(config.controls, "fullscreen")) { if (_inArray(config.controls, "fullscreen")) {
html.push( html.push(
"<button type='button' data-player='fullscreen'>", "<button type='button' data-player='fullscreen'>",
"<svg class='icon-exit-fullscreen'><use xlink:href='#" + config.iconPrefix + "-exit-fullscreen'></use></svg>", "<svg class='icon-exit-fullscreen'><use xlink:href='#" + config.iconPrefix + "-exit-fullscreen'></use></svg>",
@ -239,7 +239,7 @@
// Debugging // Debugging
function _log(text, error) { function _log(text, error) {
if(config.debug && window.console) { if (config.debug && window.console) {
console[(error ? "error" : "log")](text); console[(error ? "error" : "log")](text);
} }
} }
@ -321,7 +321,7 @@
var media = player.media; var media = player.media;
// Only check video types for video players // Only check video types for video players
if(player.type == "video") { if (player.type == "video") {
// Check type // Check type
switch(mimeType) { switch(mimeType) {
case "video/webm": return !!(media.canPlayType && media.canPlayType("video/webm; codecs=\"vp8, vorbis\"").replace(/no/, "")); case "video/webm": return !!(media.canPlayType && media.canPlayType("video/webm; codecs=\"vp8, vorbis\"").replace(/no/, ""));
@ -331,7 +331,7 @@
} }
// Only check audio types for audio players // Only check audio types for audio players
else if(player.type == "audio") { else if (player.type == "audio") {
// Check type // Check type
switch(mimeType) { switch(mimeType) {
case "audio/mpeg": return !!(media.canPlayType && media.canPlayType("audio/mpeg;").replace(/no/, "")); case "audio/mpeg": return !!(media.canPlayType && media.canPlayType("audio/mpeg;").replace(/no/, ""));
@ -346,7 +346,7 @@
// Inject a script // Inject a script
function _injectScript(source) { function _injectScript(source) {
if(document.querySelectorAll("script[src='" + source + "']").length) { if (document.querySelectorAll("script[src='" + source + "']").length) {
return; return;
} }
@ -426,15 +426,15 @@
// Set attributes // Set attributes
function _setAttributes(element, attributes) { function _setAttributes(element, attributes) {
for(var key in attributes) { for (var key in attributes) {
element.setAttribute(key, attributes[key]); element.setAttribute(key, attributes[key]);
} }
} }
// Toggle class on an element // Toggle class on an element
function _toggleClass(element, name, state) { function _toggleClass(element, name, state) {
if(element){ if (element) {
if(element.classList) { if (element.classList) {
element.classList[state ? "add" : "remove"](name); element.classList[state ? "add" : "remove"](name);
} }
else { else {
@ -449,7 +449,7 @@
var eventList = events.split(" "); var eventList = events.split(" ");
// If a nodelist is passed, call itself on each node // If a nodelist is passed, call itself on each node
if(element instanceof NodeList) { if (element instanceof NodeList) {
for (var x = 0; x < element.length; x++) { for (var x = 0; x < element.length; x++) {
if (element[x] instanceof Node) { if (element[x] instanceof Node) {
_toggleHandler(element[x], arguments[1], arguments[2], arguments[3]); _toggleHandler(element[x], arguments[1], arguments[2], arguments[3]);
@ -466,14 +466,14 @@
// Bind event // Bind event
function _on(element, events, callback) { function _on(element, events, callback) {
if(element) { if (element) {
_toggleHandler(element, events, callback, true); _toggleHandler(element, events, callback, true);
} }
} }
// Unbind event // Unbind event
function _off(element, events, callback) { function _off(element, events, callback) {
if(element) { if (element) {
_toggleHandler(element, events, callback, false); _toggleHandler(element, events, callback, false);
} }
} }
@ -503,7 +503,7 @@
// Get percentage // Get percentage
function _getPercentage(current, max) { function _getPercentage(current, max) {
if(current === 0 || max === 0 || isNaN(current) || isNaN(max)) { if (current === 0 || max === 0 || isNaN(current) || isNaN(max)) {
return 0; return 0;
} }
return ((current / max) * 100).toFixed(2); return ((current / max) * 100).toFixed(2);
@ -567,7 +567,7 @@
fullscreen.fullScreenEventName = (fullscreen.prefix == "ms" ? "MSFullscreenChange" : fullscreen.prefix + "fullscreenchange"); fullscreen.fullScreenEventName = (fullscreen.prefix == "ms" ? "MSFullscreenChange" : fullscreen.prefix + "fullscreenchange");
fullscreen.isFullScreen = function(element) { fullscreen.isFullScreen = function(element) {
if(typeof element == "undefined") { if (typeof element == "undefined") {
element = document.body; element = document.body;
} }
switch (this.prefix) { switch (this.prefix) {
@ -580,7 +580,7 @@
} }
}; };
fullscreen.requestFullScreen = function(element) { fullscreen.requestFullScreen = function(element) {
if(typeof element == "undefined") { if (typeof element == "undefined") {
element = document.body; element = document.body;
} }
return (this.prefix === "") ? element.requestFullScreen() : element[this.prefix + (this.prefix == "ms" ? "RequestFullscreen" : "RequestFullScreen")](); return (this.prefix === "") ? element.requestFullScreen() : element[this.prefix + (this.prefix == "ms" ? "RequestFullscreen" : "RequestFullScreen")]();
@ -649,7 +649,7 @@
var content = player.currentCaption.trim(); var content = player.currentCaption.trim();
// Render the caption (only if changed) // Render the caption (only if changed)
if(player.captionsContainer.innerHTML != content) { if (player.captionsContainer.innerHTML != content) {
// Empty caption // Empty caption
// Otherwise NVDA reads it twice // Otherwise NVDA reads it twice
player.captionsContainer.innerHTML = ""; player.captionsContainer.innerHTML = "";
@ -666,7 +666,7 @@
// Display captions container and button (for initialization) // Display captions container and button (for initialization)
function _showCaptions() { function _showCaptions() {
// If there's no caption toggle, bail // If there's no caption toggle, bail
if(!player.buttons.captions) { if (!player.buttons.captions) {
return; return;
} }
@ -733,7 +733,7 @@
_log("Injecting custom controls."); _log("Injecting custom controls.");
// If no controls are specified, create default // If no controls are specified, create default
if(!html) { if (!html) {
html = _buildControls(); html = _buildControls();
} }
@ -747,7 +747,7 @@
player.container.insertAdjacentHTML("beforeend", html); player.container.insertAdjacentHTML("beforeend", html);
// Setup tooltips // Setup tooltips
if(config.tooltips) { if (config.tooltips) {
var labels = _getElements(config.selectors.labels); var labels = _getElements(config.selectors.labels);
for (var i = labels.length - 1; i >= 0; i--) { for (var i = labels.length - 1; i >= 0; i--) {
@ -816,7 +816,7 @@
// Setup aria attribute for play // Setup aria attribute for play
function _setupPlayAria() { function _setupPlayAria() {
// If there's no play button, bail // If there's no play button, bail
if(!player.buttons.play) { if (!player.buttons.play) {
return; return;
} }
@ -834,12 +834,12 @@
// Setup media // Setup media
function _setupMedia() { function _setupMedia() {
// If there's no media, bail // If there's no media, bail
if(!player.media) { if (!player.media) {
_log("No audio or video element found!", true); _log("No audio or video element found!", true);
return false; return false;
} }
if(player.supported.full) { if (player.supported.full) {
// Remove native video controls // Remove native video controls
player.media.removeAttribute("controls"); player.media.removeAttribute("controls");
@ -850,12 +850,12 @@
_toggleClass(player.container, config.classes.stopped, (player.media.getAttribute("autoplay") === null)); _toggleClass(player.container, config.classes.stopped, (player.media.getAttribute("autoplay") === null));
// Add iOS class // Add iOS class
if(player.browser.ios) { if (player.browser.ios) {
_toggleClass(player.container, "ios", true); _toggleClass(player.container, "ios", true);
} }
// Inject the player wrapper // Inject the player wrapper
if(player.type === "video") { if (player.type === "video") {
// Create the wrapper div // Create the wrapper div
var wrapper = document.createElement("div"); var wrapper = document.createElement("div");
wrapper.setAttribute("class", config.classes.videoWrapper); wrapper.setAttribute("class", config.classes.videoWrapper);
@ -869,12 +869,12 @@
} }
// YouTube // YouTube
if(player.type == "youtube") { if (player.type == "youtube") {
_setupYouTube(player.media.getAttribute("data-video-id")); _setupYouTube(player.media.getAttribute("data-video-id"));
} }
// Autoplay // Autoplay
if(player.media.getAttribute("autoplay") !== null) { if (player.media.getAttribute("autoplay") !== null) {
_play(); _play();
} }
} }
@ -896,7 +896,7 @@
_toggleClass(player.media, config.classes.videoWrapper, true); _toggleClass(player.media, config.classes.videoWrapper, true);
_toggleClass(player.media, config.classes.embedWrapper, true); _toggleClass(player.media, config.classes.embedWrapper, true);
if(typeof YT === "object") { if (typeof YT === "object") {
_YTReady(id, container); _YTReady(id, container);
} }
else { else {
@ -914,7 +914,7 @@
// Setup timers object // Setup timers object
// We have to poll YouTube for updates // We have to poll YouTube for updates
if(!("timer" in player)) { if (!("timer" in player)) {
player.timer = {}; player.timer = {};
} }
@ -963,19 +963,19 @@
_triggerEvent(player.media, "progress"); _triggerEvent(player.media, "progress");
// Bail if we're at 100% // Bail if we're at 100%
if(player.media.buffered === 1) { if (player.media.buffered === 1) {
window.clearInterval(player.timer.buffering); window.clearInterval(player.timer.buffering);
} }
}, 200); }, 200);
if(player.supported.full) { if (player.supported.full) {
// Only setup controls once // Only setup controls once
if(!player.container.querySelectorAll(config.selectors.controls).length) { if (!player.container.querySelectorAll(config.selectors.controls).length) {
_setupInterface(); _setupInterface();
} }
// Display duration if available // Display duration if available
if(config.displayDuration) { if (config.displayDuration) {
_displayDuration(); _displayDuration();
} }
} }
@ -1027,7 +1027,7 @@
// Setup captions // Setup captions
function _setupCaptions() { function _setupCaptions() {
if(player.type === "video") { if (player.type === "video") {
// Inject the container // Inject the container
player.videoContainer.insertAdjacentHTML("afterbegin", "<div class='" + config.selectors.captions.replace(".", "") + "'><span></span></div>"); player.videoContainer.insertAdjacentHTML("afterbegin", "<div class='" + config.selectors.captions.replace(".", "") + "'><span></span></div>");
@ -1073,7 +1073,7 @@
// Turn off native caption rendering to avoid double captions // Turn off native caption rendering to avoid double captions
// This doesn't seem to work in Safari 7+, so the <track> elements are removed from the dom below // This doesn't seem to work in Safari 7+, so the <track> elements are removed from the dom below
var tracks = player.media.textTracks; var tracks = player.media.textTracks;
for (var x=0; x < tracks.length; x++) { for (var x = 0; x < tracks.length; x++) {
tracks[x].mode = "hidden"; tracks[x].mode = "hidden";
} }
@ -1097,7 +1097,7 @@
if (player.usingTextTracks) { if (player.usingTextTracks) {
_log("TextTracks supported."); _log("TextTracks supported.");
for (var y=0; y < tracks.length; y++) { for (var y = 0; y < tracks.length; y++) {
var track = tracks[y]; var track = tracks[y];
if (track.kind === "captions" || track.kind === "subtitles") { if (track.kind === "captions" || track.kind === "subtitles") {
@ -1134,7 +1134,7 @@
records = req.split("\n\n"); records = req.split("\n\n");
for (var r=0; r < records.length; r++) { for (var r = 0; r < records.length; r++) {
record = records[r]; record = records[r];
player.captions[r] = []; player.captions[r] = [];
player.captions[r] = record.split("\n"); player.captions[r] = record.split("\n");
@ -1165,7 +1165,7 @@
tracks = player.media.getElementsByTagName("track"); tracks = player.media.getElementsByTagName("track");
// Loop through and remove one by one // Loop through and remove one by one
for (var t=0; t < tracks.length; t++) { for (var t = 0; t < tracks.length; t++) {
player.media.removeChild(tracks[t]); player.media.removeChild(tracks[t]);
} }
} }
@ -1175,11 +1175,11 @@
// Setup fullscreen // Setup fullscreen
function _setupFullscreen() { function _setupFullscreen() {
if(player.type != "audio" && config.fullscreen.enabled) { if (player.type != "audio" && config.fullscreen.enabled) {
// Check for native support // Check for native support
var nativeSupport = fullscreen.supportsFullScreen; var nativeSupport = fullscreen.supportsFullScreen;
if(nativeSupport || (config.fullscreen.fallback && !_inFrame())) { if (nativeSupport || (config.fullscreen.fallback && !_inFrame())) {
_log((nativeSupport ? "Native" : "Fallback") + " fullscreen enabled."); _log((nativeSupport ? "Native" : "Fallback") + " fullscreen enabled.");
// Add styling hook // Add styling hook
@ -1193,7 +1193,7 @@
_toggleState(player.buttons.fullscreen, false); _toggleState(player.buttons.fullscreen, false);
// Set control hide class hook // Set control hide class hook
if(config.fullscreen.hideControls) { if (config.fullscreen.hideControls) {
_toggleClass(player.container, config.classes.fullscreen.hideControls, true); _toggleClass(player.container, config.classes.fullscreen.hideControls, true);
} }
} }
@ -1212,11 +1212,11 @@
// Toggle playback // Toggle playback
function _togglePlay(toggle) { function _togglePlay(toggle) {
// Play // Play
if(toggle === true) { if (toggle === true) {
_play(); _play();
} }
// Pause // Pause
else if(toggle === false) { else if (toggle === false) {
_pause(); _pause();
} }
// True toggle // True toggle
@ -1228,7 +1228,7 @@
// Rewind // Rewind
function _rewind(seekTime) { function _rewind(seekTime) {
// Use default if needed // Use default if needed
if(typeof seekTime !== "number") { if (typeof seekTime !== "number") {
seekTime = config.seekTime; seekTime = config.seekTime;
} }
_seek(player.media.currentTime - seekTime); _seek(player.media.currentTime - seekTime);
@ -1237,7 +1237,7 @@
// Fast forward // Fast forward
function _forward(seekTime) { function _forward(seekTime) {
// Use default if needed // Use default if needed
if(typeof seekTime !== "number") { if (typeof seekTime !== "number") {
seekTime = config.seekTime; seekTime = config.seekTime;
} }
_seek(player.media.currentTime + seekTime); _seek(player.media.currentTime + seekTime);
@ -1276,10 +1276,10 @@
catch(e) {} catch(e) {}
// YouTube // YouTube
if(player.type == "youtube") { if (player.type == "youtube") {
player.embed.seekTo(targetTime); player.embed.seekTo(targetTime);
if(paused) { if (paused) {
_pause(); _pause();
} }
@ -1306,13 +1306,13 @@
var nativeSupport = fullscreen.supportsFullScreen; var nativeSupport = fullscreen.supportsFullScreen;
// If it's a fullscreen change event, it's probably a native close // If it's a fullscreen change event, it's probably a native close
if(event && event.type === fullscreen.fullScreenEventName) { if (event && event.type === fullscreen.fullScreenEventName) {
player.isFullscreen = fullscreen.isFullScreen(player.container); player.isFullscreen = fullscreen.isFullScreen(player.container);
} }
// If there's native support, use it // If there's native support, use it
else if(nativeSupport) { else if (nativeSupport) {
// Request fullscreen // Request fullscreen
if(!fullscreen.isFullScreen(player.container)) { if (!fullscreen.isFullScreen(player.container)) {
fullscreen.requestFullScreen(player.container); fullscreen.requestFullScreen(player.container);
} }
// Bail from fullscreen // Bail from fullscreen
@ -1328,7 +1328,7 @@
player.isFullscreen = !player.isFullscreen; player.isFullscreen = !player.isFullscreen;
// Bind/unbind escape key // Bind/unbind escape key
if(player.isFullscreen) { if (player.isFullscreen) {
_on(document, "keyup", _handleEscapeFullscreen); _on(document, "keyup", _handleEscapeFullscreen);
document.body.style.overflow = "hidden"; document.body.style.overflow = "hidden";
} }
@ -1356,7 +1356,7 @@
window.clearTimeout(hoverTimer); window.clearTimeout(hoverTimer);
// If the mouse is not over the controls, set a timeout to hide them // If the mouse is not over the controls, set a timeout to hide them
if(!isMouseOver) { if (!isMouseOver) {
hoverTimer = window.setTimeout(function() { hoverTimer = window.setTimeout(function() {
_toggleClass(player.container, config.classes.hover, false); _toggleClass(player.container, config.classes.hover, false);
}, 2000); }, 2000);
@ -1368,7 +1368,7 @@
isMouseOver = (event.type === "mouseenter"); isMouseOver = (event.type === "mouseenter");
} }
if(config.fullscreen.hideControls) { if (config.fullscreen.hideControls) {
// Hide on entering full screen // Hide on entering full screen
_toggleClass(player.controls, config.classes.hover, false); _toggleClass(player.controls, config.classes.hover, false);
@ -1383,7 +1383,7 @@
// Bail from faux-fullscreen // Bail from faux-fullscreen
function _handleEscapeFullscreen(event) { function _handleEscapeFullscreen(event) {
// If it's a keypress and not escape, bail // If it's a keypress and not escape, bail
if((event.which || event.charCode || event.keyCode) === 27 && player.isFullscreen) { if ((event.which || event.charCode || event.keyCode) === 27 && player.isFullscreen) {
_toggleFullscreen(); _toggleFullscreen();
} }
} }
@ -1391,8 +1391,8 @@
// Set volume // Set volume
function _setVolume(volume) { function _setVolume(volume) {
// Use default if no value specified // Use default if no value specified
if(typeof volume === "undefined") { if (typeof volume === "undefined") {
if(config.storage.enabled && _storage().supported) { if (config.storage.enabled && _storage().supported) {
volume = window.localStorage[config.storage.key] || config.volume; volume = window.localStorage[config.storage.key] || config.volume;
} }
else { else {
@ -1401,11 +1401,11 @@
} }
// Maximum is 10 // Maximum is 10
if(volume > 10) { if (volume > 10) {
volume = 10; volume = 10;
} }
// Minimum is 0 // Minimum is 0
if(volume < 0) { if (volume < 0) {
volume = 0; volume = 0;
} }
@ -1413,7 +1413,7 @@
player.media.volume = parseFloat(volume / 10); player.media.volume = parseFloat(volume / 10);
// YouTube // YouTube
if(player.type == "youtube") { if (player.type == "youtube") {
player.embed.setVolume(player.media.volume * 100); player.embed.setVolume(player.media.volume * 100);
// Trigger timeupdate // Trigger timeupdate
@ -1421,7 +1421,7 @@
} }
// Toggle muted state // Toggle muted state
if(player.media.muted && volume > 0) { if (player.media.muted && volume > 0) {
_toggleMute(); _toggleMute();
} }
} }
@ -1429,7 +1429,7 @@
// Mute // Mute
function _toggleMute(muted) { function _toggleMute(muted) {
// If the method is called without parameter, toggle based on current value // If the method is called without parameter, toggle based on current value
if(typeof muted !== "boolean") { if (typeof muted !== "boolean") {
muted = !player.media.muted; muted = !player.media.muted;
} }
@ -1440,7 +1440,7 @@
player.media.muted = muted; player.media.muted = muted;
// YouTube // YouTube
if(player.type === "youtube") { if (player.type === "youtube") {
player.embed[player.media.muted ? "mute" : "unMute"](); player.embed[player.media.muted ? "mute" : "unMute"]();
// Trigger timeupdate // Trigger timeupdate
@ -1454,12 +1454,12 @@
var volume = player.media.muted ? 0 : (player.media.volume * 10); var volume = player.media.muted ? 0 : (player.media.volume * 10);
// Update the <input type="range"> if present // Update the <input type="range"> if present
if(player.supported.full && player.volume) { if (player.supported.full && player.volume) {
player.volume.value = volume; player.volume.value = volume;
} }
// Store the volume in storage // Store the volume in storage
if(config.storage.enabled && _storage().supported) { if (config.storage.enabled && _storage().supported) {
window.localStorage.setItem(config.storage.key, volume); window.localStorage.setItem(config.storage.key, volume);
} }
@ -1467,7 +1467,7 @@
_toggleClass(player.container, config.classes.muted, (volume === 0)); _toggleClass(player.container, config.classes.muted, (volume === 0));
// Update checkbox for mute state // Update checkbox for mute state
if(player.supported.full && player.buttons.mute) { if (player.supported.full && player.buttons.mute) {
_toggleState(player.buttons.mute, (volume === 0)); _toggleState(player.buttons.mute, (volume === 0));
} }
} }
@ -1475,12 +1475,12 @@
// Toggle captions // Toggle captions
function _toggleCaptions(show) { function _toggleCaptions(show) {
// If there's no full support, or there's no caption toggle // If there's no full support, or there's no caption toggle
if(!player.supported.full || !player.buttons.captions) { if (!player.supported.full || !player.buttons.captions) {
return; return;
} }
// If the method is called without parameter, toggle based on current value // If the method is called without parameter, toggle based on current value
if(typeof show !== "boolean") { if (typeof show !== "boolean") {
show = (player.container.className.indexOf(config.classes.captions.active) === -1); show = (player.container.className.indexOf(config.classes.captions.active) === -1);
} }
@ -1510,7 +1510,7 @@
text = player.progress.played.text, text = player.progress.played.text,
value = 0; value = 0;
if(event) { if (event) {
switch(event.type) { switch(event.type) {
// Video playing // Video playing
case "timeupdate": case "timeupdate":
@ -1518,7 +1518,7 @@
value = _getPercentage(player.media.currentTime, player.media.duration); value = _getPercentage(player.media.currentTime, player.media.duration);
// Set seek range value only if it's a "natural" time event // Set seek range value only if it's a "natural" time event
if(event.type == "timeupdate" && player.buttons.seek) { if (event.type == "timeupdate" && player.buttons.seek) {
player.buttons.seek.value = value; player.buttons.seek.value = value;
} }
@ -1540,11 +1540,11 @@
var buffered = player.media.buffered; var buffered = player.media.buffered;
// HTML5 // HTML5
if(buffered && buffered.length) { if (buffered && buffered.length) {
return _getPercentage(buffered.end(0), player.media.duration); return _getPercentage(buffered.end(0), player.media.duration);
} }
// YouTube returns between 0 and 1 // YouTube returns between 0 and 1
else if(typeof buffered == "number") { else if (typeof buffered == "number") {
return (buffered * 100); return (buffered * 100);
} }
@ -1555,10 +1555,10 @@
} }
// Set values // Set values
if(progress) { if (progress) {
progress.value = value; progress.value = value;
} }
if(text) { if (text) {
text.innerHTML = value; text.innerHTML = value;
} }
} }
@ -1566,7 +1566,7 @@
// Update the displayed time // Update the displayed time
function _updateTimeDisplay(time, element) { function _updateTimeDisplay(time, element) {
// Bail if there's no duration display // Bail if there's no duration display
if(!element) { if (!element) {
return; return;
} }
@ -1590,12 +1590,12 @@
var duration = player.media.duration || 0; var duration = player.media.duration || 0;
// If there's only one time display, display duration there // If there's only one time display, display duration there
if(!player.duration && config.displayDuration && player.media.paused) { if (!player.duration && config.displayDuration && player.media.paused) {
_updateTimeDisplay(duration, player.currentTime); _updateTimeDisplay(duration, player.currentTime);
} }
// If there's a duration element, update content // If there's a duration element, update content
if(player.duration) { if (player.duration) {
_updateTimeDisplay(duration, player.duration); _updateTimeDisplay(duration, player.duration);
} }
} }
@ -1625,7 +1625,7 @@
// Inject a source // Inject a source
function _addSource(attributes) { function _addSource(attributes) {
if(attributes.src) { if (attributes.src) {
// Create a new <source> // Create a new <source>
var element = document.createElement("source"); var element = document.createElement("source");
@ -1641,7 +1641,7 @@
// Sources are not checked for support so be careful // Sources are not checked for support so be careful
function _parseSource(sources) { function _parseSource(sources) {
// YouTube // YouTube
if(player.type === "youtube" && typeof sources === "string") { if (player.type === "youtube" && typeof sources === "string") {
// Destroy YouTube instance // Destroy YouTube instance
player.embed.destroy(); player.embed.destroy();
@ -1667,7 +1667,7 @@
// If a single source is passed // If a single source is passed
// .source("path/to/video.mp4") // .source("path/to/video.mp4")
if(typeof sources === "string") { if (typeof sources === "string") {
player.media.setAttribute("src", sources); player.media.setAttribute("src", sources);
} }
@ -1680,7 +1680,7 @@
} }
} }
if(player.supported.full) { if (player.supported.full) {
// Reset time display // Reset time display
_timeUpdate(); _timeUpdate();
@ -1692,14 +1692,14 @@
player.media.load(); player.media.load();
// Play if autoplay attribute is present // Play if autoplay attribute is present
if(player.media.getAttribute("autoplay") !== null) { if (player.media.getAttribute("autoplay") !== null) {
_play(); _play();
} }
} }
// Update poster // Update poster
function _updatePoster(source) { function _updatePoster(source) {
if(player.type === "video") { if (player.type === "video") {
player.media.setAttribute("poster", source); player.media.setAttribute("poster", source);
} }
} }
@ -1715,7 +1715,7 @@
if (!focused || focused == document.body) { if (!focused || focused == document.body) {
focused = null; focused = null;
} }
else if (document.querySelector){ else if (document.querySelector) {
focused = document.querySelector(":focus"); focused = document.querySelector(":focus");
} }
for (var button in player.buttons) { for (var button in player.buttons) {
@ -1727,7 +1727,9 @@
_on(window, "keyup", function(event) { _on(window, "keyup", function(event) {
var code = (event.keyCode ? event.keyCode : event.which); var code = (event.keyCode ? event.keyCode : event.which);
if(code == 9) { checkFocus(); } if (code == 9) {
checkFocus();
}
}); });
for (var button in player.buttons) { for (var button in player.buttons) {
var element = player.buttons[button]; var element = player.buttons[button];
@ -1773,7 +1775,7 @@
_on(player.buttons.fullscreen, "click", _toggleFullscreen); _on(player.buttons.fullscreen, "click", _toggleFullscreen);
// Handle user exiting fullscreen by escaping etc // Handle user exiting fullscreen by escaping etc
if(fullscreen.supportsFullScreen) { if (fullscreen.supportsFullScreen) {
_on(document, fullscreen.fullScreenEventName, _toggleFullscreen); _on(document, fullscreen.fullScreenEventName, _toggleFullscreen);
} }
@ -1792,7 +1794,7 @@
// Handle the media finishing // Handle the media finishing
_on(player.media, "ended", function() { _on(player.media, "ended", function() {
// Clear // Clear
if(player.type === "video") { if (player.type === "video") {
player.captionsContainer.innerHTML = ""; player.captionsContainer.innerHTML = "";
} }
@ -1813,12 +1815,12 @@
_on(player.media, "waiting canplay seeked", _checkLoading); _on(player.media, "waiting canplay seeked", _checkLoading);
// Click video // Click video
if(player.type === "video" && config.click) { if (player.type === "video" && config.click) {
_on(player.videoContainer, "click", function() { _on(player.videoContainer, "click", function() {
if(player.media.paused) { if (player.media.paused) {
_triggerEvent(player.buttons.play, "click"); _triggerEvent(player.buttons.play, "click");
} }
else if(player.media.ended) { else if (player.media.ended) {
_seek(); _seek();
_triggerEvent(player.buttons.play, "click"); _triggerEvent(player.buttons.play, "click");
} }
@ -1834,7 +1836,7 @@
// http://stackoverflow.com/questions/12528049/if-a-dom-element-is-removed-are-its-listeners-also-removed-from-memory // http://stackoverflow.com/questions/12528049/if-a-dom-element-is-removed-are-its-listeners-also-removed-from-memory
function _destroy() { function _destroy() {
// Bail if the element is not initialized // Bail if the element is not initialized
if(!player.init) { if (!player.init) {
return null; return null;
} }
@ -1848,13 +1850,13 @@
_remove(_getElement(config.selectors.controls)); _remove(_getElement(config.selectors.controls));
// YouTube // YouTube
if(player.type === "youtube") { if (player.type === "youtube") {
player.embed.destroy(); player.embed.destroy();
return; return;
} }
// If video, we need to remove some more // If video, we need to remove some more
if(player.type === "video") { if (player.type === "video") {
// Remove captions // Remove captions
_remove(_getElement(config.selectors.captions)); _remove(_getElement(config.selectors.captions));
@ -1874,7 +1876,7 @@
// Setup a player // Setup a player
function _init() { function _init() {
// Bail if the element is initialized // Bail if the element is initialized
if(player.init) { if (player.init) {
return null; return null;
} }
@ -1903,7 +1905,7 @@
player.supported = api.supported(player.type); player.supported = api.supported(player.type);
// If no native support, bail // If no native support, bail
if(!player.supported.basic) { if (!player.supported.basic) {
return false; return false;
} }
@ -1914,9 +1916,9 @@
_setupMedia(); _setupMedia();
// Setup interface // Setup interface
if(player.type == "video" || player.type == "audio") { if (player.type == "video" || player.type == "audio") {
// Bail if no support // Bail if no support
if(!player.supported.full) { if (!player.supported.full) {
return; return;
} }
@ -1924,7 +1926,7 @@
_setupInterface(); _setupInterface();
// Display duration if available // Display duration if available
if(config.displayDuration) { if (config.displayDuration) {
_displayDuration(); _displayDuration();
} }
@ -1941,7 +1943,7 @@
_injectControls(); _injectControls();
// Find the elements // Find the elements
if(!_findElements()) { if (!_findElements()) {
return false; return false;
} }
@ -1963,7 +1965,7 @@
_init(); _init();
// If init failed, return an empty object // If init failed, return an empty object
if(!player.init) { if (!player.init) {
return {}; return {};
} }
@ -2027,13 +2029,13 @@
} }
// Expose setup function // Expose setup function
api.setup = function(options){ api.setup = function(options) {
// Extend the default options with user specified // Extend the default options with user specified
config = _extend(defaults, options); config = _extend(defaults, options);
// Bail if disabled or no basic support // Bail if disabled or no basic support
// You may want to disable certain UAs etc // You may want to disable certain UAs etc
if(!config.enabled || !api.supported().basic) { if (!config.enabled || !api.supported().basic) {
return false; return false;
} }
@ -2047,7 +2049,7 @@
var element = elements[i]; var element = elements[i];
// Setup a player instance and add to the element // Setup a player instance and add to the element
if(typeof element.plyr === "undefined") { if (typeof element.plyr === "undefined") {
// Create new instance // Create new instance
var instance = new Plyr(element); var instance = new Plyr(element);
@ -2055,7 +2057,7 @@
element.plyr = (Object.keys(instance).length ? instance : false); element.plyr = (Object.keys(instance).length ? instance : false);
// Callback // Callback
if(typeof config.onSetup === "function") { if (typeof config.onSetup === "function") {
config.onSetup.apply(element.plyr); config.onSetup.apply(element.plyr);
} }
} }