@gcorevideo/player 2.21.4 → 2.22.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.
Files changed (29) hide show
  1. package/assets/dvr-controls/dvr_controls.scss +7 -25
  2. package/assets/dvr-controls/index.ejs +2 -2
  3. package/assets/media-control/media-control.ejs +1 -1
  4. package/assets/media-control/media-control.scss +8 -3
  5. package/assets/media-control/width370.scss +1 -1
  6. package/assets/style/theme.scss +1 -1
  7. package/dist/core.js +1 -1
  8. package/dist/index.css +1441 -1446
  9. package/dist/index.js +82 -79
  10. package/dist/plugins/index.css +1189 -1194
  11. package/dist/plugins/index.js +81 -76
  12. package/lib/plugins/dvr-controls/DvrControls.d.ts +0 -3
  13. package/lib/plugins/dvr-controls/DvrControls.d.ts.map +1 -1
  14. package/lib/plugins/dvr-controls/DvrControls.js +13 -38
  15. package/lib/plugins/media-control/MediaControl.d.ts +10 -14
  16. package/lib/plugins/media-control/MediaControl.d.ts.map +1 -1
  17. package/lib/plugins/media-control/MediaControl.js +66 -38
  18. package/lib/testUtils.d.ts +4 -1
  19. package/lib/testUtils.d.ts.map +1 -1
  20. package/lib/testUtils.js +10 -11
  21. package/package.json +1 -1
  22. package/src/plugins/dvr-controls/DvrControls.ts +16 -44
  23. package/src/plugins/dvr-controls/__tests__/DvrControls.test.ts +23 -25
  24. package/src/plugins/dvr-controls/__tests__/__snapshots__/DvrControls.test.ts.snap +8 -32
  25. package/src/plugins/media-control/MediaControl.ts +91 -51
  26. package/src/plugins/media-control/__tests__/MediaControl.test.ts +89 -0
  27. package/src/plugins/media-control/__tests__/__snapshots__/MediaControl.test.ts.snap +128 -0
  28. package/src/testUtils.ts +10 -11
  29. package/tsconfig.tsbuildinfo +1 -1
package/assets/dvr-controls/dvr_controls.scss CHANGED
@@ -1,15 +1,11 @@
1
- $live-color: #ff0101;
2
- $dvr-color: #fff;
3
- $vod-color: #005aff;
4
1
  $disabled-opacity: 0.3;
5
2
  $control-height: 32px;
6
3
  $circle-radius: 3.5px;
7
4
  $bottom-panel: 40px;
8
5
 
9
- .dvr-controls[data-dvr-controls] {
6
+ .dvr-controls[data-dvr] {
10
7
  display: inline-block;
11
- float: left;
12
- color: $dvr-color;
8
+ color: var(--player-dvr-color);
13
9
  line-height: 32px;
14
10
  font-size: 10px;
15
11
  font-weight: bold;
@@ -17,7 +13,6 @@ $bottom-panel: 40px;
17
13
 
18
14
  .live-info {
19
15
  cursor: default;
20
- font-family: "Roboto", "Open Sans", Arial, sans-serif;
21
16
  text-transform: uppercase;
22
17
 
23
18
  &:before {
@@ -28,14 +23,14 @@ $bottom-panel: 40px;
28
23
  height: $circle-radius*2;
29
24
  border-radius: $circle-radius;
30
25
  margin-right: $circle-radius;
31
- background-color: $live-color;
26
+ background-color: var(--player-live-color);
32
27
  }
33
28
 
34
29
  &.disabled {
35
30
  opacity: $disabled-opacity;
36
31
 
37
32
  &:before {
38
- background-color: $dvr-color;
33
+ background-color: var(--player-dvr-color);
39
34
  }
40
35
  }
41
36
  }
@@ -45,12 +40,11 @@ $bottom-panel: 40px;
45
40
  outline: none;
46
41
  display: none;
47
42
  border: 0;
48
- color: $dvr-color;
43
+ color: var(--player-dvr-color);
49
44
  background-color: transparent;
50
45
  height: 32px;
51
46
  padding: 0;
52
47
  opacity: 0.7;
53
- font-family: "Roboto", "Open Sans", Arial, sans-serif;
54
48
  text-transform: uppercase;
55
49
  transition: all 0.1s ease;
56
50
 
@@ -62,7 +56,7 @@ $bottom-panel: 40px;
62
56
  height: $circle-radius*2;
63
57
  border-radius: $circle-radius;
64
58
  margin-right: $circle-radius;
65
- background-color: $dvr-color;
59
+ background-color: var(--player-dvr-color);
66
60
  }
67
61
 
68
62
  &:hover {
@@ -110,7 +104,7 @@ $bottom-panel: 40px;
110
104
  }
111
105
 
112
106
  .dvr {
113
- .dvr-controls[data-dvr-controls] {
107
+ .dvr-controls[data-dvr] {
114
108
  .live-info {
115
109
  display: none;
116
110
  }
@@ -119,16 +113,4 @@ $bottom-panel: 40px;
119
113
  display: block;
120
114
  }
121
115
  }
122
-
123
- &.media-control.live[data-media-control] {
124
- .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {
125
- background-color: $vod-color;
126
- }
127
- }
128
- }
129
-
130
- .media-control.live[data-media-control] {
131
- .media-control-layer[data-controls] .bar-container[data-seekbar] .bar-background[data-seekbar] .bar-fill-2[data-seekbar] {
132
- background-color: $live-color;
133
- }
134
116
  }
package/assets/dvr-controls/index.ejs CHANGED
@@ -1,2 +1,2 @@
1
- <div class="live-info"><%= live %></div>
2
- <button type="button" class="live-button" aria-label="<%= backToLive %>"><%= backToLive %></button>
1
+ <div class="live-info" id="media-control-live"><%= i18n.t('live') %></div>
2
+ <button type="button" class="live-button" aria-label="<%= i18n.t('back_to_live') %>" id="media-control-back-to-live"><%= i18n.t('back_to_live') %></button>
package/assets/media-control/media-control.ejs CHANGED
@@ -85,7 +85,7 @@
85
85
  renderVR(setting)
86
86
  } else if (setting === "clipsText") {
87
87
  renderClipsText(setting)
88
- } else if (setting === "fullscreen") {
88
+ } else if (["playpause", "playstop", "fullscreen"].includes(setting)) {
89
89
  renderButton(setting);
90
90
  }
