box-content-preview 3.43.0 → 3.45.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/dist/lib/88.css +1 -1
- package/dist/lib/index.css +3 -0
- package/dist/lib/index.js +306 -13
- package/package.json +1 -1
package/dist/lib/index.css
CHANGED
|
@@ -67,6 +67,9 @@
|
|
|
67
67
|
.bp-VideoControls{display:flex;flex-direction:column;width:100%;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);padding:40px 20px 8px 20px}.bp-VideoControls .bp-FullscreenToggle{width:36px;height:40px}.bp-VideoControls-bar{display:flex;padding:0 10px 5px;display:grid;align-items:center}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups{justify-content:flex-end}.bp-VideoControls-bar.bp-VideoControls-bar--two-groups .bp-VideoControls-group--play-pause{position:absolute;left:50%;transform:translateX(-50%)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups{grid-template-columns:repeat(3, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups.bp-VideoControls-bar--narrow-video{grid-template-columns:repeat(2, 1fr)}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--annotations{justify-self:flex-start}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--play-pause{justify-self:center}.bp-VideoControls-bar.bp-VideoControls-bar--three-groups .bp-VideoControls-group--media-controls{justify-self:flex-end}.bp-VideoControls-group{display:flex;align-items:center}.bp-VideoControls-settings{position:relative}.bp-VideoControls-settings .bp-SettingsFlyout{right:15px}.bp-VideoControls-settings .bp-SettingsToggle-button{width:36px;height:40px}
|
|
68
68
|
.bp-media-scrubber-container{position:relative;width:100%;height:16px}.bp-media-scrubber-wrapper{position:absolute;top:0;left:50%;width:100%;height:100%}.bp-media-scrubber{position:absolute;top:7px;left:-50%;width:100%;height:3px}.bp-media-scrubber-converted,.bp-media-scrubber-buffered,.bp-media-scrubber-played,.bp-media-scrubber-underlay{position:absolute;height:3px;transition:transform .1s ease-in-out}.bp-media-scrubber-converted{background-color:rgba(255,255,255,.5);cursor:pointer}.bp-media-scrubber-buffered{position:absolute;height:3px;background-color:#fff}.bp-media-scrubber-played{background-color:#0061d5;cursor:pointer}.bp-media-scrubber-underlay{width:100%;cursor:not-allowed}.bp-media-scrubber-handle{position:absolute;top:-4.25px;width:12px;height:12px;margin-left:-6px;background-color:#0061d5;border-radius:6px;transform:scale(0);cursor:pointer;transition:transform .05s ease-in-out}.bp-media-scrubber-container:hover .bp-media-scrubber-handle,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container:hover .bp-media-scrubber-converted,.bp-media-scrubber-container:hover .bp-media-scrubber-buffered,.bp-media-scrubber-container:hover .bp-media-scrubber-played,.bp-media-scrubber-container:hover .bp-media-scrubber-underlay,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-settings{position:absolute;right:16px;bottom:60px;display:inline-block;max-width:400px;max-height:210px;padding:8px;overflow-x:hidden;overflow-y:auto;color:#444;font-size:10px;line-height:0;background-color:#fff;border:1px solid #bdc3c7;border-radius:2px;visibility:hidden;transition:width .2s,height .2s;-ms-overflow-style:-ms-autohiding-scrollbar}.bp-media-settings-is-open .bp-media-settings{visibility:visible}.bp-media-mp3 .bp-media-settings{right:0;bottom:65px}.bp-media-settings-in-transition{overflow:hidden}.bp-media-settings-menu{display:table}.bp-media-settings-menu-autoplay,.bp-media-settings-menu-quality,.bp-media-settings-menu-speed,.bp-media-settings-menu-subtitles,.bp-media-settings-menu-audiotracks,.bp-media-settings-show-autoplay .bp-media-settings-menu-main,.bp-media-settings-show-speed .bp-media-settings-menu-main,.bp-media-settings-show-quality .bp-media-settings-menu-main,.bp-media-settings-show-subtitles .bp-media-settings-menu-main,.bp-media-settings-show-audiotracks .bp-media-settings-menu-main{display:none}.bp-media-settings-show-autoplay .bp-media-settings-menu-autoplay,.bp-media-settings-show-speed .bp-media-settings-menu-speed,.bp-media-settings-show-quality .bp-media-settings-menu-quality,.bp-media-settings-show-subtitles .bp-media-settings-menu-subtitles,.bp-media-settings-show-audiotracks .bp-media-settings-menu-audiotracks{display:table}.bp-media-mp4 .bp-media-settings-item-quality,.bp-media-mp4 .bp-media-settings-item-subtitles,.bp-media-mp4 .bp-media-settings-item-audiotracks,.bp-media-mp3 .bp-media-settings-item-quality,.bp-media-mp3 .bp-media-settings-item-subtitles,.bp-media-mp3 .bp-media-settings-item-audiotracks{display:none}.bp-media-settings-item,.bp-media-settings-sub-item{display:table-row;height:26px;padding:4px;overflow:hidden;white-space:nowrap;outline:0 none;cursor:pointer}.bp-media-settings-item:hover,.bp-media-settings-sub-item:hover{background-color:#f6fafd}.bp-media-settings-item:hover .bp-media-settings-icon svg,.bp-media-settings-sub-item:hover .bp-media-settings-icon svg{fill:#2c3e50}.bp-media-settings-item:hover .bp-media-settings-label,.bp-media-settings-sub-item:hover .bp-media-settings-label{color:#aabed1}.bp-media-settings-item:hover .bp-media-settings-value,.bp-media-settings-sub-item:hover .bp-media-settings-value{color:#2c3e50}.bp-has-keyboard-focus .bp-media-settings-item:focus,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus{background-color:#0061d5}.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-value,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-value{color:#fff}.bp-has-keyboard-focus .bp-media-settings-item:focus svg,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus svg{fill:#fff}.bp-media-settings-subtitles-unavailable .bp-media-settings-item-subtitles,.bp-media-settings-subtitles-unavailable .bp-media-settings-menu-subtitles{display:none}.bp-media-settings-autoplay-unavailable .bp-media-settings-item-autoplay,.bp-media-settings-autoplay-unavailable .bp-media-settings-menu-autoplay{display:none}.bp-media-settings-audiotracks-unavailable .bp-media-settings-item-audiotracks,.bp-media-settings-audiotracks-unavailable .bp-media-settings-menu-audiotracks{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-menu-quality{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality{pointer-events:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality .bp-media-settings-arrow{display:none}.bp-media-settings-label,.bp-media-settings-value{display:table-cell;padding:4px;vertical-align:middle}.bp-media-settings-label{color:#999ea4;font-weight:normal;font-size:11px;text-transform:uppercase}.bp-media-settings-item .bp-media-settings-label{text-align:left}.bp-media-settings-sub-item .bp-media-settings-label{text-align:center}.bp-media-settings-value{padding-left:10px;color:#464a4f;font-size:12px;text-align:left}.bp-media-settings-selected .bp-media-settings-value{color:#0061d5}.bp-media-settings-arrow{display:table-cell;vertical-align:middle}.bp-media-settings-arrow svg{width:18px;height:18px}.bp-media-settings-icon{display:table-cell;text-align:center;vertical-align:middle}.bp-media-settings-icon svg{width:16px;height:16px;visibility:hidden}.bp-media-settings-selected .bp-media-settings-icon svg{visibility:visible}.bp-media-controls-is-visible .bp-media-controls-wrapper,.bp-media-controls-wrapper:active,.bp-media-controls-wrapper:focus{visibility:visible;opacity:1}.bp-media-controls-wrapper{position:absolute;right:0;bottom:0;left:0;width:100%;height:60px;margin:auto;overflow:hidden;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);visibility:hidden;opacity:0;transition:visibility .3s,opacity .3s}.bp-media-time-scrubber-container{outline:0 none}.bp-media-volume-scrubber-container-wrapper{display:inline-block;width:0;height:40px;overflow:hidden;transition:width .2s ease-in-out}.bp-media-controls-volume-scrubber-expand{width:96px}.bp-media-volume-scrubber-container{position:relative;display:inline-block;width:96px;height:40px;padding:10px 8px 0;outline:0 none}.bp-media-volume-scrubber-container .bp-media-scrubber-handle{transform:scale(1)}.bp-media-volume-scrubber-container .bp-media-scrubber-converted,.bp-media-volume-scrubber-container .bp-media-scrubber-buffered,.bp-media-volume-scrubber-container .bp-media-scrubber-played,.bp-media-volume-scrubber-container .bp-media-scrubber-underlay{transform:scaleY(1) !important}.bp-media-controls-container{height:40px;margin:0;padding:0 10px;text-align:left}.bp-media-controls-label,.bp-media-controls-btn{display:inline-block;width:45px;height:40px;margin:0;padding:0;color:#fff;font-weight:normal;font-size:12px;text-align:center;vertical-align:top;background-color:transparent;border:none;outline:0 none;cursor:pointer;opacity:.7}.bp-media-controls-label:hover,.bp-media-controls-btn:hover{opacity:1}.bp-media-volume-icon{position:relative;display:inline-block;width:36px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-volume-icon{display:none}.bp-media-controls-label{display:inline-block;width:auto;margin:0 4px;line-height:40px;vertical-align:top;cursor:default}.bp-media-controls-timecode{margin-left:13px}.bp-media-controls-volume-control{display:inline-block;width:45px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-controls-volume-control{display:none}.bp-is-fullscreen .bp-media-fullscreen-icon .bp-exit-fullscreen-icon{display:inline-block}.bp-media-fullscreen-icon{position:absolute;right:10px}.bp-media-gear-icon{position:absolute;right:55px}.bp-media-gear-icon svg path{transform-origin:50%;transition:all .3s}.bp-media-settings-is-open .bp-media-gear-icon svg path{transform:rotateZ(60deg)}.bp-media-cc-icon{position:absolute;right:100px;visibility:visible}.bp-media-settings-subtitles-unavailable .bp-media-cc-icon{visibility:hidden}.bp-media-controls-cc-icon-text{display:inline-block;width:24px;height:24px;padding:0 0 0 1px;color:#fff;font-weight:bold;font-size:12px;line-height:24px;letter-spacing:.1em;background-color:rgba(0,0,0,.3);border-radius:4px}.bp-media-settings-subtitles-on .bp-media-controls-cc-icon-text{color:#fff;background-color:#0061d5}.bp-media-controls-hd{position:absolute;left:22px;display:none;padding:2px 2px 2px 3px;font-weight:bold;font-size:8px;line-height:8px;letter-spacing:.1em;background-color:#0061d5;border-radius:3px}.bp-media-controls-is-hd .bp-media-controls-hd{display:inline}.bp-media-play-icon{display:inline}.bp-media-is-playing .bp-media-play-icon{display:none}.bp-media-pause-icon{display:none}.bp-media-is-playing .bp-media-pause-icon{display:inline}.bp-media-volume-icon-mute,.bp-media-volume-icon-low,.bp-media-volume-icon-medium,.bp-media-volume-icon-high{position:absolute;left:6px;display:none}.bp-media-volume-icon-is-mute .bp-media-volume-icon-mute,.bp-media-volume-icon-is-low .bp-media-volume-icon-low,.bp-media-volume-icon-is-medium .bp-media-volume-icon-medium,.bp-media-volume-icon-is-high .bp-media-volume-icon-high{display:inline}.bp-media{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;border:0 none;visibility:hidden}.bp-media.bp-is-visible{visibility:visible}.bp-media-container{position:relative;display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:360px;min-height:0;outline:0 none;-webkit-user-select:none;user-select:none}.bp-media-play-button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;position:absolute;top:50%;left:50%;width:80px;height:80px;color:#fff;font-size:40px;text-align:center;background:rgba(0,0,0,.5);border:4px solid #fff;border-radius:40px;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-play-button:hover{background:#000}.bp-media-overlay-play-container{position:absolute;top:50%;left:50%;display:flex;gap:28px;align-items:center;justify-content:center;color:#fff;font-size:40px;text-align:center;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-overlay-play-container button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;width:40px;height:40px;font-size:40px;text-align:center;background:#000;border-radius:40px;cursor:pointer;transition:all .2s}.bp-media-overlay-play-container .bp-media-overlay-play-button{width:60px;height:60px}.bp-has-keyboard-focus .bp-media-time-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-volume-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-controls-btn:focus{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1)}.bp-dark .bp-error{color:#fff}.bp-dark .bp-icon{opacity:.9}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper{display:flex}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-crawler-wrapper{display:block}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-icon{display:none}@keyframes bp-spinner-rotate{to{transform:rotate(360deg)}}.bp-media-buffering-spinner{position:absolute;top:50%;left:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border:4px solid rgba(0,97,213,.3);border-top-color:#0061d5;border-radius:40px;animation:bp-spinner-rotate .8s linear infinite}.bp-is-mobile *::-webkit-media-controls-start-playback-button{display:none}.bp-VideoControlsRoot{position:relative;right:auto;bottom:auto;left:auto;align-self:stretch;width:100%}.bp-video-360 .bp-VideoControlsRoot{position:absolute;right:0;bottom:-1px;left:0;width:100%}.bp-video-preload-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;margin:0;overflow:hidden;background-color:transparent;opacity:1;transition:opacity .5s}.bp-video-preload-wrapper.bp-is-invisible{visibility:hidden}.bp-video-preload-wrapper.bp-is-transparent{opacity:0}.bp-video-preload-wrapper .bp-preload{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:translateY(-60px)}.bp-video-preload-wrapper .bp-preload-content{width:100%;height:100%;object-fit:contain}.bp-video-preload-wrapper .bp-preload-placeholder{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.bp-video-preload-wrapper .bp-video-preload-play-overlay{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:rgba(0,0,0,.5);border-radius:50%;transform:translate(-50%, -50%);pointer-events:none}.bp-video-preload-wrapper .bp-video-preload-play-overlay svg{width:48px;height:48px;fill:#fff}.bp-media-mp4 video{display:block;width:100%;max-width:100%;max-height:100%;margin-right:auto;margin-left:auto;cursor:none}.bp-media-mp4 .bp-media-controls-is-visible video{cursor:pointer}.bp-is-fullscreen .bp-media-mp4 .bp-media-container{width:100%}.bp-media-mp4 .bp-media-settings-item-quality,.bp-media-mp4 .bp-image-switch-360-icon{display:none}.bp-media-mp4 .bp-media-controls-label,.bp-media-mp4 .bp-media-controls-btn{opacity:.9}.bp-media-mp4 .bp-media-controls-label:hover,.bp-media-mp4 .bp-media-controls-btn:hover{opacity:1}
|
|
69
69
|
.bp-media-scrubber-container{position:relative;width:100%;height:16px}.bp-media-scrubber-wrapper{position:absolute;top:0;left:50%;width:100%;height:100%}.bp-media-scrubber{position:absolute;top:7px;left:-50%;width:100%;height:3px}.bp-media-scrubber-converted,.bp-media-scrubber-buffered,.bp-media-scrubber-played,.bp-media-scrubber-underlay{position:absolute;height:3px;transition:transform .1s ease-in-out}.bp-media-scrubber-converted{background-color:rgba(255,255,255,.5);cursor:pointer}.bp-media-scrubber-buffered{position:absolute;height:3px;background-color:#fff}.bp-media-scrubber-played{background-color:#0061d5;cursor:pointer}.bp-media-scrubber-underlay{width:100%;cursor:not-allowed}.bp-media-scrubber-handle{position:absolute;top:-4.25px;width:12px;height:12px;margin-left:-6px;background-color:#0061d5;border-radius:6px;transform:scale(0);cursor:pointer;transition:transform .05s ease-in-out}.bp-media-scrubber-container:hover .bp-media-scrubber-handle,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container:hover .bp-media-scrubber-converted,.bp-media-scrubber-container:hover .bp-media-scrubber-buffered,.bp-media-scrubber-container:hover .bp-media-scrubber-played,.bp-media-scrubber-container:hover .bp-media-scrubber-underlay,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-settings{position:absolute;right:16px;bottom:60px;display:inline-block;max-width:400px;max-height:210px;padding:8px;overflow-x:hidden;overflow-y:auto;color:#444;font-size:10px;line-height:0;background-color:#fff;border:1px solid #bdc3c7;border-radius:2px;visibility:hidden;transition:width .2s,height .2s;-ms-overflow-style:-ms-autohiding-scrollbar}.bp-media-settings-is-open .bp-media-settings{visibility:visible}.bp-media-mp3 .bp-media-settings{right:0;bottom:65px}.bp-media-settings-in-transition{overflow:hidden}.bp-media-settings-menu{display:table}.bp-media-settings-menu-autoplay,.bp-media-settings-menu-quality,.bp-media-settings-menu-speed,.bp-media-settings-menu-subtitles,.bp-media-settings-menu-audiotracks,.bp-media-settings-show-autoplay .bp-media-settings-menu-main,.bp-media-settings-show-speed .bp-media-settings-menu-main,.bp-media-settings-show-quality .bp-media-settings-menu-main,.bp-media-settings-show-subtitles .bp-media-settings-menu-main,.bp-media-settings-show-audiotracks .bp-media-settings-menu-main{display:none}.bp-media-settings-show-autoplay .bp-media-settings-menu-autoplay,.bp-media-settings-show-speed .bp-media-settings-menu-speed,.bp-media-settings-show-quality .bp-media-settings-menu-quality,.bp-media-settings-show-subtitles .bp-media-settings-menu-subtitles,.bp-media-settings-show-audiotracks .bp-media-settings-menu-audiotracks{display:table}.bp-media-mp4 .bp-media-settings-item-quality,.bp-media-mp4 .bp-media-settings-item-subtitles,.bp-media-mp4 .bp-media-settings-item-audiotracks,.bp-media-mp3 .bp-media-settings-item-quality,.bp-media-mp3 .bp-media-settings-item-subtitles,.bp-media-mp3 .bp-media-settings-item-audiotracks{display:none}.bp-media-settings-item,.bp-media-settings-sub-item{display:table-row;height:26px;padding:4px;overflow:hidden;white-space:nowrap;outline:0 none;cursor:pointer}.bp-media-settings-item:hover,.bp-media-settings-sub-item:hover{background-color:#f6fafd}.bp-media-settings-item:hover .bp-media-settings-icon svg,.bp-media-settings-sub-item:hover .bp-media-settings-icon svg{fill:#2c3e50}.bp-media-settings-item:hover .bp-media-settings-label,.bp-media-settings-sub-item:hover .bp-media-settings-label{color:#aabed1}.bp-media-settings-item:hover .bp-media-settings-value,.bp-media-settings-sub-item:hover .bp-media-settings-value{color:#2c3e50}.bp-has-keyboard-focus .bp-media-settings-item:focus,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus{background-color:#0061d5}.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-value,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-value{color:#fff}.bp-has-keyboard-focus .bp-media-settings-item:focus svg,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus svg{fill:#fff}.bp-media-settings-subtitles-unavailable .bp-media-settings-item-subtitles,.bp-media-settings-subtitles-unavailable .bp-media-settings-menu-subtitles{display:none}.bp-media-settings-autoplay-unavailable .bp-media-settings-item-autoplay,.bp-media-settings-autoplay-unavailable .bp-media-settings-menu-autoplay{display:none}.bp-media-settings-audiotracks-unavailable .bp-media-settings-item-audiotracks,.bp-media-settings-audiotracks-unavailable .bp-media-settings-menu-audiotracks{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-menu-quality{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality{pointer-events:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality .bp-media-settings-arrow{display:none}.bp-media-settings-label,.bp-media-settings-value{display:table-cell;padding:4px;vertical-align:middle}.bp-media-settings-label{color:#999ea4;font-weight:normal;font-size:11px;text-transform:uppercase}.bp-media-settings-item .bp-media-settings-label{text-align:left}.bp-media-settings-sub-item .bp-media-settings-label{text-align:center}.bp-media-settings-value{padding-left:10px;color:#464a4f;font-size:12px;text-align:left}.bp-media-settings-selected .bp-media-settings-value{color:#0061d5}.bp-media-settings-arrow{display:table-cell;vertical-align:middle}.bp-media-settings-arrow svg{width:18px;height:18px}.bp-media-settings-icon{display:table-cell;text-align:center;vertical-align:middle}.bp-media-settings-icon svg{width:16px;height:16px;visibility:hidden}.bp-media-settings-selected .bp-media-settings-icon svg{visibility:visible}.bp-media-controls-is-visible .bp-media-controls-wrapper,.bp-media-controls-wrapper:active,.bp-media-controls-wrapper:focus{visibility:visible;opacity:1}.bp-media-controls-wrapper{position:absolute;right:0;bottom:0;left:0;width:100%;height:60px;margin:auto;overflow:hidden;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);visibility:hidden;opacity:0;transition:visibility .3s,opacity .3s}.bp-media-time-scrubber-container{outline:0 none}.bp-media-volume-scrubber-container-wrapper{display:inline-block;width:0;height:40px;overflow:hidden;transition:width .2s ease-in-out}.bp-media-controls-volume-scrubber-expand{width:96px}.bp-media-volume-scrubber-container{position:relative;display:inline-block;width:96px;height:40px;padding:10px 8px 0;outline:0 none}.bp-media-volume-scrubber-container .bp-media-scrubber-handle{transform:scale(1)}.bp-media-volume-scrubber-container .bp-media-scrubber-converted,.bp-media-volume-scrubber-container .bp-media-scrubber-buffered,.bp-media-volume-scrubber-container .bp-media-scrubber-played,.bp-media-volume-scrubber-container .bp-media-scrubber-underlay{transform:scaleY(1) !important}.bp-media-controls-container{height:40px;margin:0;padding:0 10px;text-align:left}.bp-media-controls-label,.bp-media-controls-btn{display:inline-block;width:45px;height:40px;margin:0;padding:0;color:#fff;font-weight:normal;font-size:12px;text-align:center;vertical-align:top;background-color:transparent;border:none;outline:0 none;cursor:pointer;opacity:.7}.bp-media-controls-label:hover,.bp-media-controls-btn:hover{opacity:1}.bp-media-volume-icon{position:relative;display:inline-block;width:36px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-volume-icon{display:none}.bp-media-controls-label{display:inline-block;width:auto;margin:0 4px;line-height:40px;vertical-align:top;cursor:default}.bp-media-controls-timecode{margin-left:13px}.bp-media-controls-volume-control{display:inline-block;width:45px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-controls-volume-control{display:none}.bp-is-fullscreen .bp-media-fullscreen-icon .bp-exit-fullscreen-icon{display:inline-block}.bp-media-fullscreen-icon{position:absolute;right:10px}.bp-media-gear-icon{position:absolute;right:55px}.bp-media-gear-icon svg path{transform-origin:50%;transition:all .3s}.bp-media-settings-is-open .bp-media-gear-icon svg path{transform:rotateZ(60deg)}.bp-media-cc-icon{position:absolute;right:100px;visibility:visible}.bp-media-settings-subtitles-unavailable .bp-media-cc-icon{visibility:hidden}.bp-media-controls-cc-icon-text{display:inline-block;width:24px;height:24px;padding:0 0 0 1px;color:#fff;font-weight:bold;font-size:12px;line-height:24px;letter-spacing:.1em;background-color:rgba(0,0,0,.3);border-radius:4px}.bp-media-settings-subtitles-on .bp-media-controls-cc-icon-text{color:#fff;background-color:#0061d5}.bp-media-controls-hd{position:absolute;left:22px;display:none;padding:2px 2px 2px 3px;font-weight:bold;font-size:8px;line-height:8px;letter-spacing:.1em;background-color:#0061d5;border-radius:3px}.bp-media-controls-is-hd .bp-media-controls-hd{display:inline}.bp-media-play-icon{display:inline}.bp-media-is-playing .bp-media-play-icon{display:none}.bp-media-pause-icon{display:none}.bp-media-is-playing .bp-media-pause-icon{display:inline}.bp-media-volume-icon-mute,.bp-media-volume-icon-low,.bp-media-volume-icon-medium,.bp-media-volume-icon-high{position:absolute;left:6px;display:none}.bp-media-volume-icon-is-mute .bp-media-volume-icon-mute,.bp-media-volume-icon-is-low .bp-media-volume-icon-low,.bp-media-volume-icon-is-medium .bp-media-volume-icon-medium,.bp-media-volume-icon-is-high .bp-media-volume-icon-high{display:inline}.bp-media{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;border:0 none;visibility:hidden}.bp-media.bp-is-visible{visibility:visible}.bp-media-container{position:relative;display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:360px;min-height:0;outline:0 none;-webkit-user-select:none;user-select:none}.bp-media-play-button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;position:absolute;top:50%;left:50%;width:80px;height:80px;color:#fff;font-size:40px;text-align:center;background:rgba(0,0,0,.5);border:4px solid #fff;border-radius:40px;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-play-button:hover{background:#000}.bp-media-overlay-play-container{position:absolute;top:50%;left:50%;display:flex;gap:28px;align-items:center;justify-content:center;color:#fff;font-size:40px;text-align:center;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-overlay-play-container button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;width:40px;height:40px;font-size:40px;text-align:center;background:#000;border-radius:40px;cursor:pointer;transition:all .2s}.bp-media-overlay-play-container .bp-media-overlay-play-button{width:60px;height:60px}.bp-has-keyboard-focus .bp-media-time-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-volume-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-controls-btn:focus{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1)}.bp-dark .bp-error{color:#fff}.bp-dark .bp-icon{opacity:.9}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper{display:flex}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-crawler-wrapper{display:block}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-icon{display:none}@keyframes bp-spinner-rotate{to{transform:rotate(360deg)}}.bp-media-buffering-spinner{position:absolute;top:50%;left:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border:4px solid rgba(0,97,213,.3);border-top-color:#0061d5;border-radius:40px;animation:bp-spinner-rotate .8s linear infinite}.bp-is-mobile *::-webkit-media-controls-start-playback-button{display:none}.bp-VideoControlsRoot{position:relative;right:auto;bottom:auto;left:auto;align-self:stretch;width:100%}.bp-video-360 .bp-VideoControlsRoot{position:absolute;right:0;bottom:-1px;left:0;width:100%}.bp-video-preload-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;margin:0;overflow:hidden;background-color:transparent;opacity:1;transition:opacity .5s}.bp-video-preload-wrapper.bp-is-invisible{visibility:hidden}.bp-video-preload-wrapper.bp-is-transparent{opacity:0}.bp-video-preload-wrapper .bp-preload{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:translateY(-60px)}.bp-video-preload-wrapper .bp-preload-content{width:100%;height:100%;object-fit:contain}.bp-video-preload-wrapper .bp-preload-placeholder{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.bp-video-preload-wrapper .bp-video-preload-play-overlay{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:rgba(0,0,0,.5);border-radius:50%;transform:translate(-50%, -50%);pointer-events:none}.bp-video-preload-wrapper .bp-video-preload-play-overlay svg{width:48px;height:48px;fill:#fff}.bp-media-dash video{display:block;width:100%;max-width:100%;max-height:100%;margin-right:auto;margin-left:auto;cursor:none}.bp-media-dash .bp-media-controls-label,.bp-media-dash .bp-media-controls-btn{opacity:.9}.bp-media-dash .bp-media-controls-label:hover,.bp-media-dash .bp-media-controls-btn:hover{opacity:1}.bp-media-dash .bp-media-controls-is-visible video{cursor:pointer}.bp-media-filmstrip-container{position:absolute;bottom:60px;left:0;display:none;width:160px;height:110px;overflow:hidden;border:1px solid #464a4f}.bp-media-filmstrip{position:relative}.bp-media-filmstrip-timecode{position:absolute;bottom:0;z-index:1;width:100%;color:#fff;font-size:13px;line-height:18px;text-align:center;background-color:#222}.bp-media-crawler-wrapper{position:relative;top:50%;left:50%;z-index:1;width:10px;margin:-15px 0 0 -5px}.bp-media-dash-stats{position:absolute;top:20px;right:20px;color:#fff;font-size:24px}
|
|
70
|
+
.bp-FilmstripV2{position:absolute;bottom:calc(100% + 12px);padding:12px;padding-bottom:8px;background:#fff;border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.15);visibility:hidden}.bp-FilmstripV2.bp-is-shown{visibility:visible}.bp-FilmstripV2-frame{display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:10px}.bp-FilmstripV2-time{margin-top:8px;color:#000;font-size:13px;line-height:20px;text-align:center}
|
|
71
|
+
.bp-TimeControlsV2{position:relative;margin-right:10px;margin-left:10px}.bp-TimeControlsV2-slider{height:20px}.bp-TimeControlsV2-slider .bp-SliderControl-track{height:6px;margin:auto 0;border-radius:5px;backface-visibility:hidden}.bp-TimeControlsV2-slider .bp-SliderControl-thumb{top:50%;width:3px;height:16px;margin-left:-1.5px;background:#fff;border:0;border-radius:2px;transform:translateY(-50%)}
|
|
72
|
+
.bp-VideoControlsRoot:has(.bp-VideoControlsV2){position:absolute;right:0;bottom:0;left:0;width:100%}.bp-VideoControlsRoot:has(.bp-VideoControlsV2) .bp-ControlsLayer{width:100%}.bp-VideoControlsV2{display:flex;flex-direction:column;width:100%;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);padding:30px 20px 10px 20px}.bp-VideoControlsV2 .bp-FullscreenToggle{width:36px;height:40px}.bp-VideoControlsV2-bar{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding:0 10px 5px}.bp-VideoControlsV2-group{display:flex;gap:6px;align-items:center}.bp-VideoControlsV2-playPause{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-VideoControlsV2-playPause:focus:not(:disabled),.bp-VideoControlsV2-playPause:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-VideoControlsV2-playPause:focus:not(:disabled) svg,.bp-VideoControlsV2-playPause:hover:not(:disabled) svg,.bp-VideoControlsV2-playPause.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-VideoControlsV2-playPause.bp-is-active,.bp-VideoControlsV2-playPause:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-VideoControlsV2-playPause.bp-is-active:focus:not(:disabled),.bp-VideoControlsV2-playPause.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-VideoControlsV2-playPause:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VideoControlsV2-playPause:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VideoControlsV2-playPause:focus:not(:focus-visible){box-shadow:none}.bp-VideoControlsV2-playPause:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-VideoControlsV2-playPause svg{width:32px;height:32px;padding:5px}.bp-VideoControlsV2-skipBtn{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-VideoControlsV2-skipBtn:focus:not(:disabled),.bp-VideoControlsV2-skipBtn:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-VideoControlsV2-skipBtn:focus:not(:disabled) svg,.bp-VideoControlsV2-skipBtn:hover:not(:disabled) svg,.bp-VideoControlsV2-skipBtn.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-VideoControlsV2-skipBtn.bp-is-active,.bp-VideoControlsV2-skipBtn:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-VideoControlsV2-skipBtn.bp-is-active:focus:not(:disabled),.bp-VideoControlsV2-skipBtn.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-VideoControlsV2-skipBtn:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VideoControlsV2-skipBtn:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-VideoControlsV2-skipBtn:focus:not(:focus-visible){box-shadow:none}.bp-VideoControlsV2-skipBtn:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-VideoControlsV2-skipBtn svg{width:32px;height:32px;padding:5px}.bp-VideoControlsV2-divider{width:1px;height:24px;background-color:rgba(255,255,255,.1);border-radius:1px}.bp-VideoControlsV2 .bp-AnnotationsControls{padding-left:0;border-left:none}.bp-VideoControlsV2-timestamp{padding:0 4px;color:rgba(255,255,255,.8);font-weight:normal;font-size:13px;font-family:Lato,Arial,sans-serif;line-height:20px;letter-spacing:.3px;white-space:nowrap;cursor:default;-webkit-user-select:none;user-select:none}
|
|
70
73
|
.bp-media-scrubber-container{position:relative;width:100%;height:16px}.bp-media-scrubber-wrapper{position:absolute;top:0;left:50%;width:100%;height:100%}.bp-media-scrubber{position:absolute;top:7px;left:-50%;width:100%;height:3px}.bp-media-scrubber-converted,.bp-media-scrubber-buffered,.bp-media-scrubber-played,.bp-media-scrubber-underlay{position:absolute;height:3px;transition:transform .1s ease-in-out}.bp-media-scrubber-converted{background-color:rgba(255,255,255,.5);cursor:pointer}.bp-media-scrubber-buffered{position:absolute;height:3px;background-color:#fff}.bp-media-scrubber-played{background-color:#0061d5;cursor:pointer}.bp-media-scrubber-underlay{width:100%;cursor:not-allowed}.bp-media-scrubber-handle{position:absolute;top:-4.25px;width:12px;height:12px;margin-left:-6px;background-color:#0061d5;border-radius:6px;transform:scale(0);cursor:pointer;transition:transform .05s ease-in-out}.bp-media-scrubber-container:hover .bp-media-scrubber-handle,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container:hover .bp-media-scrubber-converted,.bp-media-scrubber-container:hover .bp-media-scrubber-buffered,.bp-media-scrubber-container:hover .bp-media-scrubber-played,.bp-media-scrubber-container:hover .bp-media-scrubber-underlay,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-hover .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-handle{transform:scale(1)}.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-converted,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-buffered,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-played,.bp-media-scrubber-container .bp-media-scrubber-touch .bp-media-scrubber-underlay{transform:scaleY(2)}.bp-media-settings{position:absolute;right:16px;bottom:60px;display:inline-block;max-width:400px;max-height:210px;padding:8px;overflow-x:hidden;overflow-y:auto;color:#444;font-size:10px;line-height:0;background-color:#fff;border:1px solid #bdc3c7;border-radius:2px;visibility:hidden;transition:width .2s,height .2s;-ms-overflow-style:-ms-autohiding-scrollbar}.bp-media-settings-is-open .bp-media-settings{visibility:visible}.bp-media-mp3 .bp-media-settings{right:0;bottom:65px}.bp-media-settings-in-transition{overflow:hidden}.bp-media-settings-menu{display:table}.bp-media-settings-menu-autoplay,.bp-media-settings-menu-quality,.bp-media-settings-menu-speed,.bp-media-settings-menu-subtitles,.bp-media-settings-menu-audiotracks,.bp-media-settings-show-autoplay .bp-media-settings-menu-main,.bp-media-settings-show-speed .bp-media-settings-menu-main,.bp-media-settings-show-quality .bp-media-settings-menu-main,.bp-media-settings-show-subtitles .bp-media-settings-menu-main,.bp-media-settings-show-audiotracks .bp-media-settings-menu-main{display:none}.bp-media-settings-show-autoplay .bp-media-settings-menu-autoplay,.bp-media-settings-show-speed .bp-media-settings-menu-speed,.bp-media-settings-show-quality .bp-media-settings-menu-quality,.bp-media-settings-show-subtitles .bp-media-settings-menu-subtitles,.bp-media-settings-show-audiotracks .bp-media-settings-menu-audiotracks{display:table}.bp-media-mp4 .bp-media-settings-item-quality,.bp-media-mp4 .bp-media-settings-item-subtitles,.bp-media-mp4 .bp-media-settings-item-audiotracks,.bp-media-mp3 .bp-media-settings-item-quality,.bp-media-mp3 .bp-media-settings-item-subtitles,.bp-media-mp3 .bp-media-settings-item-audiotracks{display:none}.bp-media-settings-item,.bp-media-settings-sub-item{display:table-row;height:26px;padding:4px;overflow:hidden;white-space:nowrap;outline:0 none;cursor:pointer}.bp-media-settings-item:hover,.bp-media-settings-sub-item:hover{background-color:#f6fafd}.bp-media-settings-item:hover .bp-media-settings-icon svg,.bp-media-settings-sub-item:hover .bp-media-settings-icon svg{fill:#2c3e50}.bp-media-settings-item:hover .bp-media-settings-label,.bp-media-settings-sub-item:hover .bp-media-settings-label{color:#aabed1}.bp-media-settings-item:hover .bp-media-settings-value,.bp-media-settings-sub-item:hover .bp-media-settings-value{color:#2c3e50}.bp-has-keyboard-focus .bp-media-settings-item:focus,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus{background-color:#0061d5}.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-item:focus .bp-media-settings-value,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-label,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus .bp-media-settings-value{color:#fff}.bp-has-keyboard-focus .bp-media-settings-item:focus svg,.bp-has-keyboard-focus .bp-media-settings-sub-item:focus svg{fill:#fff}.bp-media-settings-subtitles-unavailable .bp-media-settings-item-subtitles,.bp-media-settings-subtitles-unavailable .bp-media-settings-menu-subtitles{display:none}.bp-media-settings-autoplay-unavailable .bp-media-settings-item-autoplay,.bp-media-settings-autoplay-unavailable .bp-media-settings-menu-autoplay{display:none}.bp-media-settings-audiotracks-unavailable .bp-media-settings-item-audiotracks,.bp-media-settings-audiotracks-unavailable .bp-media-settings-menu-audiotracks{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-menu-quality{display:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality{pointer-events:none}.bp-media-settings-hd-unavailable .bp-media-settings-item-quality .bp-media-settings-arrow{display:none}.bp-media-settings-label,.bp-media-settings-value{display:table-cell;padding:4px;vertical-align:middle}.bp-media-settings-label{color:#999ea4;font-weight:normal;font-size:11px;text-transform:uppercase}.bp-media-settings-item .bp-media-settings-label{text-align:left}.bp-media-settings-sub-item .bp-media-settings-label{text-align:center}.bp-media-settings-value{padding-left:10px;color:#464a4f;font-size:12px;text-align:left}.bp-media-settings-selected .bp-media-settings-value{color:#0061d5}.bp-media-settings-arrow{display:table-cell;vertical-align:middle}.bp-media-settings-arrow svg{width:18px;height:18px}.bp-media-settings-icon{display:table-cell;text-align:center;vertical-align:middle}.bp-media-settings-icon svg{width:16px;height:16px;visibility:hidden}.bp-media-settings-selected .bp-media-settings-icon svg{visibility:visible}.bp-media-controls-is-visible .bp-media-controls-wrapper,.bp-media-controls-wrapper:active,.bp-media-controls-wrapper:focus{visibility:visible;opacity:1}.bp-media-controls-wrapper{position:absolute;right:0;bottom:0;left:0;width:100%;height:60px;margin:auto;overflow:hidden;background-image:linear-gradient(to top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%);visibility:hidden;opacity:0;transition:visibility .3s,opacity .3s}.bp-media-time-scrubber-container{outline:0 none}.bp-media-volume-scrubber-container-wrapper{display:inline-block;width:0;height:40px;overflow:hidden;transition:width .2s ease-in-out}.bp-media-controls-volume-scrubber-expand{width:96px}.bp-media-volume-scrubber-container{position:relative;display:inline-block;width:96px;height:40px;padding:10px 8px 0;outline:0 none}.bp-media-volume-scrubber-container .bp-media-scrubber-handle{transform:scale(1)}.bp-media-volume-scrubber-container .bp-media-scrubber-converted,.bp-media-volume-scrubber-container .bp-media-scrubber-buffered,.bp-media-volume-scrubber-container .bp-media-scrubber-played,.bp-media-volume-scrubber-container .bp-media-scrubber-underlay{transform:scaleY(1) !important}.bp-media-controls-container{height:40px;margin:0;padding:0 10px;text-align:left}.bp-media-controls-label,.bp-media-controls-btn{display:inline-block;width:45px;height:40px;margin:0;padding:0;color:#fff;font-weight:normal;font-size:12px;text-align:center;vertical-align:top;background-color:transparent;border:none;outline:0 none;cursor:pointer;opacity:.7}.bp-media-controls-label:hover,.bp-media-controls-btn:hover{opacity:1}.bp-media-volume-icon{position:relative;display:inline-block;width:36px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-volume-icon{display:none}.bp-media-controls-label{display:inline-block;width:auto;margin:0 4px;line-height:40px;vertical-align:top;cursor:default}.bp-media-controls-timecode{margin-left:13px}.bp-media-controls-volume-control{display:inline-block;width:45px;height:40px;vertical-align:top}.bp-is-mobile .bp-media-controls-volume-control{display:none}.bp-is-fullscreen .bp-media-fullscreen-icon .bp-exit-fullscreen-icon{display:inline-block}.bp-media-fullscreen-icon{position:absolute;right:10px}.bp-media-gear-icon{position:absolute;right:55px}.bp-media-gear-icon svg path{transform-origin:50%;transition:all .3s}.bp-media-settings-is-open .bp-media-gear-icon svg path{transform:rotateZ(60deg)}.bp-media-cc-icon{position:absolute;right:100px;visibility:visible}.bp-media-settings-subtitles-unavailable .bp-media-cc-icon{visibility:hidden}.bp-media-controls-cc-icon-text{display:inline-block;width:24px;height:24px;padding:0 0 0 1px;color:#fff;font-weight:bold;font-size:12px;line-height:24px;letter-spacing:.1em;background-color:rgba(0,0,0,.3);border-radius:4px}.bp-media-settings-subtitles-on .bp-media-controls-cc-icon-text{color:#fff;background-color:#0061d5}.bp-media-controls-hd{position:absolute;left:22px;display:none;padding:2px 2px 2px 3px;font-weight:bold;font-size:8px;line-height:8px;letter-spacing:.1em;background-color:#0061d5;border-radius:3px}.bp-media-controls-is-hd .bp-media-controls-hd{display:inline}.bp-media-play-icon{display:inline}.bp-media-is-playing .bp-media-play-icon{display:none}.bp-media-pause-icon{display:none}.bp-media-is-playing .bp-media-pause-icon{display:inline}.bp-media-volume-icon-mute,.bp-media-volume-icon-low,.bp-media-volume-icon-medium,.bp-media-volume-icon-high{position:absolute;left:6px;display:none}.bp-media-volume-icon-is-mute .bp-media-volume-icon-mute,.bp-media-volume-icon-is-low .bp-media-volume-icon-low,.bp-media-volume-icon-is-medium .bp-media-volume-icon-medium,.bp-media-volume-icon-is-high .bp-media-volume-icon-high{display:inline}.bp-media{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;margin:0;padding:0;border:0 none;visibility:hidden}.bp-media.bp-is-visible{visibility:visible}.bp-media-container{position:relative;display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:360px;min-height:0;outline:0 none;-webkit-user-select:none;user-select:none}.bp-media-play-button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;position:absolute;top:50%;left:50%;width:80px;height:80px;color:#fff;font-size:40px;text-align:center;background:rgba(0,0,0,.5);border:4px solid #fff;border-radius:40px;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-play-button:hover{background:#000}.bp-media-overlay-play-container{position:absolute;top:50%;left:50%;display:flex;gap:28px;align-items:center;justify-content:center;color:#fff;font-size:40px;text-align:center;transform:translate(-50%, -50%);cursor:pointer;transition:all .2s}.bp-media-overlay-play-container button{padding:0;color:inherit;font:inherit;background:none;border:none;cursor:pointer;width:40px;height:40px;font-size:40px;text-align:center;background:#000;border-radius:40px;cursor:pointer;transition:all .2s}.bp-media-overlay-play-container .bp-media-overlay-play-button{width:60px;height:60px}.bp-has-keyboard-focus .bp-media-time-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-volume-scrubber-container:focus,.bp-has-keyboard-focus .bp-media-controls-btn:focus{box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1)}.bp-dark .bp-error{color:#fff}.bp-dark .bp-icon{opacity:.9}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper{display:flex}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-crawler-wrapper{display:block}.bp.bp-loaded .bp-is-buffering .bp-loading-wrapper .bp-icon{display:none}@keyframes bp-spinner-rotate{to{transform:rotate(360deg)}}.bp-media-buffering-spinner{position:absolute;top:50%;left:50%;width:80px;height:80px;margin:-40px 0 0 -40px;border:4px solid rgba(0,97,213,.3);border-top-color:#0061d5;border-radius:40px;animation:bp-spinner-rotate .8s linear infinite}.bp-is-mobile *::-webkit-media-controls-start-playback-button{display:none}.bp-VideoControlsRoot{position:relative;right:auto;bottom:auto;left:auto;align-self:stretch;width:100%}.bp-video-360 .bp-VideoControlsRoot{position:absolute;right:0;bottom:-1px;left:0;width:100%}.bp-video-preload-wrapper{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;margin:0;overflow:hidden;background-color:transparent;opacity:1;transition:opacity .5s}.bp-video-preload-wrapper.bp-is-invisible{visibility:hidden}.bp-video-preload-wrapper.bp-is-transparent{opacity:0}.bp-video-preload-wrapper .bp-preload{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:translateY(-60px)}.bp-video-preload-wrapper .bp-preload-content{width:100%;height:100%;object-fit:contain}.bp-video-preload-wrapper .bp-preload-placeholder{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.bp-video-preload-wrapper .bp-video-preload-play-overlay{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:rgba(0,0,0,.5);border-radius:50%;transform:translate(-50%, -50%);pointer-events:none}.bp-video-preload-wrapper .bp-video-preload-play-overlay svg{width:48px;height:48px;fill:#fff}.bp-media-dash video{display:block;width:100%;max-width:100%;max-height:100%;margin-right:auto;margin-left:auto;cursor:none}.bp-media-dash .bp-media-controls-label,.bp-media-dash .bp-media-controls-btn{opacity:.9}.bp-media-dash .bp-media-controls-label:hover,.bp-media-dash .bp-media-controls-btn:hover{opacity:1}.bp-media-dash .bp-media-controls-is-visible video{cursor:pointer}.bp-media-filmstrip-container{position:absolute;bottom:60px;left:0;display:none;width:160px;height:110px;overflow:hidden;border:1px solid #464a4f}.bp-media-filmstrip{position:relative}.bp-media-filmstrip-timecode{position:absolute;bottom:0;z-index:1;width:100%;color:#fff;font-size:13px;line-height:18px;text-align:center;background-color:#222}.bp-media-crawler-wrapper{position:relative;top:50%;left:50%;z-index:1;width:10px;margin:-15px 0 0 -5px}.bp-media-dash-stats{position:absolute;top:20px;right:20px;color:#fff;font-size:24px}.bp-video-360 .bp-media-container{display:flex}.bp-is-mobile .bp-video-360 .bp-media-container .bp-media-controls-wrapper{visibility:visible !important;opacity:1 !important}.bp-video-360 canvas{cursor:move;cursor:grab}
|
|
71
74
|
.bp-FindBarToggle{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-FindBarToggle:focus:not(:disabled),.bp-FindBarToggle:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-FindBarToggle:focus:not(:disabled) svg,.bp-FindBarToggle:hover:not(:disabled) svg,.bp-FindBarToggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-FindBarToggle.bp-is-active,.bp-FindBarToggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-FindBarToggle.bp-is-active:focus:not(:disabled),.bp-FindBarToggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-FindBarToggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-FindBarToggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-FindBarToggle:focus:not(:focus-visible){box-shadow:none}.bp-FindBarToggle:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-FindBarToggle svg{width:32px;height:32px;padding:5px}
|
|
72
75
|
.bp-ThumbnailsToggle{opacity:.9;transition:opacity 150ms,background-color 150ms;will-change:opacity;outline:0;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:#fff;background:transparent;border:0;border-radius:25px;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;zoom:1}.bp-ThumbnailsToggle:focus:not(:disabled),.bp-ThumbnailsToggle:hover:not(:disabled){background-color:rgba(255,255,255,.08);opacity:1}.bp-ThumbnailsToggle:focus:not(:disabled) svg,.bp-ThumbnailsToggle:hover:not(:disabled) svg,.bp-ThumbnailsToggle.bp-is-active svg{transform:scale(1.09);transition:transform 150ms}.bp-ThumbnailsToggle.bp-is-active,.bp-ThumbnailsToggle:active:not(:disabled){background-color:rgba(255,255,255,.16)}.bp-ThumbnailsToggle.bp-is-active:focus:not(:disabled),.bp-ThumbnailsToggle.bp-is-active:hover:not(:disabled){background-color:rgba(255,255,255,.2)}.bp-ThumbnailsToggle:focus:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-ThumbnailsToggle:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px rgba(211,211,211,.5),0 1px 2px rgba(0,0,0,.1)}.bp-ThumbnailsToggle:focus:not(:focus-visible){box-shadow:none}.bp-ThumbnailsToggle:disabled{cursor:default;opacity:.2;pointer-events:none}.bp-ThumbnailsToggle svg{width:32px;height:32px;padding:5px}
|
package/dist/lib/index.js
CHANGED
|
@@ -9340,7 +9340,7 @@ function util_toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var
|
|
|
9340
9340
|
const CLIENT_NAME = "box-content-preview"; // eslint-disable-line no-undef
|
|
9341
9341
|
const CLIENT_NAME_KEY = 'box_client_name';
|
|
9342
9342
|
const CLIENT_VERSION_KEY = 'box_client_version';
|
|
9343
|
-
const CLIENT_VERSION = "3.
|
|
9343
|
+
const CLIENT_VERSION = "3.45.0"; // eslint-disable-line no-undef
|
|
9344
9344
|
const HEADER_CLIENT_NAME = 'X-Box-Client-Name';
|
|
9345
9345
|
const HEADER_CLIENT_VERSION = 'X-Box-Client-Version';
|
|
9346
9346
|
const PROMISE_MAP = {};
|
|
@@ -11058,7 +11058,7 @@ class Browser {
|
|
|
11058
11058
|
;// ./src/lib/Logger.js
|
|
11059
11059
|
/* eslint-disable no-undef */
|
|
11060
11060
|
const Logger_CLIENT_NAME = "box-content-preview";
|
|
11061
|
-
const Logger_CLIENT_VERSION = "3.
|
|
11061
|
+
const Logger_CLIENT_VERSION = "3.45.0";
|
|
11062
11062
|
/* eslint-enable no-undef */
|
|
11063
11063
|
|
|
11064
11064
|
class Logger {
|
|
@@ -27315,6 +27315,295 @@ function isFpsAvailable(player) {
|
|
|
27315
27315
|
const tracks = player.getVariantTracks();
|
|
27316
27316
|
return tracks.some(t => t.frameRate != null && t.frameRate > 0);
|
|
27317
27317
|
}
|
|
27318
|
+
;// ./src/lib/viewers/controls/media/FilmstripV2.scss
|
|
27319
|
+
// extracted by mini-css-extract-plugin
|
|
27320
|
+
|
|
27321
|
+
;// ./src/lib/viewers/controls/media/FilmstripV2.tsx
|
|
27322
|
+
|
|
27323
|
+
|
|
27324
|
+
|
|
27325
|
+
|
|
27326
|
+
const FilmstripV2_FILMSTRIP_FRAMES_PER_ROW = 100;
|
|
27327
|
+
const FILMSTRIP_SOURCE_FRAME_HEIGHT = 90;
|
|
27328
|
+
const FILMSTRIP_DISPLAY_HEIGHT = 135;
|
|
27329
|
+
const FILMSTRIP_DISPLAY_WIDTH = 240;
|
|
27330
|
+
function FilmstripV2(_ref) {
|
|
27331
|
+
let {
|
|
27332
|
+
aspectRatio = 0,
|
|
27333
|
+
imageUrl = '',
|
|
27334
|
+
interval = 1,
|
|
27335
|
+
isShown,
|
|
27336
|
+
position = 0,
|
|
27337
|
+
positionMax = 0,
|
|
27338
|
+
time = 0
|
|
27339
|
+
} = _ref;
|
|
27340
|
+
const [isLoading, setIsLoading] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(true);
|
|
27341
|
+
const [imageWidth, setImageWidth] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(0);
|
|
27342
|
+
const frameNumber = Math.floor(time / interval);
|
|
27343
|
+
const frameRow = Math.floor(frameNumber / FilmstripV2_FILMSTRIP_FRAMES_PER_ROW);
|
|
27344
|
+
const sourceFrameWidth = imageWidth ? Math.floor(imageWidth / FilmstripV2_FILMSTRIP_FRAMES_PER_ROW) : Math.floor(aspectRatio * FILMSTRIP_SOURCE_FRAME_HEIGHT) || Math.floor(FILMSTRIP_DISPLAY_WIDTH * (FILMSTRIP_SOURCE_FRAME_HEIGHT / FILMSTRIP_DISPLAY_HEIGHT));
|
|
27345
|
+
const scale = FILMSTRIP_DISPLAY_HEIGHT / FILMSTRIP_SOURCE_FRAME_HEIGHT;
|
|
27346
|
+
const displayWidth = Math.floor(sourceFrameWidth * scale) || FILMSTRIP_DISPLAY_WIDTH;
|
|
27347
|
+
const backgroundLeft = -(frameNumber % FilmstripV2_FILMSTRIP_FRAMES_PER_ROW) * displayWidth;
|
|
27348
|
+
const backgroundTop = -(frameRow * FILMSTRIP_DISPLAY_HEIGHT);
|
|
27349
|
+
const backgroundWidth = imageWidth ? imageWidth * scale : undefined;
|
|
27350
|
+
const cardWidth = displayWidth + 24;
|
|
27351
|
+
const filmstripLeft = Math.min(Math.max(0, position - cardWidth / 2), positionMax - cardWidth);
|
|
27352
|
+
__WEBPACK_EXTERNAL_MODULE_react_default__.useEffect(() => {
|
|
27353
|
+
if (!imageUrl) return;
|
|
27354
|
+
const filmstripImage = document.createElement('img');
|
|
27355
|
+
filmstripImage.onload = () => {
|
|
27356
|
+
setImageWidth(filmstripImage.naturalWidth);
|
|
27357
|
+
setIsLoading(false);
|
|
27358
|
+
};
|
|
27359
|
+
filmstripImage.src = imageUrl;
|
|
27360
|
+
}, [imageUrl]);
|
|
27361
|
+
return /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27362
|
+
className: classnames_default()('bp-FilmstripV2', {
|
|
27363
|
+
'bp-is-shown': isShown
|
|
27364
|
+
}),
|
|
27365
|
+
"data-testid": "bp-FilmstripV2",
|
|
27366
|
+
style: {
|
|
27367
|
+
left: `${filmstripLeft}px`
|
|
27368
|
+
}
|
|
27369
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27370
|
+
className: "bp-FilmstripV2-frame",
|
|
27371
|
+
"data-testid": "bp-FilmstripV2-frame",
|
|
27372
|
+
style: {
|
|
27373
|
+
backgroundImage: imageUrl ? `url('${imageUrl}')` : '',
|
|
27374
|
+
backgroundPositionX: backgroundLeft,
|
|
27375
|
+
backgroundPositionY: backgroundTop,
|
|
27376
|
+
backgroundSize: backgroundWidth ? `${backgroundWidth}px auto` : undefined,
|
|
27377
|
+
height: FILMSTRIP_DISPLAY_HEIGHT,
|
|
27378
|
+
width: displayWidth
|
|
27379
|
+
}
|
|
27380
|
+
}, isLoading && /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27381
|
+
className: "bp-crawler",
|
|
27382
|
+
"data-testid": "bp-FilmstripV2-crawler"
|
|
27383
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", null))), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27384
|
+
className: "bp-FilmstripV2-time",
|
|
27385
|
+
"data-testid": "bp-FilmstripV2-time"
|
|
27386
|
+
}, formatTime(time)));
|
|
27387
|
+
}
|
|
27388
|
+
;// ./src/lib/viewers/controls/media/TimeControlsV2.scss
|
|
27389
|
+
// extracted by mini-css-extract-plugin
|
|
27390
|
+
|
|
27391
|
+
;// ./src/lib/viewers/controls/media/TimeControlsV2.tsx
|
|
27392
|
+
|
|
27393
|
+
|
|
27394
|
+
|
|
27395
|
+
|
|
27396
|
+
|
|
27397
|
+
|
|
27398
|
+
|
|
27399
|
+
const TimeControlsV2_round = value => {
|
|
27400
|
+
return +value.toFixed(4);
|
|
27401
|
+
};
|
|
27402
|
+
const TimeControlsV2_percent = (value1, value2) => {
|
|
27403
|
+
return TimeControlsV2_round(value1 / value2 * 100);
|
|
27404
|
+
};
|
|
27405
|
+
function TimeControlsV2(_ref) {
|
|
27406
|
+
let {
|
|
27407
|
+
aspectRatio,
|
|
27408
|
+
currentTime = 0,
|
|
27409
|
+
durationTime = 0,
|
|
27410
|
+
filmstripInterval,
|
|
27411
|
+
filmstripUrl,
|
|
27412
|
+
fps,
|
|
27413
|
+
mediaEl,
|
|
27414
|
+
onTimeChange
|
|
27415
|
+
} = _ref;
|
|
27416
|
+
const [isSliderHovered, setIsSliderHovered] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(false);
|
|
27417
|
+
const [hoverPosition, setHoverPosition] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(0);
|
|
27418
|
+
const [hoverPositionMax, setHoverPositionMax] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(0);
|
|
27419
|
+
const [hoverTime, setHoverTime] = __WEBPACK_EXTERNAL_MODULE_react_default__.useState(0);
|
|
27420
|
+
const currentValue = isFinite_default()(currentTime) ? currentTime : 0;
|
|
27421
|
+
const durationValue = isFinite_default()(durationTime) ? durationTime : 0;
|
|
27422
|
+
const currentPercentage = TimeControlsV2_percent(currentValue, durationValue);
|
|
27423
|
+
const handleMouseMove = (newTime, newPosition, width) => {
|
|
27424
|
+
setHoverPosition(newPosition);
|
|
27425
|
+
setHoverPositionMax(width);
|
|
27426
|
+
setHoverTime(newTime);
|
|
27427
|
+
};
|
|
27428
|
+
return /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27429
|
+
className: "bp-TimeControlsV2",
|
|
27430
|
+
"data-testid": "bp-time-controls-v2"
|
|
27431
|
+
}, !!filmstripInterval && /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(FilmstripV2, {
|
|
27432
|
+
aspectRatio: aspectRatio,
|
|
27433
|
+
imageUrl: filmstripUrl,
|
|
27434
|
+
interval: filmstripInterval,
|
|
27435
|
+
isShown: isSliderHovered,
|
|
27436
|
+
position: hoverPosition,
|
|
27437
|
+
positionMax: hoverPositionMax,
|
|
27438
|
+
time: hoverTime
|
|
27439
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(SliderControl, {
|
|
27440
|
+
className: "bp-TimeControlsV2-slider",
|
|
27441
|
+
"data-resin-target": "timeScrubber",
|
|
27442
|
+
max: durationValue,
|
|
27443
|
+
min: 0,
|
|
27444
|
+
onBlur: (noop_default()),
|
|
27445
|
+
onFocus: (noop_default()),
|
|
27446
|
+
onMouseOut: () => setIsSliderHovered(false),
|
|
27447
|
+
onMouseOver: () => setIsSliderHovered(true),
|
|
27448
|
+
onMove: handleMouseMove,
|
|
27449
|
+
onUpdate: onTimeChange,
|
|
27450
|
+
step: fps ? 1 / fps : 5,
|
|
27451
|
+
title: "Media Slider",
|
|
27452
|
+
track: `linear-gradient(to right, ${__WEBPACK_EXTERNAL_MODULE_box_ui_elements_es_styles_variables_c815ce80_white__} calc(${currentPercentage}% - 2.5px), transparent calc(${currentPercentage}% - 2.5px), transparent calc(${currentPercentage}% + 2.5px), ${__WEBPACK_EXTERNAL_MODULE_box_ui_elements_es_styles_variables_c815ce80_bdlGray65__} calc(${currentPercentage}% + 2.5px), ${__WEBPACK_EXTERNAL_MODULE_box_ui_elements_es_styles_variables_c815ce80_bdlGray65__} 100%)`,
|
|
27453
|
+
value: currentValue
|
|
27454
|
+
}));
|
|
27455
|
+
}
|
|
27456
|
+
;// ./src/lib/viewers/media/VideoControlsV2.scss
|
|
27457
|
+
// extracted by mini-css-extract-plugin
|
|
27458
|
+
|
|
27459
|
+
;// ./src/lib/viewers/media/VideoControlsV2.tsx
|
|
27460
|
+
|
|
27461
|
+
|
|
27462
|
+
|
|
27463
|
+
|
|
27464
|
+
|
|
27465
|
+
|
|
27466
|
+
|
|
27467
|
+
|
|
27468
|
+
|
|
27469
|
+
|
|
27470
|
+
|
|
27471
|
+
|
|
27472
|
+
|
|
27473
|
+
|
|
27474
|
+
|
|
27475
|
+
function VideoControlsV2(_ref) {
|
|
27476
|
+
let {
|
|
27477
|
+
annotationColor,
|
|
27478
|
+
annotationMode,
|
|
27479
|
+
aspectRatio,
|
|
27480
|
+
audioTrack,
|
|
27481
|
+
audioTracks,
|
|
27482
|
+
autoplay,
|
|
27483
|
+
currentTime = 0,
|
|
27484
|
+
durationTime = 0,
|
|
27485
|
+
filmstripInterval,
|
|
27486
|
+
filmstripUrl,
|
|
27487
|
+
fps,
|
|
27488
|
+
hasDrawing,
|
|
27489
|
+
hasRegion,
|
|
27490
|
+
isAutoGeneratedSubtitles,
|
|
27491
|
+
isHDSupported,
|
|
27492
|
+
isNarrowVideo,
|
|
27493
|
+
isPlaying,
|
|
27494
|
+
mediaEl,
|
|
27495
|
+
movePlayback,
|
|
27496
|
+
onAnnotationColorChange,
|
|
27497
|
+
onAnnotationModeClick,
|
|
27498
|
+
onAnnotationModeEscape,
|
|
27499
|
+
onAudioTrackChange,
|
|
27500
|
+
onAutoplayChange,
|
|
27501
|
+
onMuteChange,
|
|
27502
|
+
onPlayPause,
|
|
27503
|
+
onQualityChange,
|
|
27504
|
+
onRateChange,
|
|
27505
|
+
onSubtitleChange,
|
|
27506
|
+
onSubtitlesToggle,
|
|
27507
|
+
onTimeChange,
|
|
27508
|
+
onVolumeChange,
|
|
27509
|
+
quality,
|
|
27510
|
+
rate,
|
|
27511
|
+
subtitle,
|
|
27512
|
+
subtitles = [],
|
|
27513
|
+
videoAnnotationsEnabled = false,
|
|
27514
|
+
volume
|
|
27515
|
+
} = _ref;
|
|
27516
|
+
const PlayPauseIcon = isPlaying ? icons_IconPause24 : icons_IconPlay24;
|
|
27517
|
+
const playPauseTitle = isPlaying ? "Pause" : "Play";
|
|
27518
|
+
const skipForwardTitle = "Skip forward";
|
|
27519
|
+
const skipBackwardTitle = "Skip backward";
|
|
27520
|
+
const moveForward = () => {
|
|
27521
|
+
movePlayback(true, MEDIA_PLAYBACK_SKIP_DURATION);
|
|
27522
|
+
};
|
|
27523
|
+
const moveBackward = () => {
|
|
27524
|
+
movePlayback(false, MEDIA_PLAYBACK_SKIP_DURATION);
|
|
27525
|
+
};
|
|
27526
|
+
const timeLabel = isNarrowVideo ? formatTime(currentTime) : `${formatTime(currentTime)} / ${formatTime(durationTime)}`;
|
|
27527
|
+
return /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27528
|
+
className: "bp-VideoControlsV2",
|
|
27529
|
+
"data-testid": "media-controls-wrapper-v2"
|
|
27530
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(TimeControlsV2, {
|
|
27531
|
+
aspectRatio: aspectRatio,
|
|
27532
|
+
currentTime: currentTime,
|
|
27533
|
+
durationTime: durationTime,
|
|
27534
|
+
filmstripInterval: filmstripInterval,
|
|
27535
|
+
filmstripUrl: filmstripUrl,
|
|
27536
|
+
fps: fps,
|
|
27537
|
+
mediaEl: mediaEl,
|
|
27538
|
+
onTimeChange: onTimeChange
|
|
27539
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27540
|
+
className: "bp-VideoControlsV2-bar"
|
|
27541
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27542
|
+
className: "bp-VideoControlsV2-group bp-VideoControlsV2-group--left"
|
|
27543
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(MediaToggle, {
|
|
27544
|
+
className: "bp-VideoControlsV2-playPause",
|
|
27545
|
+
"data-resin-target": "playPause",
|
|
27546
|
+
onClick: () => onPlayPause(!isPlaying),
|
|
27547
|
+
title: playPauseTitle
|
|
27548
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(PlayPauseIcon, null)), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27549
|
+
className: "bp-VideoControlsV2-divider"
|
|
27550
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(MediaToggle, {
|
|
27551
|
+
className: "bp-VideoControlsV2-skipBtn",
|
|
27552
|
+
"data-resin-target": "skipBackward",
|
|
27553
|
+
onClick: moveBackward,
|
|
27554
|
+
title: skipBackwardTitle
|
|
27555
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(icons_IconArrowCurveBack24, null)), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(MediaToggle, {
|
|
27556
|
+
className: "bp-VideoControlsV2-skipBtn",
|
|
27557
|
+
"data-resin-target": "skipForward",
|
|
27558
|
+
onClick: moveForward,
|
|
27559
|
+
title: skipForwardTitle
|
|
27560
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(icons_IconArrowCurveForward24, null)), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27561
|
+
className: "bp-VideoControlsV2-divider"
|
|
27562
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("span", {
|
|
27563
|
+
className: "bp-VideoControlsV2-timestamp",
|
|
27564
|
+
"data-testid": "bp-VideoControlsV2-timestamp"
|
|
27565
|
+
}, timeLabel)), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27566
|
+
className: "bp-VideoControlsV2-group bp-VideoControlsV2-group--right"
|
|
27567
|
+
}, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(VolumeControls, {
|
|
27568
|
+
onMuteChange: onMuteChange,
|
|
27569
|
+
onVolumeChange: onVolumeChange,
|
|
27570
|
+
volume: volume
|
|
27571
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(SubtitlesToggle, {
|
|
27572
|
+
isAutoGeneratedSubtitles: isAutoGeneratedSubtitles,
|
|
27573
|
+
isShowingSubtitles: subtitle !== SUBTITLES_OFF,
|
|
27574
|
+
onSubtitlesToggle: onSubtitlesToggle,
|
|
27575
|
+
subtitles: subtitles
|
|
27576
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(MediaSettings, {
|
|
27577
|
+
audioTrack: audioTrack,
|
|
27578
|
+
audioTracks: audioTracks,
|
|
27579
|
+
autoplay: autoplay,
|
|
27580
|
+
className: "bp-VideoControls-settings",
|
|
27581
|
+
isHDSupported: isHDSupported,
|
|
27582
|
+
onAudioTrackChange: onAudioTrackChange,
|
|
27583
|
+
onAutoplayChange: onAutoplayChange,
|
|
27584
|
+
onQualityChange: onQualityChange,
|
|
27585
|
+
onRateChange: onRateChange,
|
|
27586
|
+
onSubtitleChange: onSubtitleChange,
|
|
27587
|
+
quality: quality,
|
|
27588
|
+
rate: rate,
|
|
27589
|
+
subtitle: subtitle,
|
|
27590
|
+
subtitles: subtitles
|
|
27591
|
+
}), videoAnnotationsEnabled && /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(__WEBPACK_EXTERNAL_MODULE_react_default__.Fragment, null, /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement("div", {
|
|
27592
|
+
className: "bp-VideoControlsV2-divider"
|
|
27593
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(AnnotationsControls, {
|
|
27594
|
+
annotationColor: annotationColor,
|
|
27595
|
+
annotationMode: annotationMode,
|
|
27596
|
+
hasDrawing: hasDrawing,
|
|
27597
|
+
hasRegion: hasRegion,
|
|
27598
|
+
isVideo: true,
|
|
27599
|
+
onAnnotationModeClick: onAnnotationModeClick,
|
|
27600
|
+
onAnnotationModeEscape: onAnnotationModeEscape
|
|
27601
|
+
}), /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(DrawingControls, {
|
|
27602
|
+
annotationColor: annotationColor,
|
|
27603
|
+
annotationMode: annotationMode,
|
|
27604
|
+
onAnnotationColorChange: onAnnotationColorChange
|
|
27605
|
+
})))));
|
|
27606
|
+
}
|
|
27318
27607
|
;// ./src/lib/viewers/media/DashViewer.js
|
|
27319
27608
|
function DashViewer_ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
27320
27609
|
function DashViewer_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? DashViewer_ownKeys(Object(t), !0).forEach(function (r) { DashViewer_defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : DashViewer_ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
@@ -27334,6 +27623,7 @@ function DashViewer_toPrimitive(t, r) { if ("object" != typeof t || !t) return t
|
|
|
27334
27623
|
|
|
27335
27624
|
|
|
27336
27625
|
|
|
27626
|
+
|
|
27337
27627
|
const CSS_CLASS_DASH = 'bp-media-dash';
|
|
27338
27628
|
const CSS_CLASS_HD = 'bp-media-controls-is-hd';
|
|
27339
27629
|
const SEGMENT_SIZE = 5;
|
|
@@ -28520,28 +28810,24 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
28520
28810
|
} = this.options;
|
|
28521
28811
|
const canAnnotate = this.areNewAnnotationsEnabled() && this.hasAnnotationCreatePermission() && this.videoAnnotationsEnabled;
|
|
28522
28812
|
const annotationsEnabled = !!this.annotator && this.videoAnnotationsEnabled;
|
|
28523
|
-
|
|
28813
|
+
const sharedProps = {
|
|
28524
28814
|
annotationColor: this.annotationModule.getColor(),
|
|
28525
28815
|
annotationMode: this.annotationControlsFSM.getMode(),
|
|
28526
28816
|
aspectRatio: this.aspect,
|
|
28527
28817
|
audioTrack: this.selectedAudioTrack,
|
|
28528
28818
|
audioTracks: this.audioTracks,
|
|
28529
28819
|
autoplay: this.isAutoplayEnabled(),
|
|
28530
|
-
bufferedRange: this.mediaEl.buffered,
|
|
28531
28820
|
currentTime: this.mediaEl.currentTime,
|
|
28532
28821
|
durationTime: this.mediaEl.duration,
|
|
28533
|
-
experiences: this.experiences,
|
|
28534
28822
|
filmstripInterval: this.filmstripInterval,
|
|
28535
28823
|
filmstripUrl: this.filmstripUrl,
|
|
28536
28824
|
fps: this.featureEnabled('frameStep.enabled') && isFpsAvailable(this.player) ? getVideoFps(this.player) : undefined,
|
|
28537
28825
|
hasDrawing: canDraw,
|
|
28538
|
-
hasHighlight: false,
|
|
28539
28826
|
hasRegion: canAnnotate,
|
|
28540
28827
|
isAutoGeneratedSubtitles: !!this.autoCaptionDisplayer,
|
|
28541
28828
|
isHDSupported: this.hdVideoId !== -1,
|
|
28542
28829
|
isNarrowVideo: this.isNarrowVideo,
|
|
28543
28830
|
isPlaying: !this.mediaEl.paused,
|
|
28544
|
-
isPlayingHD: this.isPlayingHD(),
|
|
28545
28831
|
mediaEl: this.mediaEl,
|
|
28546
28832
|
movePlayback: this.movePlayback,
|
|
28547
28833
|
onAnnotationColorChange: this.handleAnnotationColorChange,
|
|
@@ -28549,7 +28835,6 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
28549
28835
|
onAnnotationModeEscape: this.handleAnnotationControlsEscape,
|
|
28550
28836
|
onAudioTrackChange: this.setAudioTrack,
|
|
28551
28837
|
onAutoplayChange: this.setAutoplay,
|
|
28552
|
-
onFullscreenToggle: this.toggleFullscreen,
|
|
28553
28838
|
onMuteChange: this.toggleMute,
|
|
28554
28839
|
onPlayPause: this.handlePlayRequest,
|
|
28555
28840
|
onQualityChange: this.setQuality,
|
|
@@ -28564,7 +28849,18 @@ class DashViewer extends media_VideoBaseViewer {
|
|
|
28564
28849
|
subtitles: this.textTracks,
|
|
28565
28850
|
videoAnnotationsEnabled: annotationsEnabled,
|
|
28566
28851
|
volume: this.mediaEl.volume
|
|
28567
|
-
}
|
|
28852
|
+
};
|
|
28853
|
+
if (this.featureEnabled('videoPlayerV2.enabled')) {
|
|
28854
|
+
this.controls.render( /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(VideoControlsV2, sharedProps));
|
|
28855
|
+
return;
|
|
28856
|
+
}
|
|
28857
|
+
this.controls.render( /*#__PURE__*/__WEBPACK_EXTERNAL_MODULE_react_default__.createElement(VideoControls, DashViewer_extends({}, sharedProps, {
|
|
28858
|
+
bufferedRange: this.mediaEl.buffered,
|
|
28859
|
+
experiences: this.experiences,
|
|
28860
|
+
hasHighlight: false,
|
|
28861
|
+
isPlayingHD: this.isPlayingHD(),
|
|
28862
|
+
onFullscreenToggle: this.toggleFullscreen
|
|
28863
|
+
})));
|
|
28568
28864
|
}
|
|
28569
28865
|
}
|
|
28570
28866
|
/* harmony default export */ const media_DashViewer = (DashViewer);
|
|
@@ -31855,12 +32151,9 @@ class DocBaseViewer extends viewers_BaseViewer {
|
|
|
31855
32151
|
}
|
|
31856
32152
|
}
|
|
31857
32153
|
|
|
31858
|
-
// Clean up viewer
|
|
32154
|
+
// Clean up viewer
|
|
31859
32155
|
if (this.pdfViewer) {
|
|
31860
32156
|
this.pdfViewer.cleanup();
|
|
31861
|
-
if (this.pdfViewer.pdfDocument) {
|
|
31862
|
-
this.pdfViewer.pdfDocument.destroy();
|
|
31863
|
-
}
|
|
31864
32157
|
}
|
|
31865
32158
|
if (this.printPopup) {
|
|
31866
32159
|
this.printPopup.destroy();
|