diff options
author | Sam Potts <sam@potts.es> | 2018-06-18 21:41:25 +1000 |
---|---|---|
committer | Sam Potts <sam@potts.es> | 2018-06-18 21:41:25 +1000 |
commit | cc3c0b54484e6f5a7b4dba8a36a44f345e462f26 (patch) | |
tree | 5fe2838546d9f981b21572dee88ee7a1c3195477 /src/js/source.js | |
parent | 4811e3333f1417bc9e14f6cc38afc789e9051c4c (diff) | |
parent | 3c9c1b4cdcd0eb9076c3f0bafbabb057ee140c42 (diff) | |
download | plyr-cc3c0b54484e6f5a7b4dba8a36a44f345e462f26.tar.lz plyr-cc3c0b54484e6f5a7b4dba8a36a44f345e462f26.tar.xz plyr-cc3c0b54484e6f5a7b4dba8a36a44f345e462f26.zip |
Merge branch 'develop'
Diffstat (limited to 'src/js/source.js')
-rw-r--r-- | src/js/source.js | 65 |
1 files changed, 27 insertions, 38 deletions
diff --git a/src/js/source.js b/src/js/source.js index e9a2938e..8c9fdf44 100644 --- a/src/js/source.js +++ b/src/js/source.js @@ -2,23 +2,25 @@ // Plyr source update // ========================================================================== +import { providers } from './config/types'; import html5 from './html5'; import media from './media'; import support from './support'; -import { providers } from './types'; import ui from './ui'; -import utils from './utils'; +import { createElement, insertElement, removeElement } from './utils/elements'; +import is from './utils/is'; +import { getDeep } from './utils/objects'; const source = { // Add elements to HTML5 media (source, tracks, etc) insertElements(type, attributes) { - if (utils.is.string(attributes)) { - utils.insertElement(type, this.media, { + if (is.string(attributes)) { + insertElement(type, this.media, { src: attributes, }); - } else if (utils.is.array(attributes)) { + } else if (is.array(attributes)) { attributes.forEach(attribute => { - utils.insertElement(type, this.media, attribute); + insertElement(type, this.media, attribute); }); } }, @@ -26,7 +28,7 @@ const source = { // Update source // Sources are not checked for support so be careful change(input) { - if (!utils.is.object(input) || !('sources' in input) || !input.sources.length) { + if (!getDeep(input, 'sources.length')) { this.debug.warn('Invalid source format'); return; } @@ -42,47 +44,34 @@ const source = { this.options.quality = []; // Remove elements - utils.removeElement(this.media); + removeElement(this.media); this.media = null; // Reset class name - if (utils.is.element(this.elements.container)) { + if (is.element(this.elements.container)) { this.elements.container.removeAttribute('class'); } // Set the type and provider - this.type = input.type; - this.provider = !utils.is.empty(input.sources[0].provider) ? input.sources[0].provider : providers.html5; - - // Check for support - this.supported = support.check(this.type, this.provider, this.config.playsinline); - - // Create new markup - switch (`${this.provider}:${this.type}`) { - case 'html5:video': - this.media = utils.createElement('video'); - break; - - case 'html5:audio': - this.media = utils.createElement('audio'); - break; - - case 'youtube:video': - case 'vimeo:video': - this.media = utils.createElement('div', { - src: input.sources[0].src, - }); - break; - - default: - break; - } + const { sources, type } = input; + const [{ provider = providers.html5, src }] = sources; + const tagName = provider === 'html5' ? type : 'div'; + const attributes = provider === 'html5' ? {} : { src }; + + Object.assign(this, { + provider, + type, + // Check for support + supported: support.check(type, provider, this.config.playsinline), + // Create new element + media: createElement(tagName, attributes), + }); // Inject the new element this.elements.container.appendChild(this.media); // Autoplay the new source? - if (utils.is.boolean(input.autoplay)) { + if (is.boolean(input.autoplay)) { this.config.autoplay = input.autoplay; } @@ -94,7 +83,7 @@ const source = { if (this.config.autoplay) { this.media.setAttribute('autoplay', ''); } - if (!utils.is.empty(input.poster)) { + if (!is.empty(input.poster)) { this.poster = input.poster; } if (this.config.loop.active) { @@ -113,7 +102,7 @@ const source = { // Set new sources for html5 if (this.isHTML5) { - source.insertElements.call(this, 'source', input.sources); + source.insertElements.call(this, 'source', sources); } // Set video title |