diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/js/plyr.js | 31 | ||||
-rw-r--r-- | src/less/variables.less | 2 | ||||
-rw-r--r-- | src/scss/variables.scss | 2 |
3 files changed, 23 insertions, 12 deletions
diff --git a/src/js/plyr.js b/src/js/plyr.js index ccc4bdee..a3430e2d 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -492,7 +492,7 @@ // Add text node if (is.string(text)) { - element.appendChild(document.createTextNode(text)); + element.textContent = text; } // Return built element @@ -508,6 +508,14 @@ prependChild(parent, element); } + // Remove all child elements + function emptyElement(element) { + var length = element.childNodes.length; + while (length--) { + element.removeChild(element.lastChild); + } + } + // Get a classname from selector function getClassname(selector) { return selector.replace('.', ''); @@ -981,8 +989,8 @@ attributes.forEach(function(attribute) { insertElement(type, player.elements.media, attribute); }); + } } - } // Get icon URL function getIconUrl() { @@ -1159,8 +1167,7 @@ break; } - var label = document.createTextNode('% ' + suffix.toLowerCase()); - progress.appendChild(label); + progress.textContent = '% ' + suffix.toLowerCase(); } player.elements.display[type] = progress; @@ -1389,7 +1396,7 @@ config.tracks.forEach(function(track, index) { if (is.function(track)) { return; - } + } var option = createElement('li'); @@ -1404,7 +1411,7 @@ }); } break; - } + } pane.appendChild(options); @@ -1937,7 +1944,7 @@ var content = createElement('span'); // Empty the container - captions.innerHTML = ''; + emptyElement(captions); // Default to empty if (is.undefined(caption)) { @@ -2079,6 +2086,10 @@ //player.elements.buttons.captions_menu.innerHTML = show ? 'Off' : 'On'; //TODO: display lang getElement('[data-captions="settings"]').innerHTML = getSubsLangValue(); + // Set current language etc + //elements.buttons.captions_menu.innerHTML = show ? 'Off' : 'On'; + //getElement('[data-captions="settings"]').innerHTML = getSubsLangValue(); + // Toggle state toggleState(player.elements.buttons.captions, player.captions.enabled); @@ -3083,7 +3094,7 @@ // It should be a number, but parse it just incase var duration = parseInt(config.duration); - // True duration + // True duration var mediaDuration = 0; // Only if duration available @@ -3449,10 +3460,10 @@ var display = (displayHours ? hours + ':' : '') + mins + ':' + secs; // Render - element.innerHTML = display; + element.textContent = label; // Return for looping - return display; + return label; } // Show the duration on metadataloaded diff --git a/src/less/variables.less b/src/less/variables.less index 5abe3464..bcc80a02 100644 --- a/src/less/variables.less +++ b/src/less/variables.less @@ -17,7 +17,7 @@ @plyr-font-size-base: 16px; // Captions -@plyr-captions-bg: fade(#000, 85%); +@plyr-captions-bg: fade(#000, 60%); @plyr-captions-color: #fff; @plyr-font-size-captions-base: @plyr-font-size-base; @plyr-font-size-captions-medium: ceil(@plyr-font-size-base * 1.5); diff --git a/src/scss/variables.scss b/src/scss/variables.scss index da75f11a..39b147da 100644 --- a/src/scss/variables.scss +++ b/src/scss/variables.scss @@ -18,7 +18,7 @@ $plyr-font-size-small: 14px !default; $plyr-font-size-base: 16px !default; // Captions -$plyr-captions-bg: transparentize(#000, .3) !default; +$plyr-captions-bg: transparentize(#000, .4) !default; $plyr-captions-color: #fff !default; $plyr-font-size-captions-base: $plyr-font-size-base !default; $plyr-font-size-captions-medium: ceil($plyr-font-size-base * 1.5) !default; |