@gcorevideo/player 2.24.1 → 2.24.3

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.
Files changed (68) hide show
  1. package/assets/big-mute-button/big-mute-button.ejs +2 -2
  2. package/assets/bottom-gear/gear-sub-menu.scss +1 -0
  3. package/dist/core.js +1 -1
  4. package/dist/index.css +754 -753
  5. package/dist/index.js +151 -130
  6. package/dist/player.d.ts +72 -21
  7. package/docs/api/player.bigmutebutton.md +13 -1
  8. package/docs/api/player.clapprstatssettings.md +51 -4
  9. package/docs/api/player.clapprstatssettings.runeach.md +16 -0
  10. package/docs/api/player.clipspluginsettings.md +1 -1
  11. package/docs/api/player.clipspluginsettings.text.md +1 -1
  12. package/docs/api/player.cmcdconfig.exportids.md +4 -0
  13. package/docs/api/player.cmcdconfig.md +19 -105
  14. package/docs/api/{player.cmcdconfig.version.md → player.cmcdconfigoptions.contentid.md} +5 -3
  15. package/docs/api/player.cmcdconfigoptions.md +79 -0
  16. package/docs/api/{player.cmcdconfigpluginsettings.md → player.cmcdconfigoptions.sessionid.md} +4 -6
  17. package/docs/api/player.extendedevents.md +9 -0
  18. package/docs/api/player.md +37 -31
  19. package/docs/api/player.mediacontrol.getavailableheight.md +24 -0
  20. package/docs/api/player.mediacontrol.md +14 -0
  21. package/docs/api/{player.cmcdconfig.name.md → player.posterpluginsettings.custom.md} +4 -3
  22. package/docs/api/player.posterpluginsettings.md +108 -7
  23. package/docs/api/player.posterpluginsettings.showfornoop.md +16 -0
  24. package/docs/api/player.posterpluginsettings.showonvideoend.md +16 -0
  25. package/docs/api/{player.cmcdconfig.bindevents.md → player.posterpluginsettings.url.md} +4 -7
  26. package/lib/plugins/big-mute-button/BigMuteButton.d.ts +15 -13
  27. package/lib/plugins/big-mute-button/BigMuteButton.d.ts.map +1 -1
  28. package/lib/plugins/big-mute-button/BigMuteButton.js +68 -83
  29. package/lib/plugins/bottom-gear/BottomGear.d.ts +1 -0
  30. package/lib/plugins/bottom-gear/BottomGear.d.ts.map +1 -1
  31. package/lib/plugins/bottom-gear/BottomGear.js +17 -17
  32. package/lib/plugins/clappr-stats/ClapprStats.d.ts +6 -2
  33. package/lib/plugins/clappr-stats/ClapprStats.d.ts.map +1 -1
  34. package/lib/plugins/clips/Clips.d.ts +1 -1
  35. package/lib/plugins/clips/Clips.d.ts.map +1 -1
  36. package/lib/plugins/clips/Clips.js +2 -1
  37. package/lib/plugins/cmcd-config/CmcdConfig.d.ts +34 -11
  38. package/lib/plugins/cmcd-config/CmcdConfig.d.ts.map +1 -1
  39. package/lib/plugins/cmcd-config/CmcdConfig.js +28 -18
  40. package/lib/plugins/media-control/MediaControl.d.ts +11 -0
  41. package/lib/plugins/media-control/MediaControl.d.ts.map +1 -1
  42. package/lib/plugins/media-control/MediaControl.js +19 -5
  43. package/lib/plugins/poster/Poster.d.ts +7 -3
  44. package/lib/plugins/poster/Poster.d.ts.map +1 -1
  45. package/lib/plugins/source-controller/SourceController.d.ts +1 -0
  46. package/lib/plugins/source-controller/SourceController.d.ts.map +1 -1
  47. package/lib/plugins/source-controller/SourceController.js +20 -9
  48. package/lib/testUtils.d.ts +1 -0
  49. package/lib/testUtils.d.ts.map +1 -1
  50. package/lib/testUtils.js +3 -0
  51. package/package.json +1 -1
  52. package/src/plugins/big-mute-button/BigMuteButton.ts +75 -110
  53. package/src/plugins/big-mute-button/__tests__/BigMuteButton.test.ts +38 -0
  54. package/src/plugins/big-mute-button/__tests__/__snapshots__/BigMuteButton.test.ts.snap +8 -0
  55. package/src/plugins/bottom-gear/BottomGear.ts +40 -28
  56. package/src/plugins/bottom-gear/__tests__/BottomGear.test.ts +34 -7
  57. package/src/plugins/bottom-gear/__tests__/__snapshots__/BottomGear.test.ts.snap +5 -2
  58. package/src/plugins/clappr-stats/ClapprStats.ts +5 -1
  59. package/src/plugins/clips/Clips.ts +3 -2
  60. package/src/plugins/cmcd-config/CmcdConfig.ts +33 -27
  61. package/src/plugins/media-control/MediaControl.ts +23 -6
  62. package/src/plugins/poster/Poster.ts +6 -2
  63. package/src/plugins/source-controller/SourceController.ts +25 -9
  64. package/src/plugins/source-controller/__tests__/SourceController.test.ts +28 -8
  65. package/src/testUtils.ts +3 -0
  66. package/temp/player.api.json +229 -154
  67. package/tsconfig.tsbuildinfo +1 -1
  68. package/docs/api/player.cmcdconfig.supportedversion.md +0 -14
