diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/js/plyr.js | 39 | ||||
| -rw-r--r-- | src/less/variables.less | 2 | ||||
| -rw-r--r-- | src/scss/variables.scss | 2 |
3 files changed, 27 insertions, 16 deletions
diff --git a/src/js/plyr.js b/src/js/plyr.js index 9f966db8..69509068 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('.', ''); @@ -880,7 +888,7 @@ settings: { tabs: {}, panes: {} - } + } }; // Set media @@ -971,8 +979,8 @@ attributes.forEach(function(attribute) { insertElement(type, plyr.media, attribute); }); + } } - } // Get icon URL function getIconUrl() { @@ -1149,8 +1157,7 @@ break; } - var label = document.createTextNode('% ' + suffix.toLowerCase()); - progress.appendChild(label); + progress.textContent = '% ' + suffix.toLowerCase(); } elements.display[type] = progress; @@ -1379,7 +1386,7 @@ config.tracks.forEach(function(track, index) { if (is.function(track)) { return; - } + } var option = createElement('li'); @@ -1394,7 +1401,7 @@ }); } break; - } + } pane.appendChild(options); @@ -1927,7 +1934,7 @@ var content = createElement('span'); // Empty the container - captions.innerHTML = ''; + emptyElement(captions); // Default to empty if (is.undefined(caption)) { @@ -1945,7 +1952,7 @@ captions.appendChild(content); // Force redraw (for Safari) - var redraw = captions.offsetHeight; + // var redraw = captions.offsetHeight; } } @@ -2068,6 +2075,10 @@ 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(elements.buttons.captions, plyr.captionsEnabled); @@ -3072,7 +3083,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 @@ -3434,14 +3445,14 @@ plyr.secs = ('0' + plyr.secs).slice(-2); plyr.mins = ('0' + plyr.mins).slice(-2); - // Generate display - var display = (displayHours ? plyr.hours + ':' : '') + plyr.mins + ':' + plyr.secs; + // Generate label + var label = (displayHours ? plyr.hours + ':' : '') + plyr.mins + ':' + plyr.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; |