diff options
Diffstat (limited to 'src/js/utils.js')
| -rw-r--r-- | src/js/utils.js | 84 |
1 files changed, 45 insertions, 39 deletions
diff --git a/src/js/utils.js b/src/js/utils.js index b6ba0941..c36763dd 100644 --- a/src/js/utils.js +++ b/src/js/utils.js @@ -11,63 +11,64 @@ const utils = { // Check variable types is: { object(input) { - return this.getConstructor(input) === Object; + return utils.getConstructor(input) === Object; }, number(input) { - return this.getConstructor(input) === Number && !Number.isNaN(input); + return utils.getConstructor(input) === Number && !Number.isNaN(input); }, string(input) { - return this.getConstructor(input) === String; + return utils.getConstructor(input) === String; }, boolean(input) { - return this.getConstructor(input) === Boolean; + return utils.getConstructor(input) === Boolean; }, function(input) { - return this.getConstructor(input) === Function; + return utils.getConstructor(input) === Function; }, array(input) { - return !this.nullOrUndefined(input) && Array.isArray(input); + return !utils.is.nullOrUndefined(input) && Array.isArray(input); }, weakMap(input) { - return this.instanceof(input, WeakMap); + return utils.is.instanceof(input, WeakMap); }, nodeList(input) { - return this.instanceof(input, NodeList); + return utils.is.instanceof(input, NodeList); }, element(input) { - return this.instanceof(input, Element); + return utils.is.instanceof(input, Element); }, textNode(input) { - return this.getConstructor(input) === Text; + return utils.getConstructor(input) === Text; }, event(input) { - return this.instanceof(input, Event); + return utils.is.instanceof(input, Event); }, cue(input) { - return this.instanceof(input, window.TextTrackCue) || this.instanceof(input, window.VTTCue); + return utils.is.instanceof(input, window.TextTrackCue) || utils.is.instanceof(input, window.VTTCue); }, track(input) { - return this.instanceof(input, TextTrack) || (!this.nullOrUndefined(input) && this.string(input.kind)); + return utils.is.instanceof(input, TextTrack) || (!utils.is.nullOrUndefined(input) && utils.is.string(input.kind)); }, url(input) { - return !this.nullOrUndefined(input) && /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-/]))?/.test(input); + return !utils.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 ( - this.nullOrUndefined(input) || - ((this.string(input) || this.array(input) || this.nodeList(input)) && !input.length) || - (this.object(input) && !Object.keys(input).length) + utils.is.nullOrUndefined(input) || + ((utils.is.string(input) || utils.is.array(input) || utils.is.nodeList(input)) && !input.length) || + (utils.is.object(input) && !Object.keys(input).length) ); }, instanceof(input, constructor) { return Boolean(input && constructor && input instanceof constructor); }, - getConstructor(input) { - return !this.nullOrUndefined(input) ? input.constructor : null; - }, + }, + + getConstructor(input) { + return !utils.is.nullOrUndefined(input) ? input.constructor : null; }, // Unfortunately, due to mixed support, UA sniffing is required @@ -151,24 +152,23 @@ const utils = { return; } - const prefix = 'cache-'; + const prefix = 'cache'; const hasId = utils.is.string(id); let isCached = false; - const exists = () => document.querySelectorAll(`#${id}`).length; + const exists = () => document.getElementById(id) !== null; + + const update = (container, data) => { + container.innerHTML = data; - function injectSprite(data) { // Check again incase of race condition if (hasId && exists()) { return; } - // Inject content - this.innerHTML = data; - // Inject the SVG to the body - document.body.insertBefore(this, document.body.childNodes[0]); - } + document.body.insertAdjacentElement('afterbegin', container); + }; // Only load once if ID set if (!hasId || !exists()) { @@ -184,13 +184,12 @@ const utils = { // Check in cache if (useStorage) { - const cached = window.localStorage.getItem(prefix + id); + const cached = window.localStorage.getItem(`${prefix}-${id}`); isCached = cached !== null; if (isCached) { const data = JSON.parse(cached); - injectSprite.call(container, data.content); - return; + update(container, data.content); } } @@ -204,14 +203,14 @@ const utils = { if (useStorage) { window.localStorage.setItem( - prefix + id, + `${prefix}-${id}`, JSON.stringify({ content: result, }), ); } - injectSprite.call(container, result); + update(container, result); }) .catch(() => {}); } @@ -627,16 +626,16 @@ const utils = { formatTime(time = 0, displayHours = false, inverted = false) { // Bail if the value isn't a number if (!utils.is.number(time)) { - return this.formatTime(null, displayHours, inverted); + return utils.formatTime(null, displayHours, inverted); } // Format time component to add leading zero const format = value => `0${value}`.slice(-2); // Breakdown to hours, mins, secs - let hours = this.getHours(time); - const mins = this.getMinutes(time); - const secs = this.getSeconds(time); + let hours = utils.getHours(time); + const mins = utils.getMinutes(time); + const secs = utils.getSeconds(time); // Do we need to display hours? if (displayHours || hours > 0) { @@ -794,10 +793,10 @@ const utils = { // Parse URL if needed if (input.startsWith('http://') || input.startsWith('https://')) { - ({ search } = this.parseUrl(input)); + ({ search } = utils.parseUrl(input)); } - if (this.is.empty(search)) { + if (utils.is.empty(search)) { return null; } @@ -833,6 +832,13 @@ const utils = { return fragment.firstChild.innerText; }, + // Like outerHTML, but also works for DocumentFragment + getHTML(element) { + const wrapper = document.createElement('div'); + wrapper.appendChild(element); + return wrapper.innerHTML; + }, + // Get aspect ratio for dimensions getAspectRatio(width, height) { const getRatio = (w, h) => (h === 0 ? w : getRatio(h, w % h)); |