aboutsummaryrefslogtreecommitdiffstats
path: root/demo/src/js/main.js
diff options
context:
space:
mode:
Diffstat (limited to 'demo/src/js/main.js')
-rw-r--r--demo/src/js/main.js124
1 files changed, 67 insertions, 57 deletions
diff --git a/demo/src/js/main.js b/demo/src/js/main.js
index 5302604b..d7c5f42a 100644
--- a/demo/src/js/main.js
+++ b/demo/src/js/main.js
@@ -7,21 +7,21 @@
/*global plyr*/
// General functions
-;(function() {
+(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',
+ debug: true,
+ title: 'Video demo',
+ iconUrl: '../dist/plyr.svg',
tooltips: {
- controls: true
+ controls: true
},
captions: {
- defaultActive: true
+ defaultActive: true
},
- //controls: ['play-large', 'play', 'speed-up', 'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'fullscreen']
+ controls: ['play-large', 'play', 'speed-up', 'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'fullscreen']
});
plyr.loadSprite('dist/demo.svg');
@@ -31,10 +31,10 @@
// Setup type toggle
var buttons = document.querySelectorAll('[data-source]'),
types = {
- video: 'video',
- audio: 'audio',
- youtube: 'youtube',
- vimeo: 'vimeo'
+ video: 'video',
+ audio: 'audio',
+ youtube: 'youtube',
+ vimeo: 'vimeo'
},
currentType = window.location.hash.replace('#', ''),
historySupport = (window.history && window.history.pushState);
@@ -47,34 +47,38 @@
newSource(type);
if (historySupport) {
- history.pushState({ 'type': type }, '', '#' + type);
+ history.pushState({
+ 'type': type
+ }, '', '#' + type);
}
});
}
// List for backwards/forwards
window.addEventListener('popstate', function(event) {
- if(event.state && 'type' in event.state) {
+ if (event.state && 'type' in event.state) {
newSource(event.state.type);
}
});
// On load
- if(historySupport) {
+ if (historySupport) {
var video = !currentType.length;
// If there's no current type set, assume video
- if(video) {
+ if (video) {
currentType = types.video;
}
// Replace current history state
- if(currentType in types) {
- history.replaceState({ 'type': currentType }, '', (video ? '' : '#' + currentType));
+ if (currentType in types) {
+ history.replaceState({
+ 'type': currentType
+ }, '', (video ? '' : '#' + currentType));
}
// If it's not video, load the source
- if(currentType !== types.video) {
+ if (currentType !== types.video) {
newSource(currentType, true);
}
}
@@ -84,8 +88,7 @@
if (element) {
if (element.classList) {
element.classList[state ? 'add' : 'remove'](className);
- }
- else {
+ } else {
var name = (' ' + element.className + ' ').replace(/\s+/g, ' ').replace(' ' + className + ' ', '');
element.className = name + (state ? ' ' + className : '');
}
@@ -95,29 +98,29 @@
// 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)) {
+ if (!(type in types) || (!init && type === currentType) || (!currentType.length && type === types.video)) {
return;
}
- switch(type) {
+ switch (type) {
case types.video:
player.source({
- type: 'video',
- title: 'View From A Blue Moon',
+ type: 'video',
+ title: 'View From A Blue Moon',
sources: [{
- src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.mp4',
- type: 'video/mp4'
+ src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.mp4',
+ type: 'video/mp4'
},
- {
- src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.webm',
- type: 'video/webm'
+ {
+ src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.webm',
+ type: 'video/webm'
}],
- poster: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.jpg',
- tracks: [{
- kind: 'captions',
- label: 'English',
- srclang:'en',
- src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.en.vtt',
+ poster: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.jpg',
+ tracks: [{
+ kind: 'captions',
+ label: 'English',
+ srclang: 'en',
+ src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.en.vtt',
default: true
}]
});
@@ -125,37 +128,37 @@
case types.audio:
player.source({
- type: 'audio',
- title: 'Kishi Bashi – “It All Began With A Burst”',
+ type: 'audio',
+ title: 'Kishi Bashi – “It All Began With A Burst”',
sources: [{
- src: 'https://cdn.selz.com/plyr/1.5/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3',
- type: 'audio/mp3'
+ src: 'https://cdn.selz.com/plyr/1.5/Kishi_Bashi_-_It_All_Began_With_a_Burst.mp3',
+ type: 'audio/mp3'
},
- {
- src: 'https://cdn.selz.com/plyr/1.5/Kishi_Bashi_-_It_All_Began_With_a_Burst.ogg',
- type: 'audio/ogg'
+ {
+ src: 'https://cdn.selz.com/plyr/1.5/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',
+ type: 'video',
+ title: 'View From A Blue Moon',
sources: [{
- src: 'bTqVqk7FSmY',
- type: 'youtube'
+ src: 'bTqVqk7FSmY',
+ type: 'youtube'
}]
});
break;
case types.vimeo:
player.source({
- type: 'video',
- title: 'View From A Blue Moon',
+ type: 'video',
+ title: 'View From A Blue Moon',
sources: [{
- src: '143418951',
- type: 'vimeo'
+ src: '143418951',
+ type: 'vimeo'
}]
});
break;
@@ -170,17 +173,24 @@
}
// Set active on parent
- toggleClass(document.querySelector('[data-source="'+ type +'"]').parentElement, 'active', true);
+ 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');
+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');
}
generated by cgit v1.2.3 (git 2.25.1) at 2025-06-09 09:34:53 +0000