aboutsummaryrefslogtreecommitdiffstats
path: root/src/js
diff options
context:
space:
mode:
authorSam Potts <sam@potts.es>2018-06-25 23:09:13 +1000
committerSam Potts <sam@potts.es>2018-06-25 23:09:13 +1000
commite59fe1aacfcb1366cedcb1a65c4ad22f588f8741 (patch)
tree82954726ac8d9c400610c5b5ac76904d29f5f69d /src/js
parent1f1d74ba50f2ac4113948a3b92a0b55f05b735c2 (diff)
parentdf458c5e7ae824fc0bf86462130ea9571229c273 (diff)
downloadplyr-e59fe1aacfcb1366cedcb1a65c4ad22f588f8741.tar.lz
plyr-e59fe1aacfcb1366cedcb1a65c4ad22f588f8741.tar.xz
plyr-e59fe1aacfcb1366cedcb1a65c4ad22f588f8741.zip
Merge branch 'develop' into a11y-improvements
# Conflicts: # dist/plyr.js # dist/plyr.js.map # dist/plyr.min.js # dist/plyr.min.js.map # dist/plyr.polyfilled.js # dist/plyr.polyfilled.js.map # dist/plyr.polyfilled.min.js # dist/plyr.polyfilled.min.js.map # src/js/listeners.js
Diffstat (limited to 'src/js')
-rw-r--r--src/js/captions.js6
-rw-r--r--src/js/listeners.js46
-rw-r--r--src/js/plugins/ads.js4
-rw-r--r--src/js/plyr.js5
-rw-r--r--src/js/utils/is.js112
5 files changed, 79 insertions, 94 deletions
diff --git a/src/js/captions.js b/src/js/captions.js
index 732b2e38..9dca5505 100644
--- a/src/js/captions.js
+++ b/src/js/captions.js
@@ -191,8 +191,10 @@ const captions = {
return;
}
- // Toggle state
- this.elements.buttons.captions.pressed = active;
+ // Toggle button if it's enabled
+ if (this.elements.buttons.captions) {
+ this.elements.buttons.captions.pressed = active;
+ }
// Add class hook
toggleClass(this.elements.container, activeClass, active);
diff --git a/src/js/listeners.js b/src/js/listeners.js
index d6786111..05a12147 100644
--- a/src/js/listeners.js
+++ b/src/js/listeners.js
@@ -432,9 +432,11 @@ class Listeners {
const inputEvent = browser.isIE ? 'change' : 'input';
// Play/pause toggle
- Array.from(this.player.elements.buttons.play).forEach(button => {
- this.bind(button, 'click', this.player.togglePlay, 'play');
- });
+ if (this.player.elements.buttons.play) {
+ Array.from(this.player.elements.buttons.play).forEach(button => {
+ this.bind(button, 'click', this.player.togglePlay, 'play');
+ });
+ }
// Pause
this.bind(this.player.elements.buttons.restart, 'click', this.player.restart, 'restart');
@@ -622,36 +624,20 @@ class Listeners {
// Detect "natural" scroll - suppored on OS X Safari only
// Other browsers on OS X will be inverted until support improves
const inverted = event.webkitDirectionInvertedFromDevice;
- const step = 1 / 50;
- let direction = 0;
-
- // Scroll down (or up on natural) to decrease
- if (event.deltaY < 0 || event.deltaX > 0) {
- if (inverted) {
- this.player.decreaseVolume(step);
- direction = -1;
- } else {
- this.player.increaseVolume(step);
- direction = 1;
- }
- }
- // Scroll up (or down on natural) to increase
- if (event.deltaY > 0 || event.deltaX < 0) {
- if (inverted) {
- this.player.increaseVolume(step);
- direction = 1;
- } else {
- this.player.decreaseVolume(step);
- direction = -1;
- }
- }
+ // Get delta from event. Invert if `inverted` is true
+ const [x, y] = [event.deltaX, -event.deltaY]
+ .map(value => inverted ? -value : value);
+
+ // Using the biggest delta, normalize to 1 or -1 (or 0 if no delta)
+ const direction = Math.sign(Math.abs(x) > Math.abs(y) ? x : y);
+
+ // Change the volume by 2%
+ this.player.increaseVolume(direction / 50);
// Don't break page scrolling at max and min
- if (
- (direction === 1 && this.player.media.volume < 1) ||
- (direction === -1 && this.player.media.volume > 0)
- ) {
+ const { volume } = this.player.media;
+ if ((direction === 1 && volume < 1) || (direction === -1 && volume > 0)) {
event.preventDefault();
}
},
diff --git a/src/js/plugins/ads.js b/src/js/plugins/ads.js
index e0d49265..856772d5 100644
--- a/src/js/plugins/ads.js
+++ b/src/js/plugins/ads.js
@@ -49,7 +49,9 @@ class Ads {
}
get enabled() {
- return this.player.isVideo && this.player.config.ads.enabled && !is.empty(this.publisherId);
+ return (
+ this.player.isHTML5 && this.player.isVideo && this.player.config.ads.enabled && !is.empty(this.publisherId)
+ );
}
/**
diff --git a/src/js/plyr.js b/src/js/plyr.js
index c15e83cb..9f3def07 100644
--- a/src/js/plyr.js
+++ b/src/js/plyr.js
@@ -554,7 +554,7 @@ class Plyr {
*/
increaseVolume(step) {
const volume = this.media.muted ? 0 : this.volume;
- this.volume = volume + (is.number(step) ? step : 1);
+ this.volume = volume + (is.number(step) ? step : 0);
}
/**
@@ -562,8 +562,7 @@ class Plyr {
* @param {boolean} step - How much to decrease by (between 0 and 1)
*/
decreaseVolume(step) {
- const volume = this.media.muted ? 0 : this.volume;
- this.volume = volume - (is.number(step) ? step : 1);
+ this.increaseVolume(-step);
}
/**
diff --git a/src/js/utils/is.js b/src/js/utils/is.js
index cb2c07c6..b4760da4 100644
--- a/src/js/utils/is.js
+++ b/src/js/utils/is.js
@@ -3,65 +3,61 @@
// ==========================================================================
const getConstructor = input => (input !== null && typeof input !== 'undefined' ? input.constructor : null);
-
const instanceOf = (input, constructor) => Boolean(input && constructor && input instanceof constructor);
+const isNullOrUndefined = input => input === null || typeof input === 'undefined';
+const isObject = input => getConstructor(input) === Object;
+const isNumber = input => getConstructor(input) === Number && !Number.isNaN(input);
+const isString = input => getConstructor(input) === String;
+const isBoolean = input => getConstructor(input) === Boolean;
+const isFunction = input => getConstructor(input) === Function;
+const isArray = input => Array.isArray(input);
+const isWeakMap = input => instanceOf(input, WeakMap);
+const isNodeList = input => instanceOf(input, NodeList);
+const isElement = input => instanceOf(input, Element);
+const isTextNode = input => getConstructor(input) === Text;
+const isEvent = input => instanceOf(input, Event);
+const isCue = input => instanceOf(input, window.TextTrackCue) || instanceOf(input, window.VTTCue);
+const isTrack = input => instanceOf(input, TextTrack) || (!isNullOrUndefined(input) && isString(input.kind));
+
+const isEmpty = input =>
+ isNullOrUndefined(input) ||
+ ((isString(input) || isArray(input) || isNodeList(input)) && !input.length) ||
+ (isObject(input) && !Object.keys(input).length);
+
+const isUrl = input => {
+ // Accept a URL object
+ if (instanceOf(input, window.URL)) {
+ return true;
+ }
-const is = {
- object(input) {
- return getConstructor(input) === Object;
- },
- number(input) {
- return getConstructor(input) === Number && !Number.isNaN(input);
- },
- string(input) {
- return getConstructor(input) === String;
- },
- boolean(input) {
- return getConstructor(input) === Boolean;
- },
- function(input) {
- return getConstructor(input) === Function;
- },
- array(input) {
- return !is.nullOrUndefined(input) && Array.isArray(input);
- },
- weakMap(input) {
- return instanceOf(input, WeakMap);
- },
- nodeList(input) {
- return instanceOf(input, NodeList);
- },
- element(input) {
- return instanceOf(input, Element);
- },
- textNode(input) {
- return getConstructor(input) === Text;
- },
- event(input) {
- return instanceOf(input, Event);
- },
- cue(input) {
- return instanceOf(input, window.TextTrackCue) || instanceOf(input, window.VTTCue);
- },
- track(input) {
- return instanceOf(input, TextTrack) || (!is.nullOrUndefined(input) && is.string(input.kind));
- },
- url(input) {
- return (
- !is.nullOrUndefined(input) &&
- /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-/]))?/.test(input)
- );
- },
- nullOrUndefined(input) {
- return input === null || typeof input === 'undefined';
- },
- empty(input) {
- return (
- is.nullOrUndefined(input) ||
- ((is.string(input) || is.array(input) || is.nodeList(input)) && !input.length) ||
- (is.object(input) && !Object.keys(input).length)
- );
- },
+ // Add the protocol if required
+ let string = input;
+ if (!input.startsWith('http://') || !input.startsWith('https://')) {
+ string = `http://${input}`;
+ }
+
+ try {
+ return !isEmpty(new URL(string).hostname);
+ } catch (e) {
+ return false;
+ }
};
-export default is;
+export default {
+ nullOrUndefined: isNullOrUndefined,
+ object: isObject,
+ number: isNumber,
+ string: isString,
+ boolean: isBoolean,
+ function: isFunction,
+ array: isArray,
+ weakMap: isWeakMap,
+ nodeList: isNodeList,
+ element: isElement,
+ textNode: isTextNode,
+ event: isEvent,
+ cue: isCue,
+ track: isTrack,
+ url: isUrl,
+ empty: isEmpty,
+};