@mattebox/player 0.1.0 → 0.2.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 +4 -3
- package/dist/cdn/mattebox-player.min.js +200 -196
- package/dist/compose.d.ts +5 -0
- package/dist/compose.d.ts.map +1 -0
- package/dist/compose.js +31 -0
- package/dist/compose.js.map +1 -0
- package/dist/controls/chapters.d.ts +29 -0
- package/dist/controls/chapters.d.ts.map +1 -0
- package/dist/controls/chapters.js +81 -0
- package/dist/controls/chapters.js.map +1 -0
- package/dist/controls/cues.d.ts +8 -3
- package/dist/controls/cues.d.ts.map +1 -1
- package/dist/controls/cues.js +44 -10
- package/dist/controls/cues.js.map +1 -1
- package/dist/controls/fullscreen.d.ts +9 -9
- package/dist/controls/fullscreen.d.ts.map +1 -1
- package/dist/controls/fullscreen.js +17 -21
- package/dist/controls/fullscreen.js.map +1 -1
- package/dist/controls/icons.d.ts +1 -3
- package/dist/controls/icons.d.ts.map +1 -1
- package/dist/controls/icons.js +3 -6
- package/dist/controls/icons.js.map +1 -1
- package/dist/controls/menu.d.ts +14 -11
- package/dist/controls/menu.d.ts.map +1 -1
- package/dist/controls/menu.js +39 -34
- package/dist/controls/menu.js.map +1 -1
- package/dist/controls/session.d.ts +27 -0
- package/dist/controls/session.d.ts.map +1 -0
- package/dist/controls/session.js +36 -0
- package/dist/controls/session.js.map +1 -0
- package/dist/controls/slider.d.ts +6 -6
- package/dist/controls/slider.d.ts.map +1 -1
- package/dist/controls/slider.js +18 -13
- package/dist/controls/slider.js.map +1 -1
- package/dist/dom.d.ts +4 -10
- package/dist/dom.d.ts.map +1 -1
- package/dist/dom.js +4 -24
- package/dist/dom.js.map +1 -1
- package/dist/element-entry.d.ts +4 -0
- package/dist/element-entry.d.ts.map +1 -0
- package/dist/element-entry.js +9 -0
- package/dist/element-entry.js.map +1 -0
- package/dist/element.d.ts +54 -14
- package/dist/element.d.ts.map +1 -1
- package/dist/element.js +154 -73
- package/dist/element.js.map +1 -1
- package/dist/elements/audio-menu.d.ts +24 -0
- package/dist/elements/audio-menu.d.ts.map +1 -0
- package/dist/elements/audio-menu.js +70 -0
- package/dist/elements/audio-menu.js.map +1 -0
- package/dist/elements/chapters-menu.d.ts +12 -0
- package/dist/elements/chapters-menu.d.ts.map +1 -0
- package/dist/elements/chapters-menu.js +67 -0
- package/dist/elements/chapters-menu.js.map +1 -0
- package/dist/elements/component.d.ts +45 -0
- package/dist/elements/component.d.ts.map +1 -0
- package/dist/elements/component.js +90 -0
- package/dist/elements/component.js.map +1 -0
- package/dist/elements/control-bar.d.ts +46 -0
- package/dist/elements/control-bar.d.ts.map +1 -0
- package/dist/elements/control-bar.js +207 -0
- package/dist/elements/control-bar.js.map +1 -0
- package/dist/elements/current-time.d.ts +5 -0
- package/dist/elements/current-time.d.ts.map +1 -0
- package/dist/elements/current-time.js +27 -0
- package/dist/elements/current-time.js.map +1 -0
- package/dist/elements/drm-badge.d.ts +29 -0
- package/dist/elements/drm-badge.d.ts.map +1 -0
- package/dist/elements/drm-badge.js +145 -0
- package/dist/elements/drm-badge.js.map +1 -0
- package/dist/elements/duration.d.ts +6 -0
- package/dist/elements/duration.d.ts.map +1 -0
- package/dist/elements/duration.js +23 -0
- package/dist/elements/duration.js.map +1 -0
- package/dist/elements/error-screen.d.ts +17 -0
- package/dist/elements/error-screen.d.ts.map +1 -0
- package/dist/elements/error-screen.js +103 -0
- package/dist/elements/error-screen.js.map +1 -0
- package/dist/elements/fullscreen-button.d.ts +19 -0
- package/dist/elements/fullscreen-button.d.ts.map +1 -0
- package/dist/elements/fullscreen-button.js +55 -0
- package/dist/elements/fullscreen-button.js.map +1 -0
- package/dist/elements/live-button.d.ts +12 -0
- package/dist/elements/live-button.d.ts.map +1 -0
- package/dist/elements/live-button.js +96 -0
- package/dist/elements/live-button.js.map +1 -0
- package/dist/elements/menu-element.d.ts +22 -0
- package/dist/elements/menu-element.d.ts.map +1 -0
- package/dist/elements/menu-element.js +31 -0
- package/dist/elements/menu-element.js.map +1 -0
- package/dist/elements/mute-button.d.ts +12 -0
- package/dist/elements/mute-button.d.ts.map +1 -0
- package/dist/elements/mute-button.js +61 -0
- package/dist/elements/mute-button.js.map +1 -0
- package/dist/elements/panels.d.ts +15 -0
- package/dist/elements/panels.d.ts.map +1 -0
- package/dist/elements/panels.js +55 -0
- package/dist/elements/panels.js.map +1 -0
- package/dist/elements/pip-button.d.ts +13 -0
- package/dist/elements/pip-button.d.ts.map +1 -0
- package/dist/elements/pip-button.js +56 -0
- package/dist/elements/pip-button.js.map +1 -0
- package/dist/elements/play-button.d.ts +12 -0
- package/dist/elements/play-button.d.ts.map +1 -0
- package/dist/elements/play-button.js +60 -0
- package/dist/elements/play-button.js.map +1 -0
- package/dist/elements/quality-menu.d.ts +11 -0
- package/dist/elements/quality-menu.d.ts.map +1 -0
- package/dist/elements/quality-menu.js +72 -0
- package/dist/elements/quality-menu.js.map +1 -0
- package/dist/elements/seek-bar.d.ts +83 -0
- package/dist/elements/seek-bar.d.ts.map +1 -0
- package/dist/elements/seek-bar.js +352 -0
- package/dist/elements/seek-bar.js.map +1 -0
- package/dist/elements/shared.d.ts +27 -0
- package/dist/elements/shared.d.ts.map +1 -0
- package/dist/elements/shared.js +155 -0
- package/dist/elements/shared.js.map +1 -0
- package/dist/elements/skip-button.d.ts +14 -0
- package/dist/elements/skip-button.d.ts.map +1 -0
- package/dist/elements/skip-button.js +60 -0
- package/dist/elements/skip-button.js.map +1 -0
- package/dist/elements/spacer.d.ts +4 -0
- package/dist/elements/spacer.d.ts.map +1 -0
- package/dist/elements/spacer.js +9 -0
- package/dist/elements/spacer.js.map +1 -0
- package/dist/elements/speed-menu.d.ts +18 -0
- package/dist/elements/speed-menu.d.ts.map +1 -0
- package/dist/elements/speed-menu.js +56 -0
- package/dist/elements/speed-menu.js.map +1 -0
- package/dist/elements/start-button.d.ts +13 -0
- package/dist/elements/start-button.d.ts.map +1 -0
- package/dist/elements/start-button.js +83 -0
- package/dist/elements/start-button.js.map +1 -0
- package/dist/elements/subtitles-menu.d.ts +17 -0
- package/dist/elements/subtitles-menu.d.ts.map +1 -0
- package/dist/elements/subtitles-menu.js +108 -0
- package/dist/elements/subtitles-menu.js.map +1 -0
- package/dist/elements/time-element.d.ts +14 -0
- package/dist/elements/time-element.d.ts.map +1 -0
- package/dist/elements/time-element.js +29 -0
- package/dist/elements/time-element.js.map +1 -0
- package/dist/elements/volume-slider.d.ts +10 -0
- package/dist/elements/volume-slider.d.ts.map +1 -0
- package/dist/elements/volume-slider.js +46 -0
- package/dist/elements/volume-slider.js.map +1 -0
- package/dist/elements/volume.d.ts +9 -0
- package/dist/elements/volume.d.ts.map +1 -0
- package/dist/elements/volume.js +50 -0
- package/dist/elements/volume.js.map +1 -0
- package/dist/entries/audio-menu.d.ts +5 -0
- package/dist/entries/audio-menu.d.ts.map +1 -0
- package/dist/entries/audio-menu.js +8 -0
- package/dist/entries/audio-menu.js.map +1 -0
- package/dist/entries/chapters-menu.d.ts +5 -0
- package/dist/entries/chapters-menu.d.ts.map +1 -0
- package/dist/entries/chapters-menu.js +9 -0
- package/dist/entries/chapters-menu.js.map +1 -0
- package/dist/entries/control-bar.d.ts +5 -0
- package/dist/entries/control-bar.d.ts.map +1 -0
- package/dist/entries/control-bar.js +8 -0
- package/dist/entries/control-bar.js.map +1 -0
- package/dist/entries/current-time.d.ts +5 -0
- package/dist/entries/current-time.d.ts.map +1 -0
- package/dist/entries/current-time.js +8 -0
- package/dist/entries/current-time.js.map +1 -0
- package/dist/entries/drm-badge.d.ts +5 -0
- package/dist/entries/drm-badge.d.ts.map +1 -0
- package/dist/entries/drm-badge.js +8 -0
- package/dist/entries/drm-badge.js.map +1 -0
- package/dist/entries/duration.d.ts +5 -0
- package/dist/entries/duration.d.ts.map +1 -0
- package/dist/entries/duration.js +8 -0
- package/dist/entries/duration.js.map +1 -0
- package/dist/entries/error-screen.d.ts +5 -0
- package/dist/entries/error-screen.d.ts.map +1 -0
- package/dist/entries/error-screen.js +8 -0
- package/dist/entries/error-screen.js.map +1 -0
- package/dist/entries/fullscreen-button.d.ts +5 -0
- package/dist/entries/fullscreen-button.d.ts.map +1 -0
- package/dist/entries/fullscreen-button.js +8 -0
- package/dist/entries/fullscreen-button.js.map +1 -0
- package/dist/entries/live-button.d.ts +5 -0
- package/dist/entries/live-button.d.ts.map +1 -0
- package/dist/entries/live-button.js +8 -0
- package/dist/entries/live-button.js.map +1 -0
- package/dist/entries/mute-button.d.ts +5 -0
- package/dist/entries/mute-button.d.ts.map +1 -0
- package/dist/entries/mute-button.js +8 -0
- package/dist/entries/mute-button.js.map +1 -0
- package/dist/entries/panels.d.ts +5 -0
- package/dist/entries/panels.d.ts.map +1 -0
- package/dist/entries/panels.js +8 -0
- package/dist/entries/panels.js.map +1 -0
- package/dist/entries/pip-button.d.ts +5 -0
- package/dist/entries/pip-button.d.ts.map +1 -0
- package/dist/entries/pip-button.js +8 -0
- package/dist/entries/pip-button.js.map +1 -0
- package/dist/entries/play-button.d.ts +5 -0
- package/dist/entries/play-button.d.ts.map +1 -0
- package/dist/entries/play-button.js +8 -0
- package/dist/entries/play-button.js.map +1 -0
- package/dist/entries/quality-menu.d.ts +5 -0
- package/dist/entries/quality-menu.d.ts.map +1 -0
- package/dist/entries/quality-menu.js +8 -0
- package/dist/entries/quality-menu.js.map +1 -0
- package/dist/entries/seek-bar.d.ts +5 -0
- package/dist/entries/seek-bar.d.ts.map +1 -0
- package/dist/entries/seek-bar.js +8 -0
- package/dist/entries/seek-bar.js.map +1 -0
- package/dist/entries/skip-button.d.ts +5 -0
- package/dist/entries/skip-button.d.ts.map +1 -0
- package/dist/entries/skip-button.js +8 -0
- package/dist/entries/skip-button.js.map +1 -0
- package/dist/entries/spacer.d.ts +5 -0
- package/dist/entries/spacer.d.ts.map +1 -0
- package/dist/entries/spacer.js +8 -0
- package/dist/entries/spacer.js.map +1 -0
- package/dist/entries/speed-menu.d.ts +5 -0
- package/dist/entries/speed-menu.d.ts.map +1 -0
- package/dist/entries/speed-menu.js +8 -0
- package/dist/entries/speed-menu.js.map +1 -0
- package/dist/entries/start-button.d.ts +5 -0
- package/dist/entries/start-button.d.ts.map +1 -0
- package/dist/entries/start-button.js +8 -0
- package/dist/entries/start-button.js.map +1 -0
- package/dist/entries/subtitles-menu.d.ts +5 -0
- package/dist/entries/subtitles-menu.d.ts.map +1 -0
- package/dist/entries/subtitles-menu.js +8 -0
- package/dist/entries/subtitles-menu.js.map +1 -0
- package/dist/entries/volume-slider.d.ts +5 -0
- package/dist/entries/volume-slider.d.ts.map +1 -0
- package/dist/entries/volume-slider.js +8 -0
- package/dist/entries/volume-slider.js.map +1 -0
- package/dist/entries/volume.d.ts +7 -0
- package/dist/entries/volume.d.ts.map +1 -0
- package/dist/entries/volume.js +10 -0
- package/dist/entries/volume.js.map +1 -0
- package/dist/es2015/compose.js +33 -0
- package/dist/es2015/controls/chapters.js +61 -0
- package/dist/es2015/controls/cues.js +39 -11
- package/dist/es2015/controls/fullscreen.js +25 -23
- package/dist/es2015/controls/icons.js +5 -9
- package/dist/es2015/controls/menu.js +39 -35
- package/dist/es2015/controls/session.js +40 -0
- package/dist/es2015/controls/slider.js +18 -13
- package/dist/es2015/controls/time.js +1 -5
- package/dist/es2015/dom.js +5 -25
- package/dist/es2015/element-entry.js +10 -0
- package/dist/es2015/element.js +118 -65
- package/dist/es2015/elements/audio-menu.js +68 -0
- package/dist/es2015/elements/chapters-menu.js +68 -0
- package/dist/es2015/elements/component.js +84 -0
- package/dist/es2015/elements/control-bar.js +178 -0
- package/dist/es2015/elements/current-time.js +27 -0
- package/dist/es2015/elements/drm-badge.js +138 -0
- package/dist/es2015/elements/duration.js +23 -0
- package/dist/es2015/elements/error-screen.js +97 -0
- package/dist/es2015/elements/fullscreen-button.js +49 -0
- package/dist/es2015/elements/live-button.js +97 -0
- package/dist/es2015/elements/menu-element.js +39 -0
- package/dist/es2015/elements/mute-button.js +60 -0
- package/dist/es2015/elements/panels.js +52 -0
- package/dist/es2015/elements/pip-button.js +56 -0
- package/dist/es2015/elements/play-button.js +68 -0
- package/dist/es2015/elements/quality-menu.js +68 -0
- package/dist/es2015/elements/seek-bar.js +314 -0
- package/dist/es2015/elements/shared.js +155 -0
- package/dist/es2015/elements/skip-button.js +59 -0
- package/dist/es2015/elements/spacer.js +11 -0
- package/dist/es2015/elements/speed-menu.js +60 -0
- package/dist/es2015/elements/start-button.js +87 -0
- package/dist/es2015/elements/subtitles-menu.js +103 -0
- package/dist/es2015/elements/time-element.js +38 -0
- package/dist/es2015/elements/volume-slider.js +47 -0
- package/dist/es2015/elements/volume.js +50 -0
- package/dist/es2015/entries/audio-menu.js +7 -0
- package/dist/es2015/entries/chapters-menu.js +7 -0
- package/dist/es2015/entries/control-bar.js +7 -0
- package/dist/es2015/entries/current-time.js +7 -0
- package/dist/es2015/entries/drm-badge.js +7 -0
- package/dist/es2015/entries/duration.js +7 -0
- package/dist/es2015/entries/error-screen.js +7 -0
- package/dist/es2015/entries/fullscreen-button.js +7 -0
- package/dist/es2015/entries/live-button.js +7 -0
- package/dist/es2015/entries/mute-button.js +7 -0
- package/dist/es2015/entries/panels.js +7 -0
- package/dist/es2015/entries/pip-button.js +7 -0
- package/dist/es2015/entries/play-button.js +7 -0
- package/dist/es2015/entries/quality-menu.js +7 -0
- package/dist/es2015/entries/seek-bar.js +7 -0
- package/dist/es2015/entries/skip-button.js +7 -0
- package/dist/es2015/entries/spacer.js +7 -0
- package/dist/es2015/entries/speed-menu.js +7 -0
- package/dist/es2015/entries/start-button.js +7 -0
- package/dist/es2015/entries/subtitles-menu.js +7 -0
- package/dist/es2015/entries/volume-slider.js +7 -0
- package/dist/es2015/entries/volume.js +9 -0
- package/dist/es2015/host.js +23 -0
- package/dist/es2015/index.js +46 -9
- package/dist/es2015/labels.js +14 -0
- package/dist/es2015/style.js +21 -294
- package/dist/es2015/{panels/error.js → surface.js} +3 -3
- package/dist/es2015/tags.js +27 -0
- package/dist/host.d.ts +26 -0
- package/dist/host.d.ts.map +1 -0
- package/dist/host.js +23 -0
- package/dist/host.js.map +1 -0
- package/dist/index.d.ts +81 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +23 -8
- package/dist/index.js.map +1 -1
- package/dist/labels.d.ts +7 -0
- package/dist/labels.d.ts.map +1 -0
- package/dist/labels.js +12 -0
- package/dist/labels.js.map +1 -0
- package/dist/style.d.ts +4 -2
- package/dist/style.d.ts.map +1 -1
- package/dist/style.js +21 -294
- package/dist/style.js.map +1 -1
- package/dist/surface.d.ts +15 -0
- package/dist/surface.d.ts.map +1 -0
- package/dist/{panels/error.js → surface.js} +3 -3
- package/dist/surface.js.map +1 -0
- package/dist/tags.d.ts +25 -0
- package/dist/tags.d.ts.map +1 -0
- package/dist/tags.js +25 -0
- package/dist/tags.js.map +1 -0
- package/package.json +22 -2
- package/dist/controls/bar.d.ts +0 -56
- package/dist/controls/bar.d.ts.map +0 -1
- package/dist/controls/bar.js +0 -245
- package/dist/controls/bar.js.map +0 -1
- package/dist/controls/buttons.d.ts +0 -13
- package/dist/controls/buttons.d.ts.map +0 -1
- package/dist/controls/buttons.js +0 -157
- package/dist/controls/buttons.js.map +0 -1
- package/dist/controls/control.d.ts +0 -12
- package/dist/controls/control.d.ts.map +0 -1
- package/dist/controls/control.js +0 -2
- package/dist/controls/control.js.map +0 -1
- package/dist/controls/keys.d.ts +0 -26
- package/dist/controls/keys.d.ts.map +0 -1
- package/dist/controls/keys.js +0 -66
- package/dist/controls/keys.js.map +0 -1
- package/dist/controls/live.d.ts +0 -10
- package/dist/controls/live.d.ts.map +0 -1
- package/dist/controls/live.js +0 -59
- package/dist/controls/live.js.map +0 -1
- package/dist/controls/menus.d.ts +0 -43
- package/dist/controls/menus.d.ts.map +0 -1
- package/dist/controls/menus.js +0 -262
- package/dist/controls/menus.js.map +0 -1
- package/dist/controls/options.d.ts +0 -44
- package/dist/controls/options.d.ts.map +0 -1
- package/dist/controls/options.js +0 -54
- package/dist/controls/options.js.map +0 -1
- package/dist/controls/screens.d.ts +0 -22
- package/dist/controls/screens.d.ts.map +0 -1
- package/dist/controls/screens.js +0 -69
- package/dist/controls/screens.js.map +0 -1
- package/dist/controls/seek.d.ts +0 -52
- package/dist/controls/seek.d.ts.map +0 -1
- package/dist/controls/seek.js +0 -215
- package/dist/controls/seek.js.map +0 -1
- package/dist/controls/speed.d.ts +0 -8
- package/dist/controls/speed.d.ts.map +0 -1
- package/dist/controls/speed.js +0 -34
- package/dist/controls/speed.js.map +0 -1
- package/dist/controls/volume.d.ts +0 -8
- package/dist/controls/volume.d.ts.map +0 -1
- package/dist/controls/volume.js +0 -29
- package/dist/controls/volume.js.map +0 -1
- package/dist/es2015/controls/bar.js +0 -227
- package/dist/es2015/controls/buttons.js +0 -146
- package/dist/es2015/controls/keys.js +0 -60
- package/dist/es2015/controls/live.js +0 -60
- package/dist/es2015/controls/menus.js +0 -258
- package/dist/es2015/controls/options.js +0 -46
- package/dist/es2015/controls/screens.js +0 -74
- package/dist/es2015/controls/seek.js +0 -203
- package/dist/es2015/controls/speed.js +0 -41
- package/dist/es2015/controls/volume.js +0 -30
- package/dist/es2015/panels/drm.js +0 -29
- package/dist/es2015/panels/live.js +0 -48
- package/dist/es2015/panels/quality.js +0 -52
- package/dist/es2015/panels/tracks.js +0 -47
- package/dist/panels/drm.d.ts +0 -8
- package/dist/panels/drm.d.ts.map +0 -1
- package/dist/panels/drm.js +0 -36
- package/dist/panels/drm.js.map +0 -1
- package/dist/panels/error.d.ts +0 -13
- package/dist/panels/error.d.ts.map +0 -1
- package/dist/panels/error.js.map +0 -1
- package/dist/panels/live.d.ts +0 -3
- package/dist/panels/live.d.ts.map +0 -1
- package/dist/panels/live.js +0 -56
- package/dist/panels/live.js.map +0 -1
- package/dist/panels/panel.d.ts +0 -13
- package/dist/panels/panel.d.ts.map +0 -1
- package/dist/panels/panel.js +0 -2
- package/dist/panels/panel.js.map +0 -1
- package/dist/panels/quality.d.ts +0 -3
- package/dist/panels/quality.d.ts.map +0 -1
- package/dist/panels/quality.js +0 -59
- package/dist/panels/quality.js.map +0 -1
- package/dist/panels/tracks.d.ts +0 -3
- package/dist/panels/tracks.d.ts.map +0 -1
- package/dist/panels/tracks.js +0 -49
- package/dist/panels/tracks.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose.d.ts","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AA0CA,+BAA+B;AAC/B,wBAAgB,UAAU,IAAI,WAAW,EAAE,CAW1C;AAED,+BAA+B;AAC/B,wBAAgB,aAAa,IAAI,WAAW,EAAE,CAM7C"}
|
package/dist/compose.js
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The default compositions: what a player gets when the page wrote none of
|
|
3
|
+
* its own. Under `controls="custom"` the screens and the bar, appended
|
|
4
|
+
* when there is no `<mbx-control-bar>` child; under `native` and `none`
|
|
5
|
+
* the panels row under the video, appended when there is no
|
|
6
|
+
* `<mbx-panels>` child. Built by tag, so this module needs no element
|
|
7
|
+
* class, and appended to the player's light DOM, where the page can see
|
|
8
|
+
* it and style it the way it would its own.
|
|
9
|
+
*/
|
|
10
|
+
import { AUDIO_MENU, CHAPTERS_MENU, CONTROL_BAR, CURRENT_TIME, DRM_BADGE, DURATION, ERROR_SCREEN, FULLSCREEN_BUTTON, LIVE_BUTTON, PANELS, PIP_BUTTON, PLAY_BUTTON, QUALITY_MENU, SEEK_BAR, SKIP_BUTTON, SPACER, SPEED_MENU, START_BUTTON, SUBTITLES_MENU, VOLUME, } from './tags.js';
|
|
11
|
+
function skip(seconds) {
|
|
12
|
+
const node = document.createElement(SKIP_BUTTON);
|
|
13
|
+
node.setAttribute('seconds', String(seconds));
|
|
14
|
+
return node;
|
|
15
|
+
}
|
|
16
|
+
function each(...tags) {
|
|
17
|
+
return tags.map((tag) => document.createElement(tag));
|
|
18
|
+
}
|
|
19
|
+
/** The screens and the bar. */
|
|
20
|
+
export function composeBar() {
|
|
21
|
+
const bar = document.createElement(CONTROL_BAR);
|
|
22
|
+
bar.append(...each(CURRENT_TIME, SEEK_BAR, DURATION, LIVE_BUTTON), skip(-10), document.createElement(PLAY_BUTTON), skip(10), ...each(VOLUME, SPACER, SPEED_MENU, CHAPTERS_MENU, SUBTITLES_MENU, AUDIO_MENU), ...each(QUALITY_MENU, PIP_BUTTON, FULLSCREEN_BUTTON));
|
|
23
|
+
return [...each(START_BUTTON, ERROR_SCREEN), bar];
|
|
24
|
+
}
|
|
25
|
+
/** The row under the video. */
|
|
26
|
+
export function composePanels() {
|
|
27
|
+
const row = document.createElement(PANELS);
|
|
28
|
+
row.append(...each(QUALITY_MENU, AUDIO_MENU, SUBTITLES_MENU, CHAPTERS_MENU, LIVE_BUTTON, DRM_BADGE));
|
|
29
|
+
return [row];
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=compose.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"compose.js","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,OAAO,EACL,UAAU,EACV,aAAa,EACb,WAAW,EACX,YAAY,EACZ,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACX,MAAM,EACN,UAAU,EACV,WAAW,EACX,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,MAAM,EACN,UAAU,EACV,YAAY,EACZ,cAAc,EACd,MAAM,GACP,MAAM,WAAW,CAAC;AAEnB,SAAS,IAAI,CAAC,OAAe;IAC3B,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IACjD,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;IAC9C,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,IAAI,CAAC,GAAG,IAAc;IAC7B,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC;AACxD,CAAC;AAED,+BAA+B;AAC/B,MAAM,UAAU,UAAU;IACxB,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAChD,GAAG,CAAC,MAAM,CACR,GAAG,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAE,QAAQ,EAAE,WAAW,CAAC,EACtD,IAAI,CAAC,CAAC,EAAE,CAAC,EACT,QAAQ,CAAC,aAAa,CAAC,WAAW,CAAC,EACnC,IAAI,CAAC,EAAE,CAAC,EACR,GAAG,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,cAAc,EAAE,UAAU,CAAC,EAC9E,GAAG,IAAI,CAAC,YAAY,EAAE,UAAU,EAAE,iBAAiB,CAAC,CACrD,CAAC;IACF,OAAO,CAAC,GAAG,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,EAAE,GAAG,CAAC,CAAC;AACpD,CAAC;AAED,+BAA+B;AAC/B,MAAM,UAAU,aAAa;IAC3B,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC3C,GAAG,CAAC,MAAM,CACR,GAAG,IAAI,CAAC,YAAY,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,EAAE,WAAW,EAAE,SAAS,CAAC,CACzF,CAAC;IACF,OAAO,CAAC,GAAG,CAAC,CAAC;AACf,CAAC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Chapters are the browser's own: a text track of kind `chapters` on the
|
|
3
|
+
* video, from a `<track>` the page or the player's `chapters` attribute put
|
|
4
|
+
* there, or from `addTextTrack`. The seek bar and the chapters menu read the
|
|
5
|
+
* same track through these helpers, so the two agree without knowing each
|
|
6
|
+
* other, and a native session has chapters the same way.
|
|
7
|
+
*
|
|
8
|
+
* A track from a `<track>` element loads its cues only while its mode is
|
|
9
|
+
* `hidden` or `showing`, so a disabled chapters track is set hidden here:
|
|
10
|
+
* hidden draws nothing, and the cues arrive.
|
|
11
|
+
*/
|
|
12
|
+
export interface Chapter {
|
|
13
|
+
readonly start: number;
|
|
14
|
+
readonly end: number;
|
|
15
|
+
readonly title: string;
|
|
16
|
+
}
|
|
17
|
+
/** The first chapters track on the video, or null. */
|
|
18
|
+
export declare function chapterTrack(video: HTMLVideoElement): TextTrack | null;
|
|
19
|
+
/** The chapters of the video, in order, or none. */
|
|
20
|
+
export declare function chapters(video: HTMLVideoElement): Chapter[];
|
|
21
|
+
/** The index of the chapter `time` falls in, the last one started, or -1 before the first. */
|
|
22
|
+
export declare function chapterAt(list: readonly Chapter[], time: number): number;
|
|
23
|
+
/**
|
|
24
|
+
* Runs `fn` whenever the chapters may have changed: a track added or removed,
|
|
25
|
+
* the cues of a `<track>` arriving, or the active cue moving on. Returns
|
|
26
|
+
* the unsubscribe. Every chapters track found is set hidden, so its cues load.
|
|
27
|
+
*/
|
|
28
|
+
export declare function followChapters(video: HTMLVideoElement, fn: () => void): () => void;
|
|
29
|
+
//# sourceMappingURL=chapters.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chapters.d.ts","sourceRoot":"","sources":["../../src/controls/chapters.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,MAAM,WAAW,OAAO;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED,sDAAsD;AACtD,wBAAgB,YAAY,CAAC,KAAK,EAAE,gBAAgB,GAAG,SAAS,GAAG,IAAI,CAGtE;AAED,oDAAoD;AACpD,wBAAgB,QAAQ,CAAC,KAAK,EAAE,gBAAgB,GAAG,OAAO,EAAE,CAS3D;AAED,8FAA8F;AAC9F,wBAAgB,SAAS,CAAC,IAAI,EAAE,SAAS,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAIxE;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,gBAAgB,EAAE,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CA+BlF"}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Chapters are the browser's own: a text track of kind `chapters` on the
|
|
3
|
+
* video, from a `<track>` the page or the player's `chapters` attribute put
|
|
4
|
+
* there, or from `addTextTrack`. The seek bar and the chapters menu read the
|
|
5
|
+
* same track through these helpers, so the two agree without knowing each
|
|
6
|
+
* other, and a native session has chapters the same way.
|
|
7
|
+
*
|
|
8
|
+
* A track from a `<track>` element loads its cues only while its mode is
|
|
9
|
+
* `hidden` or `showing`, so a disabled chapters track is set hidden here:
|
|
10
|
+
* hidden draws nothing, and the cues arrive.
|
|
11
|
+
*/
|
|
12
|
+
/** The first chapters track on the video, or null. */
|
|
13
|
+
export function chapterTrack(video) {
|
|
14
|
+
for (const track of video.textTracks)
|
|
15
|
+
if (track.kind === 'chapters')
|
|
16
|
+
return track;
|
|
17
|
+
return null;
|
|
18
|
+
}
|
|
19
|
+
/** The chapters of the video, in order, or none. */
|
|
20
|
+
export function chapters(video) {
|
|
21
|
+
const track = chapterTrack(video);
|
|
22
|
+
if (track === null || track.cues === null)
|
|
23
|
+
return [];
|
|
24
|
+
const out = [];
|
|
25
|
+
for (const cue of track.cues) {
|
|
26
|
+
const text = cue instanceof VTTCue ? cue.text : '';
|
|
27
|
+
out.push({ start: cue.startTime, end: cue.endTime, title: text.trim() });
|
|
28
|
+
}
|
|
29
|
+
return out.sort((a, b) => a.start - b.start);
|
|
30
|
+
}
|
|
31
|
+
/** The index of the chapter `time` falls in, the last one started, or -1 before the first. */
|
|
32
|
+
export function chapterAt(list, time) {
|
|
33
|
+
let found = -1;
|
|
34
|
+
for (const [i, chapter] of list.entries())
|
|
35
|
+
if (chapter.start <= time)
|
|
36
|
+
found = i;
|
|
37
|
+
return found;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Runs `fn` whenever the chapters may have changed: a track added or removed,
|
|
41
|
+
* the cues of a `<track>` arriving, or the active cue moving on. Returns
|
|
42
|
+
* the unsubscribe. Every chapters track found is set hidden, so its cues load.
|
|
43
|
+
*/
|
|
44
|
+
export function followChapters(video, fn) {
|
|
45
|
+
const listen = (target, name, handler) => {
|
|
46
|
+
target.addEventListener(name, handler);
|
|
47
|
+
return () => {
|
|
48
|
+
target.removeEventListener(name, handler);
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
/** The listeners on the tracks of the moment, replaced when the list changes. */
|
|
52
|
+
let inner = [];
|
|
53
|
+
const wire = () => {
|
|
54
|
+
for (const off of inner)
|
|
55
|
+
off();
|
|
56
|
+
inner = [];
|
|
57
|
+
for (const track of video.textTracks) {
|
|
58
|
+
if (track.kind !== 'chapters')
|
|
59
|
+
continue;
|
|
60
|
+
if (track.mode === 'disabled')
|
|
61
|
+
track.mode = 'hidden';
|
|
62
|
+
inner.push(listen(track, 'cuechange', fn));
|
|
63
|
+
}
|
|
64
|
+
for (const node of video.querySelectorAll('track')) {
|
|
65
|
+
if (node.kind === 'chapters')
|
|
66
|
+
inner.push(listen(node, 'load', fn));
|
|
67
|
+
}
|
|
68
|
+
fn();
|
|
69
|
+
};
|
|
70
|
+
const outer = [
|
|
71
|
+
listen(video.textTracks, 'addtrack', wire),
|
|
72
|
+
listen(video.textTracks, 'removetrack', wire),
|
|
73
|
+
];
|
|
74
|
+
wire();
|
|
75
|
+
return () => {
|
|
76
|
+
for (const off of [...outer, ...inner])
|
|
77
|
+
off();
|
|
78
|
+
inner = [];
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
//# sourceMappingURL=chapters.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"chapters.js","sourceRoot":"","sources":["../../src/controls/chapters.ts"],"names":[],"mappings":"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"}
|
package/dist/controls/cues.d.ts
CHANGED
|
@@ -20,14 +20,19 @@
|
|
|
20
20
|
* already follows the video's height, in the page and in fullscreen alike.
|
|
21
21
|
* A page that wants more writes its own `mattebox-player > video::cue`.
|
|
22
22
|
*/
|
|
23
|
-
import type { Control } from './control.js';
|
|
24
23
|
/** How the sizes scale the browser's own cue size; the lift counts lines by it. */
|
|
25
24
|
export declare const SCALES: Readonly<Record<string, number>>;
|
|
26
25
|
/** Puts the cue rules in the document, once. */
|
|
27
26
|
export declare function cueStyle(): void;
|
|
28
|
-
export interface CueLift
|
|
27
|
+
export interface CueLift {
|
|
29
28
|
/** Whether the bar is showing, so the cues move above it or back. */
|
|
30
29
|
lifted(on: boolean): void;
|
|
30
|
+
dispose(): void;
|
|
31
31
|
}
|
|
32
|
-
|
|
32
|
+
/** What the bar covers of the picture: from its first row's top, not its gradient run-in, to its bottom. */
|
|
33
|
+
export type Covered = () => {
|
|
34
|
+
readonly top: number;
|
|
35
|
+
readonly bottom: number;
|
|
36
|
+
};
|
|
37
|
+
export declare function cueLift(video: HTMLVideoElement, host: HTMLElement, covered: Covered): CueLift;
|
|
33
38
|
//# sourceMappingURL=cues.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cues.d.ts","sourceRoot":"","sources":["../../src/controls/cues.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,
|
|
1
|
+
{"version":3,"file":"cues.d.ts","sourceRoot":"","sources":["../../src/controls/cues.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,mFAAmF;AACnF,eAAO,MAAM,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAKnD,CAAC;AA4BF,gDAAgD;AAChD,wBAAgB,QAAQ,IAAI,IAAI,CAM/B;AASD,MAAM,WAAW,OAAO;IACtB,qEAAqE;IACrE,MAAM,CAAC,EAAE,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,OAAO,IAAI,IAAI,CAAC;CACjB;AAED,4GAA4G;AAC5G,MAAM,MAAM,OAAO,GAAG,MAAM;IAAE,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AAE9E,wBAAgB,OAAO,CAAC,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO,GAAG,OAAO,CA8I7F"}
|
package/dist/controls/cues.js
CHANGED
|
@@ -1,3 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Subtitles and the bar. Two things.
|
|
3
|
+
*
|
|
4
|
+
* The lift: the browser draws native cues at the bottom of the video, under
|
|
5
|
+
* the bar. While the bar shows, every active cue the author left
|
|
6
|
+
* unpositioned is moved above it, and put back when the bar hides. The
|
|
7
|
+
* position is a negative line count, the one form every browser wraps at
|
|
8
|
+
* the video's width; a percentage does not wrap in Chromium. Chromium
|
|
9
|
+
* anchors the box's top on the count and Gecko its bottom, and their
|
|
10
|
+
* overlap avoidance pushes in opposite directions, so nothing is left to
|
|
11
|
+
* them: subtitles often show two cues at once, and the cues stack by their
|
|
12
|
+
* own measured heights, wrapping included, clear under both readings. A
|
|
13
|
+
* cue with a position of its own is the author's and is not touched.
|
|
14
|
+
*
|
|
15
|
+
* The look: `::cue` can only be styled from the document that holds the
|
|
16
|
+
* video, which is the page and not the shadow root, and it takes no custom
|
|
17
|
+
* properties. So a small sheet goes into the document, once, with one rule
|
|
18
|
+
* per look the host's `subtitle-size` and `subtitle-background` attributes
|
|
19
|
+
* can take. Sizes are percentages of the browser's own cue size, which
|
|
20
|
+
* already follows the video's height, in the page and in fullscreen alike.
|
|
21
|
+
* A page that wants more writes its own `mattebox-player > video::cue`.
|
|
22
|
+
*/
|
|
1
23
|
/** How the sizes scale the browser's own cue size; the lift counts lines by it. */
|
|
2
24
|
export const SCALES = {
|
|
3
25
|
small: 0.75,
|
|
@@ -36,7 +58,7 @@ export function cueStyle() {
|
|
|
36
58
|
style.textContent = CUE_RULES;
|
|
37
59
|
document.head.append(style);
|
|
38
60
|
}
|
|
39
|
-
export function cueLift(video,
|
|
61
|
+
export function cueLift(video, host, covered) {
|
|
40
62
|
/** The cues moved, with what they were, so they and only they are put back. */
|
|
41
63
|
const lifted = new Map();
|
|
42
64
|
let on = false;
|
|
@@ -59,11 +81,29 @@ export function cueLift(video, bar, host) {
|
|
|
59
81
|
canvas = document.createElement('canvas').getContext('2d');
|
|
60
82
|
return canvas;
|
|
61
83
|
}
|
|
84
|
+
/**
|
|
85
|
+
* A cue's text without its tags, for measuring: `<b>`, `<c.name>`, the
|
|
86
|
+
* timestamps and their closers. Brackets are counted, so a tag inside
|
|
87
|
+
* another's brackets goes with it.
|
|
88
|
+
*/
|
|
89
|
+
function plain(text) {
|
|
90
|
+
let out = '';
|
|
91
|
+
let depth = 0;
|
|
92
|
+
for (const char of text) {
|
|
93
|
+
if (char === '<')
|
|
94
|
+
depth += 1;
|
|
95
|
+
else if (char === '>')
|
|
96
|
+
depth = Math.max(0, depth - 1);
|
|
97
|
+
else if (depth === 0)
|
|
98
|
+
out += char;
|
|
99
|
+
}
|
|
100
|
+
return out;
|
|
101
|
+
}
|
|
62
102
|
/** The lines a cue takes: its own, each wrapped at the cue box's width. */
|
|
63
103
|
function lines(cue, font, width) {
|
|
64
104
|
const context = measure();
|
|
65
105
|
let total = 0;
|
|
66
|
-
for (const line of cue.text
|
|
106
|
+
for (const line of plain(cue.text).split('\n')) {
|
|
67
107
|
if (context === null) {
|
|
68
108
|
total += 1;
|
|
69
109
|
continue;
|
|
@@ -73,16 +113,11 @@ export function cueLift(video, bar, host) {
|
|
|
73
113
|
}
|
|
74
114
|
return total;
|
|
75
115
|
}
|
|
76
|
-
/** The bar's height from its first row, not its gradient run-in, to its bottom, which sits on the video's. */
|
|
77
|
-
function covered() {
|
|
78
|
-
const whole = bar.getBoundingClientRect();
|
|
79
|
-
const first = bar.firstElementChild?.getBoundingClientRect() ?? whole;
|
|
80
|
-
return whole.bottom - first.top;
|
|
81
|
-
}
|
|
82
116
|
function apply() {
|
|
83
117
|
const box = video.getBoundingClientRect();
|
|
84
118
|
const height = box.height;
|
|
85
|
-
const
|
|
119
|
+
const span = covered();
|
|
120
|
+
const pixels = span.bottom - span.top;
|
|
86
121
|
const lift = on && height > 0 && pixels > 0 && pixels < height;
|
|
87
122
|
const font = fontSize(height);
|
|
88
123
|
const unit = font * LINE_HEIGHT;
|
|
@@ -152,7 +187,6 @@ export function cueLift(video, bar, host) {
|
|
|
152
187
|
video.textTracks.addEventListener('addtrack', watch);
|
|
153
188
|
watch();
|
|
154
189
|
return {
|
|
155
|
-
root: bar,
|
|
156
190
|
lifted(next) {
|
|
157
191
|
on = next;
|
|
158
192
|
apply();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cues.js","sourceRoot":"","sources":["../../src/controls/cues.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"cues.js","sourceRoot":"","sources":["../../src/controls/cues.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Fullscreen on the
|
|
3
|
-
*
|
|
4
|
-
* order: the standard one; the `webkit` prefix on elements, which
|
|
5
|
-
* kept until 16.4; and the iPhone, which has fullscreen on the
|
|
6
|
-
* None of them means no button.
|
|
2
|
+
* Fullscreen on the player itself, so the video and every control in it
|
|
3
|
+
* come along, through whichever API the browser has. Three shapes, tried
|
|
4
|
+
* in order: the standard one; the `webkit` prefix on elements, which
|
|
5
|
+
* Safari kept until 16.4; and the iPhone, which has fullscreen on the
|
|
6
|
+
* video alone. None of them means no button.
|
|
7
7
|
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
8
|
+
* "Active" is whether the host is the fullscreen element, which `:fullscreen`
|
|
9
|
+
* answers whatever tree the host is in: `document.fullscreenElement` is
|
|
10
|
+
* retargeted when the host sits in a shadow root, and the pseudo-class is not.
|
|
11
11
|
*/
|
|
12
12
|
export interface Fullscreen {
|
|
13
13
|
/** Whether any API exists. Without one the button is hidden. */
|
|
@@ -17,5 +17,5 @@ export interface Fullscreen {
|
|
|
17
17
|
/** Runs `fn` on every change. Returns the unsubscribe. */
|
|
18
18
|
watch(fn: () => void): () => void;
|
|
19
19
|
}
|
|
20
|
-
export declare function fullscreen(host: HTMLElement,
|
|
20
|
+
export declare function fullscreen(host: HTMLElement, video: HTMLVideoElement): Fullscreen;
|
|
21
21
|
//# sourceMappingURL=fullscreen.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fullscreen.d.ts","sourceRoot":"","sources":["../../src/controls/fullscreen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAiBH,MAAM,WAAW,UAAU;IACzB,gEAAgE;IAChE,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,MAAM,IAAI,OAAO,CAAC;IAClB,MAAM,IAAI,IAAI,CAAC;IACf,0DAA0D;IAC1D,KAAK,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC;CACnC;AAWD,wBAAgB,UAAU,
|
|
1
|
+
{"version":3,"file":"fullscreen.d.ts","sourceRoot":"","sources":["../../src/controls/fullscreen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAiBH,MAAM,WAAW,UAAU;IACzB,gEAAgE;IAChE,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,MAAM,IAAI,OAAO,CAAC;IAClB,MAAM,IAAI,IAAI,CAAC;IACf,0DAA0D;IAC1D,KAAK,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC;CACnC;AAWD,wBAAgB,UAAU,CAAC,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,gBAAgB,GAAG,UAAU,CAmDjF"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Fullscreen on the
|
|
3
|
-
*
|
|
4
|
-
* order: the standard one; the `webkit` prefix on elements, which
|
|
5
|
-
* kept until 16.4; and the iPhone, which has fullscreen on the
|
|
6
|
-
* None of them means no button.
|
|
2
|
+
* Fullscreen on the player itself, so the video and every control in it
|
|
3
|
+
* come along, through whichever API the browser has. Three shapes, tried
|
|
4
|
+
* in order: the standard one; the `webkit` prefix on elements, which
|
|
5
|
+
* Safari kept until 16.4; and the iPhone, which has fullscreen on the
|
|
6
|
+
* video alone. None of them means no button.
|
|
7
7
|
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
8
|
+
* "Active" is whether the host is the fullscreen element, which `:fullscreen`
|
|
9
|
+
* answers whatever tree the host is in: `document.fullscreenElement` is
|
|
10
|
+
* retargeted when the host sits in a shadow root, and the pseudo-class is not.
|
|
11
11
|
*/
|
|
12
12
|
function watching(target, names) {
|
|
13
13
|
return (fn) => {
|
|
@@ -19,35 +19,31 @@ function watching(target, names) {
|
|
|
19
19
|
};
|
|
20
20
|
};
|
|
21
21
|
}
|
|
22
|
-
export function fullscreen(host,
|
|
22
|
+
export function fullscreen(host, video) {
|
|
23
23
|
const doc = document;
|
|
24
|
-
const prefixed =
|
|
24
|
+
const prefixed = host;
|
|
25
25
|
const phone = video;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
return node !== null && node !== undefined && host.contains(node);
|
|
29
|
-
}
|
|
30
|
-
if (typeof stage.requestFullscreen === 'function') {
|
|
26
|
+
if (typeof host.requestFullscreen === 'function') {
|
|
27
|
+
const active = () => host.matches(':fullscreen');
|
|
31
28
|
return {
|
|
32
29
|
supported: true,
|
|
33
|
-
active
|
|
30
|
+
active,
|
|
34
31
|
toggle() {
|
|
35
32
|
// Both return promises that reject outside a user gesture or where
|
|
36
33
|
// the page forbids it; there is nothing to do with that but drop it.
|
|
37
|
-
const request =
|
|
38
|
-
? document.exitFullscreen()
|
|
39
|
-
: stage.requestFullscreen();
|
|
34
|
+
const request = active() ? document.exitFullscreen() : host.requestFullscreen();
|
|
40
35
|
request.catch(() => undefined);
|
|
41
36
|
},
|
|
42
37
|
watch: watching(document, ['fullscreenchange']),
|
|
43
38
|
};
|
|
44
39
|
}
|
|
45
40
|
if (typeof prefixed.webkitRequestFullscreen === 'function') {
|
|
41
|
+
const active = () => doc.webkitFullscreenElement === host;
|
|
46
42
|
return {
|
|
47
43
|
supported: true,
|
|
48
|
-
active
|
|
44
|
+
active,
|
|
49
45
|
toggle() {
|
|
50
|
-
if (
|
|
46
|
+
if (active())
|
|
51
47
|
doc.webkitExitFullscreen?.();
|
|
52
48
|
else
|
|
53
49
|
prefixed.webkitRequestFullscreen?.();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fullscreen.js","sourceRoot":"","sources":["../../src/controls/fullscreen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AA0BH,SAAS,QAAQ,CAAC,MAAmB,EAAE,KAAwB;IAC7D,OAAO,CAAC,EAAc,EAAgB,EAAE;QACtC,KAAK,MAAM,IAAI,IAAI,KAAK;YAAE,MAAM,CAAC,gBAAgB,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAC5D,OAAO,GAAG,EAAE;YACV,KAAK,MAAM,IAAI,IAAI,KAAK;gBAAE,MAAM,CAAC,mBAAmB,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjE,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,UAAU,
|
|
1
|
+
{"version":3,"file":"fullscreen.js","sourceRoot":"","sources":["../../src/controls/fullscreen.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AA0BH,SAAS,QAAQ,CAAC,MAAmB,EAAE,KAAwB;IAC7D,OAAO,CAAC,EAAc,EAAgB,EAAE;QACtC,KAAK,MAAM,IAAI,IAAI,KAAK;YAAE,MAAM,CAAC,gBAAgB,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAC5D,OAAO,GAAG,EAAE;YACV,KAAK,MAAM,IAAI,IAAI,KAAK;gBAAE,MAAM,CAAC,mBAAmB,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjE,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,UAAU,CAAC,IAAiB,EAAE,KAAuB;IACnE,MAAM,GAAG,GAAG,QAAuC,CAAC;IACpD,MAAM,QAAQ,GAAG,IAAqC,CAAC;IACvD,MAAM,KAAK,GAAG,KAAyC,CAAC;IAExD,IAAI,OAAO,IAAI,CAAC,iBAAiB,KAAK,UAAU,EAAE,CAAC;QACjD,MAAM,MAAM,GAAG,GAAY,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAC1D,OAAO;YACL,SAAS,EAAE,IAAI;YACf,MAAM;YACN,MAAM;gBACJ,mEAAmE;gBACnE,qEAAqE;gBACrE,MAAM,OAAO,GAAG,MAAM,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;gBAChF,OAAO,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC;YACjC,CAAC;YACD,KAAK,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC,kBAAkB,CAAC,CAAC;SAChD,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,QAAQ,CAAC,uBAAuB,KAAK,UAAU,EAAE,CAAC;QAC3D,MAAM,MAAM,GAAG,GAAY,EAAE,CAAC,GAAG,CAAC,uBAAuB,KAAK,IAAI,CAAC;QACnE,OAAO;YACL,SAAS,EAAE,IAAI;YACf,MAAM;YACN,MAAM;gBACJ,IAAI,MAAM,EAAE;oBAAE,GAAG,CAAC,oBAAoB,EAAE,EAAE,CAAC;;oBACtC,QAAQ,CAAC,uBAAuB,EAAE,EAAE,CAAC;YAC5C,CAAC;YACD,KAAK,EAAE,QAAQ,CAAC,QAAQ,EAAE,CAAC,wBAAwB,CAAC,CAAC;SACtD,CAAC;IACJ,CAAC;IAED,IAAI,OAAO,KAAK,CAAC,qBAAqB,KAAK,UAAU,EAAE,CAAC;QACtD,OAAO;YACL,SAAS,EAAE,IAAI;YACf,MAAM,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,0BAA0B,KAAK,IAAI;YACvD,MAAM;gBACJ,IAAI,KAAK,CAAC,0BAA0B,KAAK,IAAI;oBAAE,KAAK,CAAC,oBAAoB,EAAE,EAAE,CAAC;;oBACzE,KAAK,CAAC,qBAAqB,EAAE,EAAE,CAAC;YACvC,CAAC;YACD,KAAK,EAAE,QAAQ,CAAC,KAAK,EAAE,CAAC,uBAAuB,EAAE,qBAAqB,CAAC,CAAC;SACzE,CAAC;IACJ,CAAC;IAED,OAAO;QACL,SAAS,EAAE,KAAK;QAChB,MAAM,EAAE,GAAG,EAAE,CAAC,KAAK;QACnB,MAAM,KAAU,CAAC;QACjB,KAAK,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC;KACtB,CAAC;AACJ,CAAC"}
|
package/dist/controls/icons.d.ts
CHANGED
|
@@ -27,9 +27,7 @@
|
|
|
27
27
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
28
28
|
* SOFTWARE.
|
|
29
29
|
*/
|
|
30
|
-
export type IconName = 'play' | 'pause' | 'replay' | 'mute' | 'volume-low' | 'volume-high' | 'fullscreen' | 'fullscreen-exit' | 'settings' | 'music' | 'closed-captions' | 'closed-captions-on' | 'lock-closed' | 'seek-backward' | 'seek-forward' | 'seek-backward-10' | 'seek-forward-10' | 'seek-backward-30' | 'seek-forward-30' | 'playback-speed' | 'picture-in-picture' | 'picture-in-picture-exit';
|
|
30
|
+
export type IconName = 'play' | 'pause' | 'replay' | 'mute' | 'volume-low' | 'volume-high' | 'fullscreen' | 'fullscreen-exit' | 'settings' | 'music' | 'closed-captions' | 'closed-captions-on' | 'lock-closed' | 'seek-backward' | 'seek-forward' | 'seek-backward-10' | 'seek-forward-10' | 'seek-backward-30' | 'seek-forward-30' | 'playback-speed' | 'picture-in-picture' | 'picture-in-picture-exit' | 'chapters';
|
|
31
31
|
/** A glyph, hidden from the accessibility tree: the button it sits in carries the name. */
|
|
32
32
|
export declare function icon(name: IconName): SVGSVGElement;
|
|
33
|
-
/** Swaps the glyph in place, so the part and the focus ring stay put across states. */
|
|
34
|
-
export declare function glyph(svg: SVGSVGElement, name: IconName): void;
|
|
35
33
|
//# sourceMappingURL=icons.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/controls/icons.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,MAAM,MAAM,QAAQ,GAChB,MAAM,GACN,OAAO,GACP,QAAQ,GACR,MAAM,GACN,YAAY,GACZ,aAAa,GACb,YAAY,GACZ,iBAAiB,GACjB,UAAU,GACV,OAAO,GACP,iBAAiB,GACjB,oBAAoB,GACpB,aAAa,GACb,eAAe,GACf,cAAc,GACd,kBAAkB,GAClB,iBAAiB,GACjB,kBAAkB,GAClB,iBAAiB,GACjB,gBAAgB,GAChB,oBAAoB,GACpB,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../src/controls/icons.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,MAAM,MAAM,QAAQ,GAChB,MAAM,GACN,OAAO,GACP,QAAQ,GACR,MAAM,GACN,YAAY,GACZ,aAAa,GACb,YAAY,GACZ,iBAAiB,GACjB,UAAU,GACV,OAAO,GACP,iBAAiB,GACjB,oBAAoB,GACpB,aAAa,GACb,eAAe,GACf,cAAc,GACd,kBAAkB,GAClB,iBAAiB,GACjB,kBAAkB,GAClB,iBAAiB,GACjB,gBAAgB,GAChB,oBAAoB,GACpB,yBAAyB,GACzB,UAAU,CAAC;AAwDf,2FAA2F;AAC3F,wBAAgB,IAAI,CAAC,IAAI,EAAE,QAAQ,GAAG,aAAa,CAUlD"}
|
package/dist/controls/icons.js
CHANGED
|
@@ -55,6 +55,7 @@ const PATHS = {
|
|
|
55
55
|
'playback-speed': 'M13.9213 5.53573C14.3146 5.45804 14.6666 5.76987 14.6666 6.17079V7.57215C14.6666 7.89777 14.4305 8.17277 14.114 8.24925C12.5981 8.61559 11.2506 9.41368 10.2091 10.506C9.98474 10.7414 9.62903 10.8079 9.34742 10.6453L8.14112 9.94885C7.79394 9.7484 7.69985 9.28777 7.96359 8.98585C9.48505 7.24409 11.5636 6.00143 13.9213 5.53573Z M5.88974 12.5908C6.01805 12.2101 6.46491 12.0603 6.81279 12.2611L8.01201 12.9535C8.29379 13.1162 8.41396 13.4577 8.32238 13.7699C8.11252 14.4854 7.99998 15.2424 7.99998 16.0257C7.99998 16.809 8.11252 17.566 8.32238 18.2814C8.41396 18.5936 8.29378 18.9352 8.01201 19.0979L6.82742 19.7818C6.48051 19.9821 6.03488 19.8337 5.90521 19.4547C5.5345 18.3712 5.33331 17.2091 5.33331 16C5.33331 14.8078 5.5289 13.6613 5.88974 12.5908Z M8.17106 22.0852C7.82291 22.2862 7.72949 22.7486 7.99532 23.0502C9.51387 24.773 11.5799 26.0017 13.9213 26.4642C14.3146 26.5419 14.6666 26.2301 14.6666 25.8291V24.4792C14.6666 24.1536 14.4305 23.8786 14.114 23.8021C12.5981 23.4358 11.2506 22.6377 10.2091 21.5453C9.98474 21.31 9.62903 21.2435 9.34742 21.4061L8.17106 22.0852Z M17.3333 25.8291C17.3333 26.2301 17.6857 26.5418 18.079 26.4641C22.9748 25.4969 26.6666 21.1796 26.6666 16C26.6666 10.8204 22.9748 6.50302 18.079 5.5358C17.6857 5.4581 17.3333 5.76987 17.3333 6.17079V7.57215C17.3333 7.89777 17.5697 8.17282 17.8862 8.24932C21.3942 9.09721 24 12.2572 24 16.0257C24 19.7942 21.3942 22.9542 17.8862 23.802C17.5697 23.8785 17.3333 24.1536 17.3333 24.4792V25.8291Z M14.3961 10.4163C13.9561 10.0911 13.3333 10.4053 13.3333 10.9525L13.3333 21.0474C13.3333 21.5946 13.9561 21.9087 14.3962 21.5836L21.2273 16.5359C21.5879 16.2694 21.5879 15.73 21.2273 15.4635L14.3961 10.4163Z',
|
|
56
56
|
'picture-in-picture': 'M16 15.3333C15.6318 15.3333 15.3333 15.6318 15.3333 16V20C15.3333 20.3682 15.6318 20.6667 16 20.6667H21.3333C21.7015 20.6667 22 20.3682 22 20V16C22 15.6318 21.7015 15.3333 21.3333 15.3333H16Z M5.33333 7.33334C5.33333 6.96515 5.63181 6.66667 5.99999 6.66667H26C26.3682 6.66667 26.6667 6.96515 26.6667 7.33334V24.6667C26.6667 25.0349 26.3682 25.3333 26 25.3333H5.99999C5.63181 25.3333 5.33333 25.0349 5.33333 24.6667V7.33334ZM7.99999 10C7.99999 9.63182 8.29847 9.33334 8.66666 9.33334H23.3333C23.7015 9.33334 24 9.63182 24 10V22C24 22.3682 23.7015 22.6667 23.3333 22.6667H8.66666C8.29847 22.6667 7.99999 22.3682 7.99999 22V10Z',
|
|
57
57
|
'picture-in-picture-exit': 'M5.33334 26V19.4667C5.33334 19.393 5.39304 19.3333 5.46668 19.3333H7.86668C7.94031 19.3333 8.00001 19.393 8.00001 19.4667V23.3333C8.00001 23.7015 8.29849 24 8.66668 24H23.3333C23.7015 24 24 23.7015 24 23.3333V8.66666C24 8.29847 23.7015 7.99999 23.3333 7.99999H19.4667C19.393 7.99999 19.3333 7.9403 19.3333 7.86666V5.46666C19.3333 5.39302 19.393 5.33333 19.4667 5.33333H26C26.3682 5.33333 26.6667 5.63181 26.6667 5.99999V26C26.6667 26.3682 26.3682 26.6667 26 26.6667H6.00001C5.63182 26.6667 5.33334 26.3682 5.33334 26Z M14.0098 8.42359H10.806C10.6872 8.42359 10.6277 8.56721 10.7117 8.6512L16.5491 14.4886C16.8094 14.7489 16.8094 15.171 16.5491 15.4314L15.3234 16.657C15.0631 16.9174 14.641 16.9174 14.3806 16.657L8.63739 10.9138C8.55339 10.8298 8.40978 10.8893 8.40978 11.0081V14.0236C8.40978 14.3918 8.1113 14.6903 7.74311 14.6903H6.00978C5.64159 14.6903 5.34311 14.3918 5.34311 14.0236L5.34311 6.02359C5.34311 5.6554 5.64159 5.35692 6.00978 5.35692L14.0098 5.35692C14.378 5.35692 14.6764 5.6554 14.6764 6.02359V7.75692C14.6764 8.12511 14.378 8.42359 14.0098 8.42359Z',
|
|
58
|
+
chapters: 'M16.6927 25.3346C16.3245 25.3346 16.026 25.0361 16.026 24.6679L16.026 7.3346C16.026 6.96641 16.3245 6.66794 16.6927 6.66794L18.6927 6.66794C19.0609 6.66794 19.3594 6.96642 19.3594 7.3346L19.3594 24.6679C19.3594 25.0361 19.0609 25.3346 18.6927 25.3346H16.6927Z M24.026 25.3346C23.6578 25.3346 23.3594 25.0361 23.3594 24.6679L23.3594 7.3346C23.3594 6.96641 23.6578 6.66794 24.026 6.66794L26.026 6.66794C26.3942 6.66794 26.6927 6.96642 26.6927 7.3346V24.6679C26.6927 25.0361 26.3942 25.3346 26.026 25.3346H24.026Z M5.48113 23.9407C5.38584 24.2963 5.59689 24.6619 5.95254 24.7572L7.88439 25.2748C8.24003 25.3701 8.60559 25.159 8.70089 24.8034L13.1871 8.06067C13.2824 7.70503 13.0713 7.33947 12.7157 7.24417L10.7838 6.72654C10.4282 6.63124 10.0626 6.8423 9.96733 7.19794L5.48113 23.9407Z',
|
|
58
59
|
};
|
|
59
60
|
const SVG = 'http://www.w3.org/2000/svg';
|
|
60
61
|
/** A glyph, hidden from the accessibility tree: the button it sits in carries the name. */
|
|
@@ -62,15 +63,11 @@ export function icon(name) {
|
|
|
62
63
|
const svg = document.createElementNS(SVG, 'svg');
|
|
63
64
|
svg.setAttribute('viewBox', '0 0 32 32');
|
|
64
65
|
svg.setAttribute('aria-hidden', 'true');
|
|
66
|
+
svg.setAttribute('part', 'icon');
|
|
65
67
|
const path = document.createElementNS(SVG, 'path');
|
|
66
68
|
path.setAttribute('fill-rule', 'evenodd');
|
|
69
|
+
path.setAttribute('d', PATHS[name]);
|
|
67
70
|
svg.append(path);
|
|
68
|
-
glyph(svg, name);
|
|
69
71
|
return svg;
|
|
70
72
|
}
|
|
71
|
-
/** Swaps the glyph in place, so the part and the focus ring stay put across states. */
|
|
72
|
-
export function glyph(svg, name) {
|
|
73
|
-
svg.setAttribute('part', `icon ${name}-icon`);
|
|
74
|
-
svg.firstElementChild?.setAttribute('d', PATHS[name]);
|
|
75
|
-
}
|
|
76
73
|
//# sourceMappingURL=icons.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/controls/icons.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;
|
|
1
|
+
{"version":3,"file":"icons.js","sourceRoot":"","sources":["../../src/controls/icons.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AA2BH;;;;GAIG;AACH,MAAM,KAAK,GAAuC;IAChD,IAAI,EAAE,gNAAgN;IACtN,KAAK,EACH,ocAAoc;IACtc,MAAM,EACJ,4qBAA4qB;IAC9qB,IAAI,EAAE,wmCAAwmC;IAC9mC,YAAY,EACV,ujBAAujB;IACzjB,aAAa,EACX,yxBAAyxB;IAC3xB,UAAU,EACR,i0CAAi0C;IACn0C,iBAAiB,EACf,m2CAAm2C;IACr2C,QAAQ,EACN,y9DAAy9D;IAC39D,KAAK,EACH,i+BAAi+B;IACn+B,iBAAiB,EACf,kiCAAkiC;IACpiC,oBAAoB,EAClB,w1CAAw1C;IAC11C,aAAa,EACX,uyBAAuyB;IACzyB,eAAe,EACb,4qBAA4qB;IAC9qB,cAAc,EACZ,8rBAA8rB;IAChsB,kBAAkB,EAChB,8oEAA8oE;IAChpE,iBAAiB,EACf,2oEAA2oE;IAC7oE,kBAAkB,EAChB,0qHAA0qH;IAC5qH,iBAAiB,EACf,wrHAAwrH;IAC1rH,gBAAgB,EACd,gpDAAgpD;IAClpD,oBAAoB,EAClB,knBAAknB;IACpnB,yBAAyB,EACvB,8iCAA8iC;IAChjC,QAAQ,EACN,gxBAAgxB;CACnxB,CAAC;AAEF,MAAM,GAAG,GAAG,4BAA4B,CAAC;AAEzC,2FAA2F;AAC3F,MAAM,UAAU,IAAI,CAAC,IAAc;IACjC,MAAM,GAAG,GAAG,QAAQ,CAAC,eAAe,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACjD,GAAG,CAAC,YAAY,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IACzC,GAAG,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IACxC,GAAG,CAAC,YAAY,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IACnD,IAAI,CAAC,YAAY,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IAC1C,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;IACpC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IACjB,OAAO,GAAG,CAAC;AACb,CAAC"}
|
package/dist/controls/menu.d.ts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import type { Control } from './control.js';
|
|
2
|
-
import type { IconName } from './icons.js';
|
|
3
1
|
export interface MenuGroup {
|
|
4
2
|
/** The part suffix: `track`, `size`. */
|
|
5
3
|
readonly name: string;
|
|
6
4
|
/** A heading, or none for a menu of one group. */
|
|
7
5
|
readonly label?: string;
|
|
8
|
-
|
|
6
|
+
/** Each item's id, its text, and a detail drawn at its end, such as a chapter's time. */
|
|
7
|
+
readonly items: ReadonlyArray<readonly [string, string, string?]>;
|
|
9
8
|
readonly value: string;
|
|
10
9
|
readonly onSelect: (value: string) => void;
|
|
11
10
|
}
|
|
@@ -17,18 +16,22 @@ export interface MenuPage {
|
|
|
17
16
|
}
|
|
18
17
|
export type MenuEntry = MenuGroup | MenuPage;
|
|
19
18
|
export interface MenuOptions {
|
|
20
|
-
/** The
|
|
21
|
-
readonly
|
|
22
|
-
/** The
|
|
23
|
-
readonly
|
|
24
|
-
|
|
19
|
+
/** The element the menu belongs to: it carries `open`, and a pointer inside it is not outside. */
|
|
20
|
+
readonly host: HTMLElement;
|
|
21
|
+
/** The top of the picture, in viewport pixels, which the popup never rises above. */
|
|
22
|
+
readonly ceiling: () => number | null;
|
|
23
|
+
/** The name of the Back item, from the page it leaves: "Back from {page}". */
|
|
24
|
+
readonly back: (page: string) => string;
|
|
25
25
|
}
|
|
26
|
-
export interface Menu
|
|
26
|
+
export interface Menu {
|
|
27
|
+
readonly button: HTMLButtonElement;
|
|
28
|
+
readonly popup: HTMLElement;
|
|
29
|
+
/** The accessible name of the button and the popup. */
|
|
30
|
+
label(text: string): void;
|
|
27
31
|
/** Replaces the entries, back at the first page. */
|
|
28
32
|
fill(entries: readonly MenuEntry[]): void;
|
|
29
|
-
/** Swaps the button's glyph, for a menu whose state shows on it. */
|
|
30
|
-
show(name: IconName): void;
|
|
31
33
|
close(): void;
|
|
34
|
+
dispose(): void;
|
|
32
35
|
}
|
|
33
36
|
export declare function menu(options: MenuOptions): Menu;
|
|
34
37
|
//# sourceMappingURL=menu.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/controls/menu.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../src/controls/menu.ts"],"names":[],"mappings":"AAsBA,MAAM,WAAW,SAAS;IACxB,wCAAwC;IACxC,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,kDAAkD;IAClD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,yFAAyF;IACzF,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;IAClE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,oEAAoE;AACpE,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,OAAO,EAAE,SAAS,SAAS,EAAE,CAAC;CACxC;AAED,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE7C,MAAM,WAAW,WAAW;IAC1B,kGAAkG;IAClG,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAC;IAC3B,qFAAqF;IACrF,QAAQ,CAAC,OAAO,EAAE,MAAM,MAAM,GAAG,IAAI,CAAC;IACtC,8EAA8E;IAC9E,QAAQ,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;CACzC;AAED,MAAM,WAAW,IAAI;IACnB,QAAQ,CAAC,MAAM,EAAE,iBAAiB,CAAC;IACnC,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC;IAC5B,uDAAuD;IACvD,KAAK,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,oDAAoD;IACpD,IAAI,CAAC,OAAO,EAAE,SAAS,SAAS,EAAE,GAAG,IAAI,CAAC;IAC1C,KAAK,IAAI,IAAI,CAAC;IACd,OAAO,IAAI,IAAI,CAAC;CACjB;AASD,wBAAgB,IAAI,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,CA+M/C"}
|