diff options
Diffstat (limited to 'demo/dist/demo.js')
| -rw-r--r-- | demo/dist/demo.js | 474 |
1 files changed, 230 insertions, 244 deletions
diff --git a/demo/dist/demo.js b/demo/dist/demo.js index 8363e33f..e3d4e6c2 100644 --- a/demo/dist/demo.js +++ b/demo/dist/demo.js @@ -1833,7 +1833,6 @@ typeof navigator === "object" && (function () { }; this._fetchDefaults = { method: 'POST', - keepalive: true, // Despite all stars in the sky saying that Edge supports old draft syntax, aka 'never', 'always', 'origin' and 'default // https://caniuse.com/#feat=referrer-policy // It doesn't. And it throw exception instead of ignoring this parameter... @@ -1874,7 +1873,7 @@ typeof navigator === "object" && (function () { // webpack (using a build step causes webpack #1617). Grunt verifies that // this value matches package.json during build. // See: https://github.com/getsentry/raven-js/issues/465 - VERSION: '3.26.4', + VERSION: '3.27.0', debug: false, @@ -2612,7 +2611,7 @@ typeof navigator === "object" && (function () { ) return; - options = Object.assign( + options = objectMerge$1( { eventId: this.lastEventId(), dsn: this._dsn, @@ -4093,276 +4092,263 @@ typeof navigator === "object" && (function () { // ========================================================================== (function () { - var host = window.location.host; + var host = window.location.host; + var env = { + prod: host === 'plyr.io', + dev: host === 'dev.plyr.io' + }; + document.addEventListener('DOMContentLoaded', function () { + singleton.context(function () { + var selector = '#player'; + var container = document.getElementById('container'); + + if (window.shr) { + window.shr.setup({ + count: { + classname: 'button__count' + } + }); + } // Setup tab focus - var env = { - prod: host === 'plyr.io', - dev: host === 'dev.plyr.io' - }; - document.addEventListener('DOMContentLoaded', function () { - singleton.context(function () { - var selector = '#player'; - var container = document.getElementById('container'); + var tabClassName = 'tab-focus'; // Remove class on blur - if (window.shr) { - window.shr.setup({ - count: { - classname: 'button__count' - } - }); - } + document.addEventListener('focusout', function (event) { + if (!event.target.classList || container.contains(event.target)) { + return; + } - // Setup tab focus - var tabClassName = 'tab-focus'; + event.target.classList.remove(tabClassName); + }); // Add classname to tabbed elements - // Remove class on blur - document.addEventListener('focusout', function (event) { - if (!event.target.classList || container.contains(event.target)) { - return; - } + document.addEventListener('keydown', function (event) { + if (event.keyCode !== 9) { + return; + } // Delay the adding of classname until the focus has changed + // This event fires before the focusin event - event.target.classList.remove(tabClassName); - }); - // Add classname to tabbed elements - document.addEventListener('keydown', function (event) { - if (event.keyCode !== 9) { - return; - } + setTimeout(function () { + var focused = document.activeElement; - // Delay the adding of classname until the focus has changed - // This event fires before the focusin event - setTimeout(function () { - var focused = document.activeElement; + if (!focused || !focused.classList || container.contains(focused)) { + return; + } - if (!focused || !focused.classList || container.contains(focused)) { - return; - } + focused.classList.add(tabClassName); + }, 10); + }); // Setup the player - focused.classList.add(tabClassName); - }, 10); - }); - - // Setup the player - var player = new Plyr(selector, { - debug: true, - title: 'View From A Blue Moon', - iconUrl: '../dist/plyr.svg', - keyboard: { - global: true - }, - tooltips: { - controls: true - }, - captions: { - active: true - }, - keys: { - google: 'AIzaSyDrNwtN3nLH_8rjCmu5Wq3ZCm4MNAVdc0c' - }, - ads: { - enabled: env.prod || env.dev, - publisherId: '918848828995742' - } - }); - - // Expose for tinkering in the console - window.player = player; - - // Setup type toggle - var buttons = document.querySelectorAll('[data-source]'); - var types = { - video: 'video', - audio: 'audio', - youtube: 'youtube', - vimeo: 'vimeo' - }; - var currentType = window.location.hash.replace('#', ''); - var historySupport = window.history && window.history.pushState; + var player = new Plyr(selector, { + debug: true, + title: 'View From A Blue Moon', + iconUrl: '../dist/plyr.svg', + keyboard: { + global: true + }, + tooltips: { + controls: true + }, + captions: { + active: true + }, + keys: { + google: 'AIzaSyDrNwtN3nLH_8rjCmu5Wq3ZCm4MNAVdc0c' + }, + ads: { + enabled: env.prod || env.dev, + publisherId: '918848828995742' + } + }); // Expose for tinkering in the console - // Toggle class on an element - function toggleClass(element, className, state) { - if (element) { - element.classList[state ? 'add' : 'remove'](className); - } - } + window.player = player; // Setup type toggle - // Set a new source - function newSource(type, init) { - // Bail if new type isn't known, it's the current type, or current type is empty (video is default) and new type is video - if (!(type in types) || !init && type === currentType || !currentType.length && type === types.video) { - return; - } + var buttons = document.querySelectorAll('[data-source]'); + var types = { + video: 'video', + audio: 'audio', + youtube: 'youtube', + vimeo: 'vimeo' + }; + var currentType = window.location.hash.replace('#', ''); + var historySupport = window.history && window.history.pushState; // Toggle class on an element - switch (type) { - case types.video: - player.source = { - type: 'video', - title: 'View From A Blue Moon', - sources: [{ - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-576p.mp4', - type: 'video/mp4', - size: 576 - }, { - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-720p.mp4', - type: 'video/mp4', - size: 720 - }, { - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1080p.mp4', - type: 'video/mp4', - size: 1080 - }, { - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1440p.mp4', - type: 'video/mp4', - size: 1440 - }], - poster: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg', - tracks: [{ - kind: 'captions', - label: 'English', - srclang: 'en', - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.en.vtt', - default: true - }, { - kind: 'captions', - label: 'French', - srclang: 'fr', - src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.fr.vtt' - }] - }; - - break; - - case types.audio: - player.source = { - type: 'audio', - title: 'Kishi Bashi – “It All Began With A Burst”', - sources: [{ - src: 'https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3', - type: 'audio/mp3' - }, { - src: 'https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg', - type: 'audio/ogg' - }] - }; - - break; - - case types.youtube: - player.source = { - type: 'video', - sources: [{ - src: 'https://youtube.com/watch?v=bTqVqk7FSmY', - provider: 'youtube' - }] - }; - - break; - - case types.vimeo: - player.source = { - type: 'video', - sources: [{ - src: 'https://vimeo.com/76979871', - provider: 'vimeo' - }] - }; - - break; - - default: - break; - } + function toggleClass(element, className, state) { + if (element) { + element.classList[state ? 'add' : 'remove'](className); + } + } // Set a new source - // Set the current type for next time - currentType = type; - // Remove active classes - Array.from(buttons).forEach(function (button) { - return toggleClass(button.parentElement, 'active', false); - }); + function newSource(type, init) { + // Bail if new type isn't known, it's the current type, or current type is empty (video is default) and new type is video + if (!(type in types) || !init && type === currentType || !currentType.length && type === types.video) { + return; + } - // Set active on parent - toggleClass(document.querySelector('[data-source="' + type + '"]'), 'active', true); + switch (type) { + case types.video: + player.source = { + type: 'video', + title: 'View From A Blue Moon', + sources: [{ + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-576p.mp4', + type: 'video/mp4', + size: 576 + }, { + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-720p.mp4', + type: 'video/mp4', + size: 720 + }, { + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1080p.mp4', + type: 'video/mp4', + size: 1080 + }, { + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-1440p.mp4', + type: 'video/mp4', + size: 1440 + }], + poster: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.jpg', + tracks: [{ + kind: 'captions', + label: 'English', + srclang: 'en', + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.en.vtt', + default: true + }, { + kind: 'captions', + label: 'French', + srclang: 'fr', + src: 'https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.fr.vtt' + }] + }; + break; + + case types.audio: + player.source = { + type: 'audio', + title: 'Kishi Bashi – “It All Began With A Burst”', + sources: [{ + src: 'https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3', + type: 'audio/mp3' + }, { + src: 'https://cdn.plyr.io/static/demo/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg', + type: 'audio/ogg' + }] + }; + break; + + case types.youtube: + player.source = { + type: 'video', + sources: [{ + src: 'https://youtube.com/watch?v=bTqVqk7FSmY', + provider: 'youtube' + }] + }; + break; + + case types.vimeo: + player.source = { + type: 'video', + sources: [{ + src: 'https://vimeo.com/76979871', + provider: 'vimeo' + }] + }; + break; - // Show cite - Array.from(document.querySelectorAll('.plyr__cite')).forEach(function (cite) { - cite.setAttribute('hidden', ''); - }); - document.querySelector('.plyr__cite--' + type).removeAttribute('hidden'); - } + default: + break; + } // Set the current type for next time - // Bind to each button - Array.from(buttons).forEach(function (button) { - button.addEventListener('click', function () { - var type = button.getAttribute('data-source'); - newSource(type); + currentType = type; // Remove active classes - if (historySupport) { - window.history.pushState({ type: type }, '', '#' + type); - } - }); - }); + Array.from(buttons).forEach(function (button) { + return toggleClass(button.parentElement, 'active', false); + }); // Set active on parent - // List for backwards/forwards - window.addEventListener('popstate', function (event) { - if (event.state && 'type' in event.state) { - newSource(event.state.type); - } - }); + toggleClass(document.querySelector("[data-source=\"".concat(type, "\"]")), 'active', true); // Show cite - // On load - if (historySupport) { - var video = !currentType.length; + Array.from(document.querySelectorAll('.plyr__cite')).forEach(function (cite) { + cite.setAttribute('hidden', ''); + }); + document.querySelector(".plyr__cite--".concat(type)).removeAttribute('hidden'); + } // Bind to each button - // If there's no current type set, assume video - if (video) { - currentType = types.video; - } - // Replace current history state - if (currentType in types) { - window.history.replaceState({ - type: currentType - }, '', video ? '' : '#' + currentType); - } + Array.from(buttons).forEach(function (button) { + button.addEventListener('click', function () { + var type = button.getAttribute('data-source'); + newSource(type); - // If it's not video, load the source - if (currentType !== types.video) { - newSource(currentType, true); - } - } + if (historySupport) { + window.history.pushState({ + type: type + }, '', "#".concat(type)); + } }); + }); // List for backwards/forwards + + window.addEventListener('popstate', function (event) { + if (event.state && 'type' in event.state) { + newSource(event.state.type); + } + }); // On load + + if (historySupport) { + var video = !currentType.length; // If there's no current type set, assume video + + if (video) { + currentType = types.video; + } // Replace current history state + + + if (currentType in types) { + window.history.replaceState({ + type: currentType + }, '', video ? '' : "#".concat(currentType)); + } // If it's not video, load the source + + + if (currentType !== types.video) { + newSource(currentType, true); + } + } }); + }); // Raven / Sentry + // For demo site (https://plyr.io) only - // Raven / Sentry - // For demo site (https://plyr.io) only - if (env.prod) { - singleton.config('https://d4ad9866ad834437a4754e23937071e4@sentry.io/305555').install(); - } + if (env.prod) { + singleton.config('https://d4ad9866ad834437a4754e23937071e4@sentry.io/305555').install(); + } // Google analytics + // For demo site (https://plyr.io) only + + /* eslint-disable */ + + + if (env.prod) { + (function (i, s, o, g, r, a, m) { + i.GoogleAnalyticsObject = r; + + i[r] = i[r] || function () { + (i[r].q = i[r].q || []).push(arguments); + }; + + i[r].l = 1 * new Date(); + a = s.createElement(o); + m = s.getElementsByTagName(o)[0]; + a.async = 1; + a.src = g; + m.parentNode.insertBefore(a, m); + })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga'); + + window.ga('create', 'UA-40881672-11', 'auto'); + window.ga('send', 'pageview'); + } + /* eslint-enable */ - // Google analytics - // For demo site (https://plyr.io) only - /* eslint-disable */ - if (env.prod) { - (function (i, s, o, g, r, a, m) { - i.GoogleAnalyticsObject = r; - i[r] = i[r] || function () { - (i[r].q = i[r].q || []).push(arguments); - }; - i[r].l = 1 * new Date(); - a = s.createElement(o); - m = s.getElementsByTagName(o)[0]; - a.async = 1; - a.src = g; - m.parentNode.insertBefore(a, m); - })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga'); - window.ga('create', 'UA-40881672-11', 'auto'); - window.ga('send', 'pageview'); - } - /* eslint-enable */ })(); }()); |