diff options
Diffstat (limited to 'demo/src/js/main.js')
| -rw-r--r-- | demo/src/js/main.js | 222 |
1 files changed, 0 insertions, 222 deletions
diff --git a/demo/src/js/main.js b/demo/src/js/main.js deleted file mode 100644 index bc2ea0aa..00000000 --- a/demo/src/js/main.js +++ /dev/null @@ -1,222 +0,0 @@ -// ========================================================================== -// Plyr.io demo -// This code is purely for the https://plyr.io website -// Please see readme.md in the root or github.com/sampotts/plyr -// ========================================================================== - -/*global Plyr*/ - -(function() { - if (window.shr) { - window.shr.setup({ - count: { - classname: 'button__count', - }, - }); - } - - /*document.body.addEventListener('ready', function(event) { - console.log(event); - });*/ - - // Setup the player - var player = new Plyr('#player', { - debug: true, - title: 'View From A Blue Moon', - iconUrl: '../dist/plyr.svg', - tooltips: { - controls: true, - }, - captions: { - defaultActive: true, - }, - controls: ['play-large', 'play', 'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'fullscreen', 'pip', 'airplay'], - }); - - // Expose for testing - 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; - - // Bind to each button - [].forEach.call(buttons, function(button) { - button.addEventListener('click', function() { - var type = this.getAttribute('data-source'); - - newSource(type); - - if (historySupport) { - history.pushState({ type: type }, '', '#' + 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) { - history.replaceState( - { - type: currentType, - }, - '', - video ? '' : '#' + currentType - ); - } - - // If it's not video, load the source - if (currentType !== types.video) { - newSource(currentType, true); - } - } - - // Toggle class on an element - function toggleClass(element, className, state) { - if (element) { - element.classList[state ? 'add' : 'remove'](className); - } - } - - // 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; - } - - 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-HD.mp4', - type: 'video/mp4', - }, - ], - 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', - title: 'View From A Blue Moon', - sources: [ - { - src: 'https://www.youtube.com/watch?v=bTqVqk7FSmY', - type: 'youtube', - }, - ], - }); - break; - - case types.vimeo: - player.source({ - type: 'video', - title: 'View From A Blue Moon', - sources: [ - { - src: 'https://vimeo.com/76979871', - type: 'vimeo', - }, - ], - }); - break; - } - - // Set the current type for next time - currentType = type; - - // Remove active classes - for (var x = buttons.length - 1; x >= 0; x--) { - toggleClass(buttons[x].parentElement, 'active', false); - } - - // Set active on parent - toggleClass(document.querySelector('[data-source="' + type + '"]'), 'active', true); - - // Show cite - [].forEach.call(document.querySelectorAll('.plyr__cite'), function(cite) { - cite.setAttribute('hidden', ''); - }); - document.querySelector('.plyr__cite--' + type).removeAttribute('hidden'); - } -})(); - -// Google analytics -// For demo site (https://plyr.io) only -if (window.location.host === 'plyr.io') { - (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', '//www.google-analytics.com/analytics.js', 'ga'); - window.ga('create', 'UA-40881672-11', 'auto'); - window.ga('send', 'pageview'); -} |