aboutsummaryrefslogtreecommitdiffstats
path: root/src/js
diff options
context:
space:
mode:
Diffstat (limited to 'src/js')
-rw-r--r--src/js/controls.js2
-rw-r--r--src/js/listeners.js10
-rw-r--r--src/js/plyr.js2
-rw-r--r--src/js/utils/elements.js8
-rw-r--r--src/js/utils/events.js30
5 files changed, 19 insertions, 33 deletions
diff --git a/src/js/controls.js b/src/js/controls.js
index 6d15e486..0e28c222 100644
--- a/src/js/controls.js
+++ b/src/js/controls.js
@@ -1068,7 +1068,7 @@ const controls = {
};
// Listen for the transition finishing and restore auto height/width
- once(container, transitionEndEvent, restore);
+ once.call(this, container, transitionEndEvent, restore);
// Set dimensions to target
container.style.width = `${size.width}px`;
diff --git a/src/js/listeners.js b/src/js/listeners.js
index 65d24277..283bd4a2 100644
--- a/src/js/listeners.js
+++ b/src/js/listeners.js
@@ -210,7 +210,7 @@ class Listeners {
toggleListener.call(this.player, document.body, 'click', this.toggleMenu, toggle);
// Detect touch by events
- once(document.body, 'touchstart', this.firstTouch);
+ once.call(this.player, document.body, 'touchstart', this.firstTouch);
}
// Container listeners
@@ -453,7 +453,9 @@ class Listeners {
};
// Play/pause toggle
- bind(this.player.elements.buttons.play, 'click', this.player.togglePlay, 'play');
+ Array.from(this.player.elements.buttons.play).forEach(button => {
+ bind(button, 'click', this.player.togglePlay, 'play');
+ });
// Pause
bind(this.player.elements.buttons.restart, 'click', this.player.restart, 'restart');
@@ -634,8 +636,8 @@ class Listeners {
// Polyfill for lower fill in <input type="range"> for webkit
if (browser.isWebkit) {
- bind(getElements.call(this.player, 'input[type="range"]'), 'input', event => {
- controls.updateRangeFill.call(this.player, event.target);
+ Array.from(getElements.call(this.player, 'input[type="range"]')).forEach(element => {
+ bind(element, 'input', event => controls.updateRangeFill.call(this.player, event.target));
});
}
diff --git a/src/js/plyr.js b/src/js/plyr.js
index 71619851..543291e7 100644
--- a/src/js/plyr.js
+++ b/src/js/plyr.js
@@ -975,7 +975,7 @@ class Plyr {
* @param {function} callback - Callback for when event occurs
*/
once(event, callback) {
- once(this.elements.container, event, callback);
+ once.call(this, this.elements.container, event, callback);
}
/**
* Remove event listeners
diff --git a/src/js/utils/elements.js b/src/js/utils/elements.js
index 4d4f97cd..55866367 100644
--- a/src/js/utils/elements.js
+++ b/src/js/utils/elements.js
@@ -2,7 +2,7 @@
// Element utils
// ==========================================================================
-import { off, on } from './events';
+import { toggleListener } from './events';
import is from './is';
// Wrap an element
@@ -277,11 +277,7 @@ export function trapFocus(element = null, toggle = false) {
}
};
- if (toggle) {
- on(this.elements.container, 'keydown', trap, false);
- } else {
- off(this.elements.container, 'keydown', trap, false);
- }
+ toggleListener.call(this, this.elements.container, 'keydown', trap, toggle, false);
}
// Toggle aria-pressed state on a toggle button
diff --git a/src/js/utils/events.js b/src/js/utils/events.js
index a8e05f54..d6ffc043 100644
--- a/src/js/utils/events.js
+++ b/src/js/utils/events.js
@@ -27,21 +27,9 @@ const supportsPassiveListeners = (() => {
})();
// Toggle event listener
-export function toggleListener(elements, event, callback, toggle = false, passive = true, capture = false, once = false) {
- // Bail if no elemetns, event, or callback
- if (is.empty(elements) || is.empty(event) || !is.function(callback)) {
- return;
- }
-
- // If a nodelist is passed, call itself on each node
- if (is.nodeList(elements) || is.array(elements)) {
- // Create listener for each node
- Array.from(elements).forEach(element => {
- if (element instanceof Node) {
- toggleListener.call(null, element, event, callback, toggle, passive, capture);
- }
- });
-
+export function toggleListener(element, event, callback, toggle = false, passive = true, capture = false) {
+ // Bail if no element, event, or callback
+ if (!is.element(element) || is.empty(event) || !is.function(callback)) {
return;
}
@@ -64,12 +52,12 @@ export function toggleListener(elements, event, callback, toggle = false, passiv
// If a single node is passed, bind the event listener
events.forEach(type => {
- if (this && this.eventListeners && toggle && !once) {
+ if (this && this.eventListeners && toggle) {
// Cache event listener
- this.eventListeners.push({ elements, type, callback, options });
+ this.eventListeners.push({ element, type, callback, options });
}
- elements[toggle ? 'addEventListener' : 'removeEventListener'](type, callback, options);
+ element[toggle ? 'addEventListener' : 'removeEventListener'](type, callback, options);
});
}
@@ -90,7 +78,7 @@ export function once(element, events = '', callback, passive = true, capture = f
callback.apply(this, args);
}
- toggleListener(element, events, onceCallback, true, passive, capture, true);
+ toggleListener.call(this, element, events, onceCallback, true, passive, capture);
}
// Trigger event
@@ -116,8 +104,8 @@ export function triggerEvent(element, type = '', bubbles = false, detail = {}) {
export function unbindListeners() {
if (this && this.eventListeners) {
this.eventListeners.forEach(item => {
- const { elements, type, callback, options } = item;
- elements.removeEventListener(type, callback, options);
+ const { element, type, callback, options } = item;
+ element.removeEventListener(type, callback, options);
});
this.eventListeners = [];