diff options
Diffstat (limited to 'demo/src/js/main.js')
| -rw-r--r-- | demo/src/js/main.js | 203 |
1 files changed, 0 insertions, 203 deletions
diff --git a/demo/src/js/main.js b/demo/src/js/main.js deleted file mode 100644 index 7d732dcd..00000000 --- a/demo/src/js/main.js +++ /dev/null @@ -1,203 +0,0 @@ -// ========================================================================== -// Plyr.io demo -// This code is purely for the plyr.io website -// Please see readme.md in the root or github.com/selz/plyr -// ========================================================================== - -/*global plyr*/ - -// General functions -(function() { - //document.body.addEventListener('ready', function(event) { console.log(event); }); - - // Setup the player - var instances = plyr.setup({ - debug: true, - title: "Video demo", - iconUrl: "../dist/plyr.svg", - tooltips: { - controls: true - }, - captions: { - defaultActive: true - } - }); - plyr.loadSprite("dist/demo.svg"); - - // Plyr returns an array regardless - var player = instances[0]; - - // Setup type toggle - var buttons = document.querySelectorAll("[data-source]"), - types = { - video: "video", - audio: "audio", - youtube: "youtube", - vimeo: "vimeo" - }, - currentType = window.location.hash.replace("#", ""), - historySupport = window.history && window.history.pushState; - - // Bind to each button - for (var i = buttons.length - 1; i >= 0; i--) { - buttons[i].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) { - if (element.classList) { - element.classList[state ? "add" : "remove"](className); - } else { - var name = (" " + element.className + " ").replace(/\s+/g, " ").replace(" " + className + " ", ""); - element.className = name + (state ? " " + 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" - }, - { - src: "https://cdn.plyr.io/static/demo/View_From_A_Blue_Moon_Trailer-HD.webm", - type: "video/webm" - } - ], - 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 - } - ] - }); - 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: "bTqVqk7FSmY", - type: "youtube" - } - ] - }); - break; - - case types.vimeo: - player.source({ - type: "video", - title: "View From A Blue Moon", - sources: [ - { - src: "147865858", - 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 + '"]').parentElement, "active", true); - } -})(); - -// Google analytics -// For demo site (http://[www.]plyr.io) only -if (document.domain.indexOf("plyr.io") > -1) { - (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"); - ga("create", "UA-40881672-11", "auto"); - ga("send", "pageview"); -} |