91
91
  });
package/assets/media-control/media-control.scss CHANGED
@@ -6,6 +6,11 @@
6
6
  :root {
7
7
  --font-size-media-controls: 14px;
8
8
  --font-size-media-controls-dropdown: 16px;
9
+ --player-vod-color: #005aff;
10
+ --player-dvr-color: #fff;
11
+ --player-live-color: #ff0101;
12
+ --player-seekbar-current-color: #ff5700;
13
+ --player-seekbar-buffer-color: #fff;
9
14
  }
10
15
 
11
16
  .media-control-skin-1[data-media-control-skin-1] {
@@ -221,7 +226,7 @@
221
226
  left: 0;
222
227
  width: 0;
223
228
  height: 100%;
224
- background-color: white;
229
+ background-color: var(--player-seekbar-buffer-color);
225
230
  transition: all 0.1s ease-out;
226
231
  }
227
232
 
@@ -231,7 +236,7 @@
231
236
  left: 0;
232
237
  width: 0;
233
238
  height: 100%;
234
- background-color: #ff5700;
239
+ background-color: var(--player-seekbar-current-color);
235
240
  transition: all 0.1s ease-out;
236
241
  }
237
242
  }
@@ -335,7 +340,7 @@
335
340
  left: 0;
336
341
  width: 0;
337
342
  height: 100%;
338
- background-color: #005aff;
343
+ background-color: var(--player-vod-color);
339
344
  transition: all 0.1s ease-out;
340
345
  }
341
346
  }
package/assets/media-control/width370.scss CHANGED
@@ -99,7 +99,7 @@
99
99
  }
100
100
  }
101
101
 
102
- .dvr-controls[data-dvr-controls] {
102
+ .dvr-controls[data-dvr] {
103
103
  height: 32px;
104
104
 
105
105
  .live-button {
package/assets/style/theme.scss CHANGED
@@ -29,7 +29,7 @@
29
29
  }
30
30
  }
31
31
 
32
- .gcore-skin-main-color { background-color: var(--theme-foreground-color) !important; }
32
+ .gcore-skin-main-color { background-color: var(--theme-foreground-color) }
33
33
  .gcore-skin-border-color { border-color: var(--theme-foreground-color) !important; }
34
34
 
35
35
  .gcore-skin-button-color:hover { color: var(--theme-hover-color) !important; }
package/dist/core.js CHANGED
@@ -43214,7 +43214,7 @@ class Player {
43214
43214
  }
43215
43215
  }
43216
43216
 
43217
- var version$1 = "2.21.4";
43217
+ var version$1 = "2.22.0";
43218
43218
 
43219
43219
  var packages = {
43220
43220
  "node_modules/@clappr/core": {