aboutsummaryrefslogtreecommitdiffstats
path: root/src/js/utils
diff options
context:
space:
mode:
Diffstat (limited to 'src/js/utils')
-rw-r--r--src/js/utils/animation.js14
-rw-r--r--src/js/utils/elements.js51
-rw-r--r--src/js/utils/i18n.js34
-rw-r--r--src/js/utils/is.js2
4 files changed, 80 insertions, 21 deletions
diff --git a/src/js/utils/animation.js b/src/js/utils/animation.js
index 95e39f03..49bc0b8c 100644
--- a/src/js/utils/animation.js
+++ b/src/js/utils/animation.js
@@ -15,7 +15,9 @@ export const transitionEndEvent = (() => {
transition: 'transitionend',
};
- const type = Object.keys(events).find(event => element.style[event] !== undefined);
+ const type = Object.keys(events).find(
+ event => element.style[event] !== undefined,
+ );
return is.string(type) ? events[type] : false;
})();
@@ -23,8 +25,12 @@ export const transitionEndEvent = (() => {
// Force repaint of element
export function repaint(element) {
setTimeout(() => {
- toggleHidden(element, true);
- element.offsetHeight; // eslint-disable-line
- toggleHidden(element, false);
+ try {
+ toggleHidden(element, true);
+ element.offsetHeight; // eslint-disable-line
+ toggleHidden(element, false);
+ } catch (e) {
+ // Do nothing
+ }
}, 0);
}
diff --git a/src/js/utils/elements.js b/src/js/utils/elements.js
index 69e4d46c..a6722da2 100644
--- a/src/js/utils/elements.js
+++ b/src/js/utils/elements.js
@@ -70,12 +70,19 @@ export function createElement(type, attributes, text) {
// Inaert an element after another
export function insertAfter(element, target) {
+ if (!is.element(element) || !is.element(target)) {
+ return;
+ }
+
target.parentNode.insertBefore(element, target.nextSibling);
}
// Insert a DocumentFragment
export function insertElement(type, parent, attributes, text) {
- // Inject the new <element>
+ if (!is.element(parent)) {
+ return;
+ }
+
parent.appendChild(createElement(type, attributes, text));
}
@@ -95,6 +102,10 @@ export function removeElement(element) {
// Remove all child elements
export function emptyElement(element) {
+ if (!is.element(element)) {
+ return;
+ }
+
let { length } = element.childNodes;
while (length > 0) {
@@ -180,7 +191,7 @@ export function toggleHidden(element, hidden) {
let hide = hidden;
if (!is.boolean(hide)) {
- hide = !element.hasAttribute('hidden');
+ hide = !element.hidden;
}
if (hide) {
@@ -192,6 +203,10 @@ export function toggleHidden(element, hidden) {
// Mirror Element.classList.toggle, with IE compatibility for "force" argument
export function toggleClass(element, className, force) {
+ if (is.nodeList(element)) {
+ return Array.from(element).map(e => toggleClass(e, className, force));
+ }
+
if (is.element(element)) {
let method = 'toggle';
if (typeof force !== 'undefined') {
@@ -202,7 +217,7 @@ export function toggleClass(element, className, force) {
return element.classList.contains(className);
}
- return null;
+ return false;
}
// Has class name
@@ -238,19 +253,6 @@ export function getElement(selector) {
return this.elements.container.querySelector(selector);
}
-// Get the focused element
-export function getFocusElement() {
- let focused = document.activeElement;
-
- if (!focused || focused === document.body) {
- focused = null;
- } else {
- focused = document.querySelector(':focus');
- }
-
- return focused;
-}
-
// Trap focus inside container
export function trapFocus(element = null, toggle = false) {
if (!is.element(element)) {
@@ -268,7 +270,7 @@ export function trapFocus(element = null, toggle = false) {
}
// Get the current focused element
- const focused = getFocusElement();
+ const focused = document.activeElement;
if (focused === last && !event.shiftKey) {
// Move focus to first element that can be tabbed if Shift isn't used
@@ -283,3 +285,18 @@ export function trapFocus(element = null, toggle = false) {
toggleListener.call(this, this.elements.container, 'keydown', trap, toggle, false);
}
+
+// Set focus and tab focus class
+export function setFocus(element = null, tabFocus = false) {
+ if (!is.element(element)) {
+ return;
+ }
+
+ // Set regular focus
+ element.focus();
+
+ // If we want to mimic keyboard focus via tab
+ if (tabFocus) {
+ toggleClass(element, this.config.classNames.tabFocus);
+ }
+}
diff --git a/src/js/utils/i18n.js b/src/js/utils/i18n.js
new file mode 100644
index 00000000..f71e1a42
--- /dev/null
+++ b/src/js/utils/i18n.js
@@ -0,0 +1,34 @@
+// ==========================================================================
+// Plyr internationalization
+// ==========================================================================
+
+import is from './is';
+import { getDeep } from './objects';
+import { replaceAll } from './strings';
+
+const i18n = {
+ get(key = '', config = {}) {
+ if (is.empty(key) || is.empty(config)) {
+ return '';
+ }
+
+ let string = getDeep(config.i18n, key);
+
+ if (is.empty(string)) {
+ return '';
+ }
+
+ const replace = {
+ '{seektime}': config.seekTime,
+ '{title}': config.title,
+ };
+
+ Object.entries(replace).forEach(([key, value]) => {
+ string = replaceAll(string, key, value);
+ });
+
+ return string;
+ },
+};
+
+export default i18n;
diff --git a/src/js/utils/is.js b/src/js/utils/is.js
index b4760da4..2952d486 100644
--- a/src/js/utils/is.js
+++ b/src/js/utils/is.js
@@ -16,6 +16,7 @@ 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 isKeyboardEvent = input => instanceOf(input, KeyboardEvent);
const isCue = input => instanceOf(input, window.TextTrackCue) || instanceOf(input, window.VTTCue);
const isTrack = input => instanceOf(input, TextTrack) || (!isNullOrUndefined(input) && isString(input.kind));
@@ -56,6 +57,7 @@ export default {
element: isElement,
textNode: isTextNode,
event: isEvent,
+ keyboardEvent: isKeyboardEvent,
cue: isCue,
track: isTrack,
url: isUrl,