From f87a10ae0b59df0f30d017fe85975c757487a198 Mon Sep 17 00:00:00 2001 From: Sam Date: Sun, 17 Jan 2016 01:25:11 +1100 Subject: Fix for event listeners being duplicated on source change --- docs/src/js/docs.js | 8 ++++++++ 1 file changed, 8 insertions(+) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index 34bb418f..8b61e3d1 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -33,6 +33,10 @@ shr.setup({ buttons[i].addEventListener('click', newSource); } + window.addEventListener('popstate', function(event) { + console.log(event); + }); + function toggleClass(element, className, state) { if (element) { if (element.classList) { @@ -113,6 +117,10 @@ shr.setup({ break; } + if (window.history && window.history.pushState) { + history.pushState({ 'type': type }, '', '#' + type); + } + for (var x = buttons.length - 1; x >= 0; x--) { toggleClass(buttons[x].parentElement, 'active', false); } -- cgit v1.2.3 From a277224ef4b197870f3c912de8bc6135281f0856 Mon Sep 17 00:00:00 2001 From: Sam Date: Sun, 17 Jan 2016 01:29:34 +1100 Subject: Reverted docs.js changes --- docs/src/js/docs.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index 8b61e3d1..dd891f07 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -33,9 +33,9 @@ shr.setup({ buttons[i].addEventListener('click', newSource); } - window.addEventListener('popstate', function(event) { + /*window.addEventListener('popstate', function(event) { console.log(event); - }); + });*/ function toggleClass(element, className, state) { if (element) { @@ -117,9 +117,9 @@ shr.setup({ break; } - if (window.history && window.history.pushState) { + /*if (window.history && window.history.pushState) { history.pushState({ 'type': type }, '', '#' + type); - } + }*/ for (var x = buttons.length - 1; x >= 0; x--) { toggleClass(buttons[x].parentElement, 'active', false); -- cgit v1.2.3 From d6b67c3388950f56e28ce2aa59b4eef7de76c005 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Sun, 17 Jan 2016 10:39:05 +1100 Subject: Docs pushstate for tabs --- docs/src/js/docs.js | 58 +++++++++++++++++++++++++++++++++++++++++------------ 1 file changed, 45 insertions(+), 13 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index dd891f07..d342f9c4 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -26,16 +26,48 @@ shr.setup({ // General functions (function() { - var buttons = document.querySelectorAll('[data-source]'); + var buttons = document.querySelectorAll('[data-source]'), + types = { + video: 0, + audio: 1, + youtube: 2, + vimeo: 3 + }, + 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', newSource); + buttons[i].addEventListener('click', function() { + var type = this.getAttribute('data-source'); + + newSource(type); + + if (historySupport) { + history.pushState({ 'type': type }, '', '#' + type); + } + }); } - /*window.addEventListener('popstate', function(event) { - console.log(event); - });*/ + // List for backwards/forwards + window.addEventListener('popstate', function(event) { + if(event.state && 'type' in event.state) { + newSource(event.state.type); + } + }); + + // On load + if(historySupport) { + if(!currentType.length) { + currentType = 'video'; + } + if(currentType in types) { + history.replaceState({ 'type': currentType }, '', '#' + currentType); + } + if(currentType != 'video') { + newSource(currentType); + } + } function toggleClass(element, className, state) { if (element) { @@ -50,10 +82,12 @@ shr.setup({ } // Set a new source - function newSource() { - var trigger = this, - type = trigger.getAttribute('data-source'), - player = document.querySelector('.js-media-player').plyr; + function newSource(type) { + if(!(type in types)) { + return; + } + + var player = document.querySelector('.js-media-player').plyr; switch(type) { case 'video': @@ -117,15 +151,13 @@ shr.setup({ break; } - /*if (window.history && window.history.pushState) { - history.pushState({ 'type': type }, '', '#' + type); - }*/ + currentType = type; for (var x = buttons.length - 1; x >= 0; x--) { toggleClass(buttons[x].parentElement, 'active', false); } - toggleClass((event.target || event.srcElement).parentElement, 'active', true); + toggleClass(document.querySelector('[data-source="'+ type +'"]').parentElement, 'active', true); } })(); -- cgit v1.2.3 From 3f42e53d95fff0a8f9a6ea2a730c21df23577f06 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Sun, 17 Jan 2016 10:48:26 +1100 Subject: Don't add video hash --- docs/src/js/docs.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index d342f9c4..471915cb 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -58,13 +58,14 @@ shr.setup({ // On load if(historySupport) { - if(!currentType.length) { + var video = !currentType.length; + if(video) { currentType = 'video'; } if(currentType in types) { - history.replaceState({ 'type': currentType }, '', '#' + currentType); + history.replaceState({ 'type': currentType }, '', (video ? '' : '#' + currentType)); } - if(currentType != 'video') { + if(!video) { newSource(currentType); } } -- cgit v1.2.3 From a665121b52ad7860b0a96f6b0c5f2aa741e06d62 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Mon, 18 Jan 2016 19:48:14 +1100 Subject: Types enum --- docs/src/js/docs.js | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index 471915cb..ec5566d9 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -28,10 +28,10 @@ shr.setup({ (function() { var buttons = document.querySelectorAll('[data-source]'), types = { - video: 0, - audio: 1, - youtube: 2, - vimeo: 3 + video: 'video', + audio: 'audio', + youtube: 'youtube', + vimeo: 'vimeo' }, currentType = window.location.hash.replace('#', ''), historySupport = (window.history && window.history.pushState); @@ -60,7 +60,7 @@ shr.setup({ if(historySupport) { var video = !currentType.length; if(video) { - currentType = 'video'; + currentType = types.video; } if(currentType in types) { history.replaceState({ 'type': currentType }, '', (video ? '' : '#' + currentType)); @@ -70,6 +70,7 @@ shr.setup({ } } + // Toggle class on an element function toggleClass(element, className, state) { if (element) { if (element.classList) { @@ -91,7 +92,7 @@ shr.setup({ var player = document.querySelector('.js-media-player').plyr; switch(type) { - case 'video': + case types.video: player.source({ type: 'video', title: 'View From A Blue Moon', @@ -114,7 +115,7 @@ shr.setup({ }); break; - case 'audio': + case types.audio: player.source({ type: 'audio', title: 'Kishi Bashi – “It All Began With A Burst”', @@ -129,7 +130,7 @@ shr.setup({ }); break; - case 'youtube': + case types.youtube: player.source({ type: 'video', title: 'View From A Blue Moon', @@ -140,7 +141,7 @@ shr.setup({ }); break; - case 'vimeo': + case types.vimeo: player.source({ type: 'video', title: 'View From A Blue Moon', -- cgit v1.2.3 From 42c955c5ebe9ffe63efda7ddb863f91a2999e634 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 19 Jan 2016 00:33:22 +1100 Subject: Removed onSetup from docs code --- docs/src/js/docs.js | 3 --- 1 file changed, 3 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index ec5566d9..d2cef452 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -11,9 +11,6 @@ plyr.setup('.js-media-player', { tooltips: true, captions: { defaultActive: true - }, - onSetup: function() { - console.log('✓ Setup done'); } }); -- cgit v1.2.3 From 84a1b03d7d2a4788b4c25fa4b3cea0b62b90f2d1 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 19 Jan 2016 17:15:50 +1100 Subject: Docs update --- docs/src/js/docs.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index d2cef452..9828654e 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -82,10 +82,13 @@ shr.setup({ // Set a new source function newSource(type) { - if(!(type in types)) { + + // 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) || type == currentType || (!currentType.length && type == types.video)) { return; } + // Get plyr instance var player = document.querySelector('.js-media-player').plyr; switch(type) { @@ -106,7 +109,7 @@ shr.setup({ kind: 'captions', label: 'English', srclang:'en', - src: 'https://cdn.selz.com/plyr/1.0/example_captions_en.vtt', + src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.vtt', default: true }] }); @@ -150,12 +153,15 @@ shr.setup({ 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); } })(); -- cgit v1.2.3 From a965d8a893a6885848c5c4cceab9f96265c7fa21 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Sun, 24 Jan 2016 11:25:31 +1100 Subject: Seek tooltip, bug fixes for SASS, fullscreen and icons --- docs/src/js/docs.js | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index 9828654e..563d2ebe 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -6,11 +6,13 @@ // Setup the player plyr.setup('.js-media-player', { - debug: true, - title: 'Video demo', - tooltips: true, + debug: true, + title: 'Video demo', + tooltips: { + controls: true + }, captions: { - defaultActive: true + defaultActive: true } }); @@ -63,7 +65,7 @@ shr.setup({ history.replaceState({ 'type': currentType }, '', (video ? '' : '#' + currentType)); } if(!video) { - newSource(currentType); + newSource(currentType, true); } } @@ -81,10 +83,10 @@ shr.setup({ } // Set a new source - function newSource(type) { - + 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) || type == currentType || (!currentType.length && type == types.video)) { + if(!(type in types) || (!init && type == currentType) || (!currentType.length && type == types.video)) { + console.warn('Unregonized type.'); return; } -- cgit v1.2.3 From ce513442699f4b3c964adf06d9baa49821351ce3 Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Sat, 13 Feb 2016 22:18:42 +1100 Subject: iOS fix (Fixes #166), Edge Progress Tip (Fixes #160), SASS fix (Fixes #158) --- docs/src/js/docs.js | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index 563d2ebe..bedb91cb 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -13,7 +13,8 @@ plyr.setup('.js-media-player', { }, captions: { defaultActive: true - } + }, + duration: 100 }); // Setup shr @@ -58,13 +59,19 @@ shr.setup({ // 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(!video) { + + // If it's not video, load the source + if(currentType !== types.video) { newSource(currentType, true); } } @@ -86,7 +93,6 @@ shr.setup({ 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)) { - console.warn('Unregonized type.'); return; } -- cgit v1.2.3 From 54af43dd752efeaa97e41c4819dc98aa5ddf68fc Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Tue, 23 Feb 2016 15:11:35 +1100 Subject: Docs code --- docs/src/js/docs.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/src/js/docs.js') diff --git a/docs/src/js/docs.js b/docs/src/js/docs.js index f0f688b7..8ec66bb4 100644 --- a/docs/src/js/docs.js +++ b/docs/src/js/docs.js @@ -116,7 +116,7 @@ shr.setup({ kind: 'captions', label: 'English', srclang:'en', - src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.vtt', + src: 'https://cdn.selz.com/plyr/1.5/View_From_A_Blue_Moon_Trailer-HD.en.vtt', default: true }] }); -- cgit v1.2.3