@@ -61,7 +61,7 @@ Description
61
61
 
62
62
  </td><td>
63
63
 
64
- **_(BETA)_** `PLUGIN` that displays a big mute button over the video when it's muted. Once pressed, it unmutes the video.
64
+ **_(BETA)_** `PLUGIN` that displays a big mute button over the video when it's being played muted.
65
65
 
66
66
 
67
67
  </td></tr>
@@ -127,7 +127,7 @@ Description
127
127
 
128
128
  </td><td>
129
129
 
130
- **_(BETA)_** A `PLUGIN` that configures CMCD for playback
130
+ **_(BETA)_** A `PLUGIN` that configures [CMCD](https://cdn.cta.tech/cta/media/media/resources/standards/pdfs/cta-5004-final.pdf) for playback
131
131
 
132
132
 
133
133
  </td></tr>
@@ -428,6 +428,8 @@ Description
428
428
 
429
429
  </td><td>
430
430
 
431
+ **_(BETA)_** Extended events for the [MediaControl](./player.mediacontrol.md) plugin
432
+
431
433
 
432
434
  </td></tr>
433
435
  <tr><td>
@@ -539,6 +541,17 @@ Description
539
541
  </th></tr></thead>
540
542
  <tbody><tr><td>
541
543
 
544
+ [ClapprStatsSettings](./player.clapprstatssettings.md)
545
+
546
+
547
+ </td><td>
548
+
549
+ **_(BETA)_** Config options for the [ClapprStats](./player.clapprstats.md) plugin
550
+
551
+
552
+ </td></tr>
553
+ <tr><td>
554
+
542
555
  [ClipsPluginSettings](./player.clipspluginsettings.md)
543
556
 
544
557
 
@@ -547,6 +560,17 @@ Description
547
560
  **_(BETA)_** Configuration options for the [Clips](./player.clips.md) plugin.
548
561
 
549
562
 
563
+ </td></tr>
564
+ <tr><td>
565
+
566
+ [CmcdConfigOptions](./player.cmcdconfigoptions.md)
567
+
568
+
569
+ </td><td>
570
+
571
+ **_(BETA)_** Config options for the [CmcdConfig](./player.cmcdconfig.md) plugin
572
+
573
+
550
574
  </td></tr>
551
575
  <tr><td>
552
576
 
@@ -613,6 +637,17 @@ Configuration options for the player
613
637
  Describes a media source with its MIME type and URL.
614
638
 
615
639
 
640
+ </td></tr>
641
+ <tr><td>
642
+
643
+ [PosterPluginSettings](./player.posterpluginsettings.md)
644
+
645
+
646
+ </td><td>
647
+
648
+ **_(BETA)_** Config options for the [Poster](./player.poster.md) plugin
649
+
650
+
616
651
  </td></tr>
617
652
  <tr><td>
618
653
 
@@ -727,15 +762,6 @@ Description
727
762
  **_(BETA)_**
728
763
 
729
764
 
730
- </td></tr>
731
- <tr><td>
732
-
733
- [ClapprStatsSettings](./player.clapprstatssettings.md)
734
-
735
-
736
- </td><td>
737
-
738
-
739
765
  </td></tr>
740
766
  <tr><td>
741
767
 
@@ -747,17 +773,6 @@ Description
747
773
  **_(BETA)_** Configuration options for the [ClosedCaptions](./player.closedcaptions.md) plugin.
748
774
 
749
775
 
750
- </td></tr>
751
- <tr><td>
752
-
753
- [CmcdConfigPluginSettings](./player.cmcdconfigpluginsettings.md)
754
-
755
-
756
- </td><td>
757
-
758
- **_(BETA)_**
759
-
760
-
761
776
  </td></tr>
762
777
  <tr><td>
763
778
 
@@ -1038,15 +1053,6 @@ A media source to fetch the media data from
1038
1053
 
1039
1054
 
1040
1055
 
1041
- </td></tr>
1042
- <tr><td>
1043
-
1044
- [PosterPluginSettings](./player.posterpluginsettings.md)
1045
-
1046
-
1047
- </td><td>
1048
-
1049
-
1050
1056
  </td></tr>
1051
1057
  <tr><td>
1052
1058
 
@@ -0,0 +1,24 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [MediaControl](./player.mediacontrol.md) &gt; [getAvailableHeight](./player.mediacontrol.getavailableheight.md)
4
+
5
+ ## MediaControl.getAvailableHeight() method
6
+
7
+ > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
+ >
9
+
10
+ **Signature:**
11
+
12
+ ```typescript
13
+ getAvailableHeight(): number;
14
+ ```
15
+ **Returns:**
16
+
17
+ number
18
+
19
+ Vertical space available to render something on top of the container.
20
+
21
+ ## Remarks
22
+
23
+ This takes into account the container height and excludes the height of the controls bar
24
+
@@ -223,6 +223,20 @@ Description
223
223
  **_(BETA)_** Enable the user interaction disabled earlier
224
224
 
225
225
 
226
+ </td></tr>
227
+ <tr><td>
228
+
229
+ [getAvailableHeight()](./player.mediacontrol.getavailableheight.md)
230
+
231
+
232
+ </td><td>
233
+
234
+
235
+ </td><td>
236
+
237
+ **_(BETA)_**
238
+
239
+
226
240
  </td></tr>
227
241
  <tr><td>
228
242
 
@@ -1,15 +1,16 @@
1
1
  <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
2
 
3
- [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [CmcdConfig](./player.cmcdconfig.md) &gt; [name](./player.cmcdconfig.name.md)
3
+ [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [PosterPluginSettings](./player.posterpluginsettings.md) &gt; [custom](./player.posterpluginsettings.custom.md)
4
4
 
5
- ## CmcdConfig.name property
5
+ ## PosterPluginSettings.custom property
6
6
 
7
7
  > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
8
  >
9
9
 
10
+ Custom CSS background
10
11
 
11
12
  **Signature:**
12
13
 
13
14
  ```typescript
14
- get name(): string;
15
+ custom?: string;
15
16
  ```
@@ -2,15 +2,116 @@
2
2
 
3
3
  [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [PosterPluginSettings](./player.posterpluginsettings.md)
4
4
 
5
- ## PosterPluginSettings type
5
+ ## PosterPluginSettings interface
6
+
7
+ > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
+ >
9
+
10
+ Config options for the [Poster](./player.poster.md) plugin
6
11
 
7
12
  **Signature:**
8
13
 
9
14
  ```typescript
10
- export type PosterPluginSettings = {
11
- custom?: string;
12
- showForNoOp?: boolean;
13
- url?: string;
14
- showOnVideoEnd?: boolean;
15
- };
15
+ export interface PosterPluginSettings
16
16
  ```
17
+
18
+ ## Properties
19
+
20
+ <table><thead><tr><th>
21
+
22
+ Property
23
+
24
+
25
+ </th><th>
26
+
27
+ Modifiers
28
+
29
+
30
+ </th><th>
31
+
32
+ Type
33
+
34
+
35
+ </th><th>
36
+
37
+ Description
38
+
39
+
40
+ </th></tr></thead>
41
+ <tbody><tr><td>
42
+
43
+ [custom?](./player.posterpluginsettings.custom.md)
44
+
45
+
46
+ </td><td>
47
+
48
+
49
+ </td><td>
50
+
51
+ string
52
+
53
+
54
+ </td><td>
55
+
56
+ **_(BETA)_** _(Optional)_ Custom CSS background
57
+
58
+
59
+ </td></tr>
60
+ <tr><td>
61
+
62
+ [showForNoOp?](./player.posterpluginsettings.showfornoop.md)
63
+
64
+
65
+ </td><td>
66
+
67
+
68
+ </td><td>
69
+
70
+ boolean
71
+
72
+
73
+ </td><td>
74
+
75
+ **_(BETA)_** _(Optional)_ Whether to show the poster image when the playback is noop (i.e., when there is no appropriate video playback engine for current media sources set or the media sources are not set at all)
76
+
77
+
78
+ </td></tr>
79
+ <tr><td>
80
+
81
+ [showOnVideoEnd?](./player.posterpluginsettings.showonvideoend.md)
82
+
83
+
84
+ </td><td>
85
+
86
+
87
+ </td><td>
88
+
89
+ boolean
90
+
91
+
92
+ </td><td>
93
+
94
+ **_(BETA)_** _(Optional)_ Whether to show the poster after playback has ended, by default `true`
95
+
96
+
97
+ </td></tr>
98
+ <tr><td>
99
+
100
+ [url?](./player.posterpluginsettings.url.md)
101
+
102
+
103
+ </td><td>
104
+
105
+
106
+ </td><td>
107
+
108
+ string
109
+
110
+
111
+ </td><td>
112
+
113
+ **_(BETA)_** _(Optional)_ Poster image URL
114
+
115
+
116
+ </td></tr>
117
+ </tbody></table>
@@ -0,0 +1,16 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [PosterPluginSettings](./player.posterpluginsettings.md) &gt; [showForNoOp](./player.posterpluginsettings.showfornoop.md)
4
+
5
+ ## PosterPluginSettings.showForNoOp property
6
+
7
+ > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
+ >
9
+
10
+ Whether to show the poster image when the playback is noop (i.e., when there is no appropriate video playback engine for current media sources set or the media sources are not set at all)
11
+
12
+ **Signature:**
13
+
14
+ ```typescript
15
+ showForNoOp?: boolean;
16
+ ```
@@ -0,0 +1,16 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [PosterPluginSettings](./player.posterpluginsettings.md) &gt; [showOnVideoEnd](./player.posterpluginsettings.showonvideoend.md)
4
+
5
+ ## PosterPluginSettings.showOnVideoEnd property
6
+
7
+ > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
+ >
9
+
10
+ Whether to show the poster after playback has ended, by default `true`
11
+
12
+ **Signature:**
13
+
14
+ ```typescript
15
+ showOnVideoEnd?: boolean;
16
+ ```
@@ -1,19 +1,16 @@
1
1
  <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
2
 
3
- [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [CmcdConfig](./player.cmcdconfig.md) &gt; [bindEvents](./player.cmcdconfig.bindevents.md)
3
+ [Home](./index.md) &gt; [@gcorevideo/player](./player.md) &gt; [PosterPluginSettings](./player.posterpluginsettings.md) &gt; [url](./player.posterpluginsettings.url.md)
4
4
 
5
- ## CmcdConfig.bindEvents() method
5
+ ## PosterPluginSettings.url property
6
6
 
7
7
  > This API is provided as a beta preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
8
8
  >
9
9
 
10
+ Poster image URL
10
11
 
11
12
  **Signature:**
12
13
 
13
14
  ```typescript
14
- bindEvents(): void;
15
+ url?: string;
15
16
  ```
16
- **Returns:**
17
-
18
- void
19
-
@@ -1,15 +1,19 @@
1
1
  import { UICorePlugin } from '@clappr/core';
2
2
  import '../../../assets/big-mute-button/big-mute-button.scss';
3
3
  /**
4
- * `PLUGIN` that displays a big mute button over the video when it's muted.
5
- * Once pressed, it unmutes the video.
4
+ * `PLUGIN` that displays a big mute button over the video when it's being played muted.
6
5
  * @beta
6
+ * @remarks
7
+ * When pressed, it unmutes the video.
8
+ * @example
9
+ * ```ts
10
+ * import { BigMuteButton } from '@gcorevideo/player'
11
+ * Player.registerPlugin(BigMuteButton)
12
+ * ```
7
13
  */
8
14
  export declare class BigMuteButton extends UICorePlugin {
9
- private isBigMuteButtonHidden;
15
+ private hidden;
10
16
  private _adIsPlaying;
11
- private $bigMuteBtnContainer;
12
- private $bigMuteButton;
13
17
  /**
14
18
  * @internal
15
19
  */
@@ -25,28 +29,26 @@ export declare class BigMuteButton extends UICorePlugin {
25
29
  * @internal
26
30
  */
27
31
  get events(): {
28
- 'click .big-mute-icon': string;
29
- 'click .big-mute-icon-wrapper': string;
32
+ click: string;
30
33
  };
31
34
  /**
32
35
  * @internal
33
36
  */
34
37
  bindEvents(): void;
35
38
  private onCoreReady;
39
+ private onContainerChanged;
40
+ private onPlay;
36
41
  private onContainerVolume;
37
- private onContainerStart;
38
42
  private onPlaybackEnded;
39
- private mediaControlRendered;
40
43
  private onStartAd;
41
44
  private onFinishAd;
42
- private shouldRender;
43
45
  /**
44
46
  * @internal
45
47
  */
46
48
  render(): this;
47
- private hideBigMuteBtn;
48
- private showBigMuteBtn;
49
- private destroyBigMuteBtn;
49
+ private mount;
50
+ private hide;
51
+ private show;
50
52
  private clicked;
51
53
  }
52
54
  //# sourceMappingURL=BigMuteButton.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BigMuteButton.d.ts","sourceRoot":"","sources":["../../../src/plugins/big-mute-button/BigMuteButton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAS,MAAM,cAAc,CAAA;AAQpE,OAAO,sDAAsD,CAAA;AAM7D;;;;GAIG;AACH,qBAAa,aAAc,SAAQ,YAAY;IAC7C,OAAO,CAAC,qBAAqB,CAAQ;IAErC,OAAO,CAAC,YAAY,CAAQ;IAE5B,OAAO,CAAC,oBAAoB,CAA2B;IAEvD,OAAO,CAAC,cAAc,CAA2B;IAEjD;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAuB;IAEvD;;OAEG;IACH,IAAa,MAAM;;;MAKlB;IAED;;OAEG;IACM,UAAU;IAenB,OAAO,CAAC,WAAW;IAkBnB,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,gBAAgB;IAMxB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,oBAAoB;IAe5B,OAAO,CAAC,SAAS;IAOjB,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,YAAY;IAmBpB;;OAEG;IACM,MAAM;IAuBf,OAAO,CAAC,cAAc;IAKtB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,iBAAiB;IAUzB,OAAO,CAAC,OAAO;CAShB"}
1
+ {"version":3,"file":"BigMuteButton.d.ts","sourceRoot":"","sources":["../../../src/plugins/big-mute-button/BigMuteButton.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAS,MAAM,cAAc,CAAA;AAQpE,OAAO,sDAAsD,CAAA;AAM7D;;;;;;;;;;GAUG;AACH,qBAAa,aAAc,SAAQ,YAAY;IAC7C,OAAO,CAAC,MAAM,CAAQ;IAGtB,OAAO,CAAC,YAAY,CAAQ;IAE5B;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAyB;IAEzD;;OAEG;IACH,IAAa,MAAM;;MAIlB;IAED;;OAEG;IACM,UAAU;IAOnB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,kBAAkB;IAuB1B,OAAO,CAAC,MAAM;IAgBd,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,SAAS;IAKjB,OAAO,CAAC,UAAU;IAKlB;;OAEG;IACM,MAAM;IAWf,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,OAAO;CAkBhB"}
@@ -2,20 +2,25 @@ import { Events, template, UICorePlugin, Utils } from '@clappr/core';
2
2
  import { trace } from '@gcorevideo/utils';
3
3
  import { CLAPPR_VERSION } from '../../build.js';
4
4
  import volumeMuteIcon from '../../../assets/icons/new/volume-off.svg';
5
- import pluginHtml from '../../../assets/big-mute-button/big-mute-button.ejs';
5
+ import templateHtml from '../../../assets/big-mute-button/big-mute-button.ejs';
6
6
  import '../../../assets/big-mute-button/big-mute-button.scss';
7
7
  const T = 'plugins.big_mute_button';
8
8
  // TODO rewrite as a container plugin
9
9
  /**
10
- * `PLUGIN` that displays a big mute button over the video when it's muted.
11
- * Once pressed, it unmutes the video.
10
+ * `PLUGIN` that displays a big mute button over the video when it's being played muted.
12
11
  * @beta
12
+ * @remarks
13
+ * When pressed, it unmutes the video.
14
+ * @example
15
+ * ```ts
16
+ * import { BigMuteButton } from '@gcorevideo/player'
17
+ * Player.registerPlugin(BigMuteButton)
18
+ * ```
13
19
  */
14
20
  export class BigMuteButton extends UICorePlugin {
15
- isBigMuteButtonHidden = false;
21
+ hidden = false;
22
+ // TODO get back to the ads-related logic later
16
23
  _adIsPlaying = false;
17
- $bigMuteBtnContainer = null;
18
- $bigMuteButton = null;
19
24
  /**
20
25
  * @internal
21
26
  */
@@ -28,14 +33,13 @@ export class BigMuteButton extends UICorePlugin {
28
33
  get supportedVersion() {
29
34
  return { min: CLAPPR_VERSION };
30
35
  }
31
- static template = template(pluginHtml);
36
+ static template = template(templateHtml);
32
37
  /**
33
38
  * @internal
34
39
  */
35
40
  get events() {
36
41
  return {
37
- 'click .big-mute-icon': 'clicked',
38
- 'click .big-mute-icon-wrapper': 'destroyBigMuteBtn',
42
+ 'click': 'clicked',
39
43
  };
40
44
  }
41
45
  /**
@@ -43,110 +47,91 @@ export class BigMuteButton extends UICorePlugin {
43
47
  */
44
48
  bindEvents() {
45
49
  this.listenTo(this.core, Events.CORE_READY, this.onCoreReady);
50
+ this.listenTo(this.core, Events.CORE_ACTIVE_CONTAINER_CHANGED, this.onContainerChanged);
46
51
  this.listenTo(this.core, 'core:advertisement:start', this.onStartAd);
47
52
  this.listenTo(this.core, 'core:advertisement:finish', this.onFinishAd);
48
- trace(`${T} bindEvents`, {
49
- mediacontrol: !!this.core.mediaControl,
50
- });
51
- // TOOD use core.getPlugin('media_control')
52
- this.listenTo(this.core.mediaControl, Events.MEDIACONTROL_RENDERED, this.mediaControlRendered);
53
53
  }
54
54
  onCoreReady() {
55
+ }
56
+ onContainerChanged() {
55
57
  this.listenTo(this.core.activeContainer, Events.CONTAINER_VOLUME, this.onContainerVolume);
56
- this.listenTo(this.core.activeContainer, Events.CONTAINER_READY, this.onContainerStart);
58
+ // this.listenTo(
59
+ // this.core.activeContainer,
60
+ // Events.CONTAINER_READY,
61
+ // this.onContainerReady,
62
+ // )
57
63
  this.listenTo(this.core.activePlayback, Events.PLAYBACK_ENDED, this.onPlaybackEnded);
64
+ this.listenTo(this.core.activeContainer, Events.CONTAINER_PLAY, this.onPlay);
58
65
  }
59
- onContainerVolume(value) {
60
- if (value !== 0) {
61
- this.destroyBigMuteBtn();
66
+ onPlay(_, { autoPlay }) {
67
+ const container = this.core.activeContainer;
68
+ const { volume } = container;
69
+ const { wasMuted } = this.options;
70
+ trace(`${T} onPlay`, {
71
+ autoPlay,
72
+ wasMuted,
73
+ volume,
74
+ });
75
+ if (autoPlay && !wasMuted && volume === 0) {
76
+ this.mount();
77
+ }
78
+ else {
79
+ this.destroy();
62
80
  }
63
81
  }
64
- onContainerStart() {
65
- if (this.isBigMuteButtonHidden) {
66
- this.showBigMuteBtn();
82
+ onContainerVolume(value) {
83
+ if (value !== 0) {
84
+ this.destroy();
67
85
  }
68
86
  }
69
87
  onPlaybackEnded() {
70
- this.hideBigMuteBtn();
71
- }
72
- mediaControlRendered() {
73
- const container = this.core.activeContainer;
74
- trace(`${T} mediaControlRendered`, {
75
- container: !!container,
76
- });
77
- if (container) {
78
- this.listenTo(container.playback, Events.PLAYBACK_PLAY, () => {
79
- trace(`${T} PLAYBACK_PLAY`);
80
- this.render();
81
- });
82
- }
88
+ this.hide();
83
89
  }
84
90
  onStartAd() {
85
91
  this._adIsPlaying = true;
86
- if (this.$bigMuteBtnContainer) {
87
- this.$bigMuteBtnContainer.addClass('hide');
88
- }
92
+ this.hide();
89
93
  }
90
94
  onFinishAd() {
91
95
  this._adIsPlaying = false;
92
- if (this.$bigMuteBtnContainer) {
93
- this.$bigMuteBtnContainer.removeClass('hide');
94
- }
95
- }
96
- shouldRender() {
97
- const container = this.core.activeContainer;
98
- if (!container) {
99
- return false;
100
- }
101
- const { autoPlay, wasMuted } = this.options;
102
- const volume = container.volume;
103
- trace(`${T} shouldRender`, {
104
- autoPlay,
105
- wasMuted,
106
- volume,
107
- });
108
- return autoPlay && !wasMuted && volume === 0;
96
+ this.show();
109
97
  }
110
98
  /**
111
99
  * @internal
112
100
  */
113
101
  render() {
114
- if (this.shouldRender()) {
115
- trace(`${T} render`, {
116
- el: !!this.$el,
117
- });
118
- this.$el.html(BigMuteButton.template());
119
- this.$bigMuteBtnContainer = this.$el.find('.big-mute-icon-wrapper[data-big-mute]');
120
- this._adIsPlaying && this.$bigMuteBtnContainer.addClass('hide');
121
- this.$bigMuteButton = this.$bigMuteBtnContainer.find('.big-mute-icon');
122
- this.$bigMuteButton.append(volumeMuteIcon);
123
- const container = this.core.activeContainer;
124
- container.$el.append(this.$el.get(0));
125
- }
102
+ trace(`${T} render`);
103
+ this.$el.html(BigMuteButton.template());
104
+ this.$el.find('#gplayer-big-mute-icon').append(volumeMuteIcon);
105
+ // TODO
106
+ // this._adIsPlaying && this.hide()
126
107
  return this;
127
108
  }
128
- hideBigMuteBtn() {
129
- this.isBigMuteButtonHidden = true;
130
- this.$bigMuteBtnContainer?.addClass('hide');
109
+ mount() {
110
+ this.core.activeContainer.$el.append(this.$el);
111
+ this.show();
131
112
  }
132
- showBigMuteBtn() {
133
- this.isBigMuteButtonHidden = false;
134
- if (this.$bigMuteBtnContainer) {
135
- this.$bigMuteBtnContainer.removeClass('hide');
136
- }
113
+ hide() {
114
+ this.hidden = true;
115
+ this.$el.find('#gplayer-big-mute-button')?.addClass('hide');
137
116
  }
138
- destroyBigMuteBtn(e) {
139
- this.hideBigMuteBtn();
140
- if (e && e.stopPropagation) {
141
- e.stopPropagation();
142
- }
143
- this.destroy();
117
+ show() {
118
+ this.hidden = false;
119
+ this.$el.find('#gplayer-big-mute-button')?.removeClass('hide');
144
120
  }
145
121
  clicked(e) {
122
+ trace(`${T} clicked`);
123
+ const mediaControl = this.core.getPlugin('media_control');
124
+ // TODO delegate to media_control plugin
146
125
  const localVolume = Utils.Config.restore('volume');
147
126
  const volume = !isNaN(localVolume) ? localVolume : 100;
148
- // TODO use container.setVolume() instead
149
- this.core.mediaControl.setVolume(volume === 0 ? 100 : volume);
150
- this.destroyBigMuteBtn(e);
127
+ const unmuted = volume === 0 ? 100 : volume;
128
+ if (mediaControl) {
129
+ mediaControl.setVolume(unmuted);
130
+ }
131
+ else {
132
+ this.core.activeContainer.setVolume(unmuted);
133
+ }
134
+ e.stopPropagation?.();
135
+ this.destroy();
151
136
  }
152
137
  }
@@ -156,5 +156,6 @@ export declare class BottomGear extends UICorePlugin {
156
156
  private onCoreReady;
157
157
  private onMediaControlRendered;
158
158
  private mount;
159
+ private alignSubmenu;
159
160
  }
160
161
  //# sourceMappingURL=BottomGear.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"BottomGear.d.ts","sourceRoot":"","sources":["../../../src/plugins/bottom-gear/BottomGear.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAkD,MAAM,cAAc,CAAA;AAO3F,OAAO,uCAAuC,CAAA;AAC9C,OAAO,gDAAgD,CAAA;AAGvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAO5C;;;GAGG;AACH,oBAAY,UAAU;IACpB;;OAEG;IACH,QAAQ,aAAa;CACtB;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,qBAAa,UAAW,SAAQ,YAAY;IAC1C,OAAO,CAAC,EAAE,CAAQ;IAElB,OAAO,CAAC,QAAQ,CAAK;IAErB,OAAO,CAAC,SAAS,CAAQ;IAEzB;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAuB;IAEvD;;OAEG;IACH,IAAa,UAAU;;MAItB;IAED;;OAEG;IACH,IAAa,MAAM;;MAIlB;IAED;;OAEG;IACM,UAAU;IAInB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,GAAG,WAAW;IA6B1D,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,oBAAoB;IAM5B;;OAEG;IACM,MAAM;IAsBf;;;;OAIG;IACH,OAAO;IAIP,OAAO,CAAC,gBAAgB;IAKxB,OAAO,CAAC,UAAU;IAclB,OAAO,CAAC,QAAQ;IAShB,OAAO,CAAC,WAAW;IAyBnB,OAAO,CAAC,sBAAsB;IAK9B,OAAO,CAAC,KAAK;CAOd"}
1
+ {"version":3,"file":"BottomGear.d.ts","sourceRoot":"","sources":["../../../src/plugins/bottom-gear/BottomGear.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EAKb,MAAM,cAAc,CAAA;AAOrB,OAAO,uCAAuC,CAAA;AAC9C,OAAO,gDAAgD,CAAA;AAGvD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAU5C;;;GAGG;AACH,oBAAY,UAAU;IACpB;;OAEG;IACH,QAAQ,aAAa;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,qBAAa,UAAW,SAAQ,YAAY;IAC1C,OAAO,CAAC,EAAE,CAAQ;IAElB,OAAO,CAAC,QAAQ,CAAI;IAEpB,OAAO,CAAC,SAAS,CAAO;IAExB;;OAEG;IACH,IAAI,IAAI,WAEP;IAED;;OAEG;IACH,IAAI,gBAAgB;;MAEnB;IAED;;OAEG;IACH,MAAM,KAAK,OAAO,WAEjB;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAuB;IAEvD;;OAEG;IACH,IAAa,UAAU;;MAItB;IAED;;OAEG;IACH,IAAa,MAAM;;MAIlB;IAED;;OAEG;IACM,UAAU;IAInB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,WAAW,GAAG,WAAW;IA2B1D,OAAO,CAAC,mBAAmB;IAW3B,OAAO,CAAC,oBAAoB;IAM5B;;OAEG;IACM,MAAM;IAqBf;;;;OAIG;IACH,OAAO;IAIP,OAAO,CAAC,gBAAgB;IAKxB,OAAO,CAAC,UAAU;IAelB,OAAO,CAAC,QAAQ;IAQhB,OAAO,CAAC,WAAW;IA4BnB,OAAO,CAAC,sBAAsB;IAI9B,OAAO,CAAC,KAAK;IAKb,OAAO,CAAC,YAAY;CASrB"}