diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/js/defaults.js | 2 | ||||
-rw-r--r-- | src/js/plyr.js | 6 | ||||
-rw-r--r-- | src/js/utils.js | 4 | ||||
-rw-r--r-- | src/sass/components/sliders.scss | 45 | ||||
-rw-r--r-- | src/sass/lib/mixins.scss | 9 | ||||
-rw-r--r-- | src/sass/settings/sliders.scss | 3 |
6 files changed, 47 insertions, 22 deletions
diff --git a/src/js/defaults.js b/src/js/defaults.js index daf0c06e..20db0b9c 100644 --- a/src/js/defaults.js +++ b/src/js/defaults.js @@ -56,7 +56,7 @@ const defaults = { // Sprite (for icons) loadSprite: true, iconPrefix: 'plyr', - iconUrl: 'https://cdn.plyr.io/3.0.0-beta.10/plyr.svg', + iconUrl: 'https://cdn.plyr.io/3.0.0-beta.11/plyr.svg', // Blank video (used to prevent errors on source change) blankVideo: 'https://cdn.plyr.io/static/blank.mp4', diff --git a/src/js/plyr.js b/src/js/plyr.js index 131f5a64..f64c15ae 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -1,6 +1,6 @@ // ========================================================================== // Plyr -// plyr.js v3.0.0-beta.10 +// plyr.js v3.0.0-beta.11 // https://github.com/sampotts/plyr // License: The MIT License (MIT) // ========================================================================== @@ -559,6 +559,10 @@ class Plyr { return true; } + if (this.isAudio) { + return true; + } + // Get audio tracks return this.media.mozHasAudio || Boolean(this.media.webkitAudioDecodedByteCount) || Boolean(this.media.audioTracks && this.media.audioTracks.length); } diff --git a/src/js/utils.js b/src/js/utils.js index 7c277301..c362c62e 100644 --- a/src/js/utils.js +++ b/src/js/utils.js @@ -9,7 +9,7 @@ const utils = { // Check variable types is: { plyr(input) { - return this.instanceof(input, Plyr); + return this.instanceof(input, window.Plyr); }, object(input) { return this.getConstructor(input) === Object; @@ -587,7 +587,7 @@ const utils = { const event = new CustomEvent(type, { bubbles: utils.is.boolean(bubbles) ? bubbles : false, detail: Object.assign({}, detail, { - plyr: this instanceof Plyr ? this : null, + plyr: utils.is.plyr(this) ? this : null, }), }); diff --git a/src/sass/components/sliders.scss b/src/sass/components/sliders.scss index 13895faa..62b8d7a9 100644 --- a/src/sass/components/sliders.scss +++ b/src/sass/components/sliders.scss @@ -91,21 +91,6 @@ @include plyr-tab-focus(); } } - - // Pressed styles - &:active { - &::-webkit-slider-thumb { - @include plyr-range-thumb-active(); - } - - &::-moz-range-thumb { - @include plyr-range-thumb-active(); - } - - &::-ms-thumb { - @include plyr-range-thumb-active(); - } - } } // Video range inputs @@ -121,6 +106,21 @@ &::-ms-track { background-color: $plyr-video-range-track-bg; } + + // Pressed styles + &:active { + &::-webkit-slider-thumb { + @include plyr-range-thumb-active(); + } + + &::-moz-range-thumb { + @include plyr-range-thumb-active(); + } + + &::-ms-thumb { + @include plyr-range-thumb-active(); + } + } } // Audio range inputs @@ -136,4 +136,19 @@ &::-ms-track { background-color: $plyr-audio-range-track-bg; } + + // Pressed styles + &:active { + &::-webkit-slider-thumb { + @include plyr-range-thumb-active($plyr-audio-range-thumb-shadow-color); + } + + &::-moz-range-thumb { + @include plyr-range-thumb-active($plyr-audio-range-thumb-shadow-color); + } + + &::-ms-thumb { + @include plyr-range-thumb-active($plyr-audio-range-thumb-shadow-color); + } + } } diff --git a/src/sass/lib/mixins.scss b/src/sass/lib/mixins.scss index 2abe6b8f..8b333f65 100644 --- a/src/sass/lib/mixins.scss +++ b/src/sass/lib/mixins.scss @@ -44,8 +44,8 @@ width: $plyr-range-thumb-height; } -@mixin plyr-range-thumb-active() { - box-shadow: 0 0 0 $plyr-range-thumb-active-shadow-width transparentize($plyr-range-thumb-bg, 0.5); +@mixin plyr-range-thumb-active($color: rgba($plyr-range-thumb-bg, 0.5)) { + box-shadow: $plyr-range-thumb-shadow, 0 0 0 $plyr-range-thumb-active-shadow-width $color; } // Fullscreen styles @@ -87,6 +87,11 @@ } } + // Hide cursor in fullscreen when controls hidden + &.plyr--hide-controls { + cursor: none; + } + // Large captions in full screen on larger screens @media (min-width: $plyr-bp-lg) { .plyr__captions { diff --git a/src/sass/settings/sliders.scss b/src/sass/settings/sliders.scss index 25d64c05..3c75b797 100644 --- a/src/sass/settings/sliders.scss +++ b/src/sass/settings/sliders.scss @@ -9,7 +9,7 @@ $plyr-range-thumb-active-shadow-width: 3px !default; $plyr-range-thumb-height: 14px !default; $plyr-range-thumb-bg: #fff !default; $plyr-range-thumb-border: 2px solid transparent !default; -$plyr-range-thumb-shadow: 0 1px 1px rgba($plyr-video-controls-bg, 0.15), 0 0 0 1px rgba($plyr-color-gunmetal, 0.2) !default; +$plyr-range-thumb-shadow: 0 1px 1px rgba(#000, 0.15), 0 0 0 1px rgba($plyr-color-gunmetal, 0.2) !default; // Track $plyr-range-track-height: 6px !default; @@ -21,3 +21,4 @@ $plyr-range-fill-bg: $plyr-color-main !default; // Type specific $plyr-video-range-track-bg: $plyr-video-progress-buffered-bg !default; $plyr-audio-range-track-bg: $plyr-audio-progress-buffered-bg !default; +$plyr-audio-range-thumb-shadow-color: rgba(#000, 0.1) !default; |