eb-player 2.0.15 → 2.0.18

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 (44) hide show
  1. package/dist/build/eb-player.css +516 -58
  2. package/dist/build/ebplayer.bundle.js +309 -112
  3. package/dist/build/ebplayer.bundle.js.map +1 -1
  4. package/dist/build/theme-forja.css +409 -4
  5. package/dist/build/theme-lequipe.css +7 -14
  6. package/dist/build/theme-modern.css +6 -9
  7. package/dist/build/theme-radio.css +4 -1
  8. package/dist/build/theme-snrt.css +4 -1
  9. package/dist/build/theme-v2.css +50 -22
  10. package/dist/build/types/core/command-handler.d.ts +1 -0
  11. package/dist/build/types/core/command-handler.d.ts.map +1 -1
  12. package/dist/build/types/core/config.d.ts +2 -1
  13. package/dist/build/types/core/config.d.ts.map +1 -1
  14. package/dist/build/types/core/event-bus.d.ts +1 -0
  15. package/dist/build/types/core/event-bus.d.ts.map +1 -1
  16. package/dist/build/types/core/fsm.d.ts +4 -1
  17. package/dist/build/types/core/fsm.d.ts.map +1 -1
  18. package/dist/build/types/core/i18n.d.ts.map +1 -1
  19. package/dist/build/types/core/lifecycle.d.ts.map +1 -1
  20. package/dist/build/types/core/player-state.d.ts.map +1 -1
  21. package/dist/build/types/eb-player.d.ts +23 -10
  22. package/dist/build/types/eb-player.d.ts.map +1 -1
  23. package/dist/build/types/engines/base-engine.d.ts.map +1 -1
  24. package/dist/build/types/engines/hls.d.ts.map +1 -1
  25. package/dist/build/types/integrations/p2p-manager.d.ts +9 -0
  26. package/dist/build/types/integrations/p2p-manager.d.ts.map +1 -1
  27. package/dist/build/types/skin/brand/forja-playlist-bar.d.ts.map +1 -1
  28. package/dist/build/types/skin/component-registry.d.ts.map +1 -1
  29. package/dist/build/types/skin/controls/channel-name.d.ts +16 -0
  30. package/dist/build/types/skin/controls/channel-name.d.ts.map +1 -0
  31. package/dist/build/types/skin/controls/play-pause-button.d.ts.map +1 -1
  32. package/dist/build/types/skin/controls/settings-panel.d.ts.map +1 -1
  33. package/dist/build/types/skin/controls/time-display.d.ts.map +1 -1
  34. package/dist/build/types/skin/overlays/loading-spinner.d.ts +1 -1
  35. package/dist/build/types/skin/overlays/loading-spinner.d.ts.map +1 -1
  36. package/dist/build/types/skin/skin-root.d.ts.map +1 -1
  37. package/dist/eb-player.css +516 -58
  38. package/dist/theme-forja.css +409 -4
  39. package/dist/theme-lequipe.css +7 -14
  40. package/dist/theme-modern.css +6 -9
  41. package/dist/theme-radio.css +4 -1
  42. package/dist/theme-snrt.css +4 -1
  43. package/dist/theme-v2.css +50 -22
  44. package/package.json +4 -2
@@ -1,10 +1,415 @@
1
1
  /**
2
- * Forja theme overrides
2
+ * Forja theme
3
3
  *
4
- * Applied when the container has [data-theme="forja"].
5
- * Uses higher specificity than base.css .eb-player selector.
4
+ * Applied when [data-theme="forja"].
5
+ * Black background, red accent, flat transport buttons,
6
+ * two-row bottom bar: seekbar + live label on row 1,
7
+ * play-pause + volume on the left / settings + pip + fullscreen on the right on row 2.
6
8
  */
7
9
 
8
- [data-theme="forja"] .eb-player {
10
+ /* ============================================================
11
+ Root vars & container
12
+ ============================================================ */
13
+ [data-theme="forja"] {
9
14
  --eb-color-primary: #FC013B;
15
+ --eb-color-progress: #FC013B;
16
+ --eb-accent: #FC013B;
17
+ }
18
+
19
+ [data-theme="forja"] .eb-player {
20
+ --eb-color-background: #000;
21
+ --eb-color-text: #fff;
22
+ --eb-font-size-base: 14px;
23
+ font-family: Arial, sans-serif;
24
+ color: #fff;
25
+ }
26
+
27
+ /* ============================================================
28
+ Top bar: hidden (no top-bar items in forja layout)
29
+ ============================================================ */
30
+ [data-theme="forja"] .eb-player .eb-top-bar {
31
+ display: none;
32
+ }
33
+
34
+ /* ============================================================
35
+ Bottom bar gradient
36
+ ============================================================ */
37
+ [data-theme="forja"] .eb-player .eb-bottom-bar__gradient {
38
+ height: 100px;
39
+ background: linear-gradient(to top, rgba(0,0,0,.85), transparent);
40
+ }
41
+
42
+ /* ============================================================
43
+ Bottom bar: two-row layout
44
+ Row 1: seekbar (flex:1) | live-sync label (right)
45
+ Row 2: play-pause + volume (left) | settings + pip + fullscreen (right)
46
+ ============================================================ */
47
+ [data-theme="forja"] .eb-player .eb-bottom-bar__controls-row {
48
+ flex-wrap: wrap;
49
+ align-items: center;
50
+ padding: 0 12px 10px;
51
+ gap: 6px;
52
+ row-gap: 4px;
53
+ }
54
+
55
+ /* Row 1: seekbar spans full width */
56
+ [data-theme="forja"] .eb-player .eb-bottom-bar__seekbar-zone {
57
+ order: -1;
58
+ flex: 1;
59
+ min-width: 0;
60
+ }
61
+
62
+ /* Invisible flex break between row 1 and row 2 */
63
+ [data-theme="forja"] .eb-player .eb-bottom-bar__controls-row::after {
64
+ content: '';
65
+ width: 100%;
66
+ height: 0;
67
+ order: 0;
68
+ flex-shrink: 0;
69
+ }
70
+
71
+ /* Row 2: play-pause + volume on the left */
72
+ [data-theme="forja"] .eb-player .eb-slot-play-pause,
73
+ [data-theme="forja"] .eb-player .eb-slot-volume {
74
+ order: 1;
75
+ }
76
+
77
+ /* Row 2: live-sync pushed to the right */
78
+ [data-theme="forja"] .eb-player .eb-slot-live-sync {
79
+ order: 1;
80
+ margin-left: auto;
81
+ }
82
+
83
+ [data-theme="forja"] .eb-player .eb-slot-settings,
84
+ [data-theme="forja"] .eb-player .eb-slot-pip,
85
+ [data-theme="forja"] .eb-player .eb-slot-fullscreen {
86
+ order: 1;
87
+ }
88
+
89
+ /* ============================================================
90
+ Controls visibility transitions
91
+ ============================================================ */
92
+ [data-theme="forja"] .eb-player.eb-controls-visible .eb-bottom-bar,
93
+ [data-theme="forja"] .eb-player.eb-controls-visible .eb-middle-bar {
94
+ opacity: 1;
95
+ transition: opacity .25s;
96
+ }
97
+
98
+ [data-theme="forja"] .eb-player.eb-controls-hidden .eb-bottom-bar,
99
+ [data-theme="forja"] .eb-player.eb-controls-hidden .eb-middle-bar {
100
+ opacity: 0;
101
+ transition: opacity .25s;
102
+ }
103
+
104
+ /* ============================================================
105
+ Middle bar: flat grey transport (no circles)
106
+ ============================================================ */
107
+ [data-theme="forja"] .eb-player .eb-middle-bar {
108
+ gap: 24px;
109
+ }
110
+
111
+ [data-theme="forja"] .eb-player .eb-middle-bar__play-btn {
112
+ width: 72px;
113
+ height: 72px;
114
+ border-radius: 0;
115
+ background: transparent;
116
+ border: none;
117
+ color: rgba(255,255,255,.7);
118
+ padding: 0;
119
+ transition: color .15s, transform .15s;
120
+ }
121
+
122
+ [data-theme="forja"] .eb-player .eb-middle-bar__play-btn:hover {
123
+ color: rgba(255,255,255,.95);
124
+ }
125
+
126
+ [data-theme="forja"] .eb-player .eb-middle-bar__play-btn:active {
127
+ transform: scale(.9);
128
+ }
129
+
130
+ [data-theme="forja"] .eb-player .eb-middle-bar__play-btn .eb-icon {
131
+ width: 52px;
132
+ height: 52px;
133
+ fill: currentColor;
134
+ stroke: none;
135
+ }
136
+
137
+ [data-theme="forja"] .eb-player .eb-middle-bar__seek-btn {
138
+ width: 52px;
139
+ height: 52px;
140
+ border-radius: 0;
141
+ background: transparent;
142
+ border: none;
143
+ color: rgba(255,255,255,.65);
144
+ display: flex;
145
+ flex-direction: column;
146
+ align-items: center;
147
+ justify-content: center;
148
+ gap: 1px;
149
+ padding: 0;
150
+ transition: color .15s, transform .15s;
151
+ }
152
+
153
+ [data-theme="forja"] .eb-player .eb-middle-bar__seek-btn:hover {
154
+ color: rgba(255,255,255,.9);
155
+ }
156
+
157
+ [data-theme="forja"] .eb-player .eb-middle-bar__seek-btn:active {
158
+ transform: scale(.9);
159
+ }
160
+
161
+ [data-theme="forja"] .eb-player .eb-seek-circle {
162
+ width: 28px;
163
+ height: 28px;
164
+ fill: currentColor;
165
+ stroke: none;
166
+ }
167
+
168
+ [data-theme="forja"] .eb-player .eb-seek-label {
169
+ font-size: .7em;
170
+ font-weight: 700;
171
+ line-height: 1;
172
+ }
173
+
174
+ /* ============================================================
175
+ Bottom-bar control buttons: flat icon style
176
+ ============================================================ */
177
+ [data-theme="forja"] .eb-player .eb-play-pause,
178
+ [data-theme="forja"] .eb-player .eb-fullscreen,
179
+ [data-theme="forja"] .eb-player .eb-pip,
180
+ [data-theme="forja"] .eb-player .eb-settings-btn,
181
+ [data-theme="forja"] .eb-player .eb-volume-mute {
182
+ color: rgba(255,255,255,.88);
183
+ background: transparent;
184
+ border: none;
185
+ border-radius: 2px;
186
+ width: 36px;
187
+ height: 36px;
188
+ transition: color .15s;
189
+ flex-shrink: 0;
190
+ }
191
+
192
+ [data-theme="forja"] .eb-player .eb-play-pause:hover,
193
+ [data-theme="forja"] .eb-player .eb-fullscreen:hover,
194
+ [data-theme="forja"] .eb-player .eb-pip:hover,
195
+ [data-theme="forja"] .eb-player .eb-settings-btn:hover,
196
+ [data-theme="forja"] .eb-player .eb-volume-mute:hover {
197
+ color: #fff;
198
+ }
199
+
200
+ [data-theme="forja"] .eb-player .eb-play-pause .eb-icon,
201
+ [data-theme="forja"] .eb-player .eb-fullscreen .eb-icon,
202
+ [data-theme="forja"] .eb-player .eb-pip .eb-icon,
203
+ [data-theme="forja"] .eb-player .eb-settings-btn .eb-icon,
204
+ [data-theme="forja"] .eb-player .eb-volume-mute .eb-icon {
205
+ width: 22px;
206
+ height: 22px;
207
+ }
208
+
209
+ [data-theme="forja"] .eb-player .eb-play-pause .eb-icon {
210
+ fill: currentColor;
211
+ stroke: none;
212
+ }
213
+
214
+ /* ============================================================
215
+ Seekbar: thin red track
216
+ ============================================================ */
217
+ [data-theme="forja"] .eb-player .eb-seekbar-track {
218
+ height: 3px;
219
+ background: rgba(255,255,255,.25);
220
+ border-radius: 0;
221
+ transition: height .15s;
222
+ }
223
+
224
+ [data-theme="forja"] .eb-player .eb-seekbar:hover .eb-seekbar-track {
225
+ height: 5px;
226
+ }
227
+
228
+ [data-theme="forja"] .eb-player .eb-seekbar-buffered {
229
+ background: rgba(255,255,255,.3);
230
+ border-radius: 0;
231
+ }
232
+
233
+ [data-theme="forja"] .eb-player .eb-seekbar-progress {
234
+ background: var(--eb-color-progress, var(--eb-color-primary, #FC013B));
235
+ border-radius: 0;
236
+ }
237
+
238
+ [data-theme="forja"] .eb-player .eb-seekbar-thumb {
239
+ width: 12px;
240
+ height: 12px;
241
+ right: -6px;
242
+ background: #FC013B;
243
+ box-shadow: none;
244
+ border-radius: 50%;
245
+ }
246
+
247
+ /* ============================================================
248
+ Volume: always-visible inline slider
249
+ ============================================================ */
250
+ [data-theme="forja"] .eb-player .eb-volume-control {
251
+ flex-direction: row;
252
+ gap: 0;
253
+ }
254
+
255
+ [data-theme="forja"] .eb-player .eb-volume-track {
256
+ width: 72px;
257
+ height: 3px;
258
+ background: rgba(255,255,255,.25);
259
+ border-radius: 0;
260
+ overflow: visible;
261
+ margin: 0 4px 0 2px;
262
+ transition: height .15s;
263
+ }
264
+
265
+ [data-theme="forja"] .eb-player .eb-volume-control:hover .eb-volume-track {
266
+ height: 4px;
267
+ }
268
+
269
+ [data-theme="forja"] .eb-player .eb-volume-fill {
270
+ background: #FC013B;
271
+ border-radius: 0;
272
+ }
273
+
274
+ [data-theme="forja"] .eb-player .eb-volume-thumb {
275
+ width: 11px;
276
+ height: 11px;
277
+ background: #fff;
278
+ box-shadow: none;
279
+ transform: translate(-50%, -50%) scale(0);
280
+ transition: transform .15s;
281
+ }
282
+
283
+ [data-theme="forja"] .eb-player .eb-volume-control:hover .eb-volume-thumb {
284
+ transform: translate(-50%, -50%) scale(1);
285
+ }
286
+
287
+ /* ============================================================
288
+ Live-sync: red LIVE badge
289
+ ============================================================ */
290
+ [data-theme="forja"] .eb-player .eb-live-sync {
291
+ background: #FC013B;
292
+ color: #fff;
293
+ width: auto;
294
+ height: auto;
295
+ padding: 4px 8px;
296
+ font-size: 12px;
297
+ font-weight: 700;
298
+ letter-spacing: 0.04em;
299
+ text-transform: uppercase;
300
+ border-radius: 3px;
301
+ gap: 0;
302
+ transition: background .15s;
303
+ }
304
+
305
+ [data-theme="forja"] .eb-player .eb-live-sync__icon {
306
+ display: none;
307
+ }
308
+
309
+ [data-theme="forja"] .eb-player .eb-live-sync__dot {
310
+ display: none;
311
+ }
312
+
313
+ [data-theme="forja"] .eb-player .eb-live-sync__label {
314
+ display: block;
315
+ font-size: 12px;
316
+ font-weight: 700;
317
+ letter-spacing: 0.5px;
318
+ line-height: 1;
319
+ }
320
+
321
+ [data-theme="forja"] .eb-player .eb-live-sync:not(.eb-live-synced) {
322
+ background: rgba(120,120,120,.6);
323
+ }
324
+
325
+ [data-theme="forja"] .eb-player .eb-live-sync:hover,
326
+ [data-theme="forja"] .eb-player .eb-live-sync:active {
327
+ background: #c9012f;
328
+ }
329
+
330
+ [data-theme="forja"] .eb-player .eb-live-sync:not(.eb-live-synced):hover {
331
+ background: rgba(150,150,150,.7);
332
+ }
333
+
334
+ /* ============================================================
335
+ Settings panel
336
+ ============================================================ */
337
+ [data-theme="forja"] .eb-player .eb-settings-panel {
338
+ background: rgba(20, 20, 20, .95);
339
+ border-radius: 4px;
340
+ min-width: 240px;
341
+ box-shadow: 0 4px 24px rgba(0,0,0,.7);
342
+ }
343
+
344
+ [data-theme="forja"] .eb-player .eb-settings-category,
345
+ [data-theme="forja"] .eb-player .eb-settings-item,
346
+ [data-theme="forja"] .eb-player .eb-settings-back {
347
+ padding: 13px 16px;
348
+ font-size: 13px;
349
+ color: rgba(255,255,255,.85);
350
+ border-bottom: 1px solid rgba(255,255,255,.07);
351
+ transition: background .12s;
352
+ }
353
+
354
+ [data-theme="forja"] .eb-player .eb-settings-category:last-child,
355
+ [data-theme="forja"] .eb-player .eb-settings-item:last-child {
356
+ border-bottom: none;
357
+ }
358
+
359
+ [data-theme="forja"] .eb-player .eb-settings-category:hover,
360
+ [data-theme="forja"] .eb-player .eb-settings-item:hover,
361
+ [data-theme="forja"] .eb-player .eb-settings-back:hover {
362
+ background: rgba(255,255,255,.06);
363
+ }
364
+
365
+ [data-theme="forja"] .eb-player .eb-settings-item--selected {
366
+ color: #fff;
367
+ font-weight: 500;
368
+ }
369
+
370
+ [data-theme="forja"] .eb-player .eb-settings-item--selected::after {
371
+ content: '';
372
+ width: 10px;
373
+ height: 10px;
374
+ border-radius: 50%;
375
+ background: #FC013B;
376
+ flex-shrink: 0;
377
+ }
378
+
379
+ [data-theme="forja"] .eb-player .eb-settings-item:not(.eb-settings-item--selected)::after {
380
+ content: '';
381
+ width: 10px;
382
+ height: 10px;
383
+ border-radius: 50%;
384
+ border: 2px solid rgba(255,255,255,.25);
385
+ flex-shrink: 0;
386
+ }
387
+
388
+
389
+ /* ============================================================
390
+ Error overlay
391
+ ============================================================ */
392
+ [data-theme="forja"] .eb-player .eb-error {
393
+ background: rgba(0,0,0,.88);
394
+ }
395
+
396
+ [data-theme="forja"] .eb-player .eb-error-retry {
397
+ border-radius: 3px;
398
+ background: rgba(255,255,255,.1);
399
+ border-color: rgba(255,255,255,.15);
400
+ transition: background .2s;
401
+ }
402
+
403
+ [data-theme="forja"] .eb-player .eb-error-retry:hover {
404
+ background: rgba(255,255,255,.18);
405
+ }
406
+
407
+ /* ============================================================
408
+ Toast
409
+ ============================================================ */
410
+ [data-theme="forja"] .eb-player .eb-toast {
411
+ background: rgba(20,20,20,.9);
412
+ border-radius: 3px;
413
+ font-size: 13px;
414
+ padding: 7px 14px;
10
415
  }
@@ -16,11 +16,14 @@
16
16
  /* ============================================================
17
17
  Root vars & container
18
18
  ============================================================ */
19
- [data-theme="lequipe"] .eb-player {
19
+ [data-theme="lequipe"] {
20
20
  --eb-color-primary: #d61e00;
21
21
  --eb-color-progress: #d61e00;
22
- --eb-color-background: rgba(10, 10, 20, 0.85);
23
22
  --eb-accent: #d61e00;
23
+ }
24
+
25
+ [data-theme="lequipe"] .eb-player {
26
+ --eb-color-background: rgba(10, 10, 20, 0.85);
24
27
  --eb-color-text: #fff;
25
28
  --eb-font-family: 'Inter', -apple-system, sans-serif;
26
29
  --eb-font-size-base: 14px;
@@ -291,9 +294,9 @@
291
294
  transition: height .15s;
292
295
  }
293
296
 
294
- /* Solid red fill */
297
+ /* Solid color fill */
295
298
  [data-theme="lequipe"] .eb-player .eb-seekbar-progress {
296
- background: #d61e00;
299
+ background: var(--eb-color-progress, var(--eb-color-primary, #d61e00));
297
300
  border-radius: 3px;
298
301
  transition: height .15s;
299
302
  }
@@ -645,16 +648,6 @@
645
648
  flex-shrink: 0;
646
649
  }
647
650
 
648
- /* ============================================================
649
- Loading spinner
650
- ============================================================ */
651
- [data-theme="lequipe"] .eb-player .eb-loading .eb-icon {
652
- width: 52px;
653
- height: 52px;
654
- color: rgba(255,255,255,.7);
655
- filter: drop-shadow(0 1px 6px rgba(0,0,0,.5));
656
- animation: eb-spin .75s linear infinite;
657
- }
658
651
 
659
652
  /* ============================================================
660
653
  Error overlay
@@ -25,11 +25,14 @@
25
25
  /* ============================================================
26
26
  Root vars & container
27
27
  ============================================================ */
28
- [data-theme="modern"] .eb-player {
28
+ [data-theme="modern"] {
29
29
  --eb-color-primary: #7c3aed;
30
30
  --eb-color-progress: #7c3aed;
31
- --eb-color-background: rgba(10, 10, 20, 0.85);
32
31
  --eb-accent: #1a73e8;
32
+ }
33
+
34
+ [data-theme="modern"] .eb-player {
35
+ --eb-color-background: rgba(10, 10, 20, 0.85);
33
36
  --eb-font-family: 'Inter', sans-serif;
34
37
  font-family: 'Inter', sans-serif;
35
38
  border-radius: 14px;
@@ -222,7 +225,7 @@
222
225
  }
223
226
 
224
227
  [data-theme="modern"] .eb-player .eb-seekbar-progress {
225
- background: linear-gradient(90deg, #a78bfa, #7c3aed);
228
+ background: var(--eb-color-progress, var(--eb-color-primary, #7c3aed));
226
229
  border-radius: 3px;
227
230
  transition: height .15s;
228
231
  }
@@ -406,12 +409,6 @@
406
409
  font-weight: 600;
407
410
  }
408
411
 
409
- /* ============================================================
410
- Loading spinner
411
- ============================================================ */
412
- [data-theme="modern"] .eb-player .eb-loading .eb-icon {
413
- color: rgba(255,255,255,.7);
414
- }
415
412
 
416
413
  /* ============================================================
417
414
  Error overlay
@@ -5,7 +5,10 @@
5
5
  * Uses higher specificity than base.css .eb-player selector.
6
6
  */
7
7
 
8
- [data-theme="radio"] .eb-player {
8
+ [data-theme="radio"] {
9
9
  --eb-color-primary: #F4A261;
10
+ }
11
+
12
+ [data-theme="radio"] .eb-player {
10
13
  --eb-color-background: rgba(20, 20, 30, 0.95);
11
14
  }
@@ -5,7 +5,10 @@
5
5
  * Uses higher specificity than base.css .eb-player selector.
6
6
  */
7
7
 
8
- [data-theme="snrt"] .eb-player {
8
+ [data-theme="snrt"] {
9
9
  --eb-color-primary: #006633;
10
+ }
11
+
12
+ [data-theme="snrt"] .eb-player {
10
13
  --eb-color-background: rgba(0, 0, 0, 0.9);
11
14
  }
@@ -2,7 +2,7 @@
2
2
  * V2 theme — based on snrtlive.ma (Aloula) player styling
3
3
  *
4
4
  * Applied when the container has [data-theme="v2"].
5
- * Dark UI with orange accent (#ff841f), Inter font, rounded container,
5
+ * Dark UI with indigo accent (#3d4097), Inter font, rounded container,
6
6
  * backdrop-blur panels, expandable volume, two-row bottom bar
7
7
  * (seekbar on top, buttons below), gradient overlays, centered
8
8
  * frosted-glass transport circles, and refined slide/fade animations.
@@ -16,11 +16,14 @@
16
16
  /* ============================================================
17
17
  Root vars & container
18
18
  ============================================================ */
19
+ [data-theme="v2"] {
20
+ --eb-color-primary: #3d4097;
21
+ --eb-color-progress: #3d4097;
22
+ --eb-accent: #3d4097;
23
+ }
24
+
19
25
  [data-theme="v2"] .eb-player {
20
- --eb-color-primary: #ff841f;
21
- --eb-color-progress: #ff841f;
22
26
  --eb-color-background: rgba(10, 10, 20, 0.85);
23
- --eb-accent: #ff841f;
24
27
  --eb-color-text: #fff;
25
28
  --eb-font-family: 'Inter', -apple-system, sans-serif;
26
29
  --eb-font-size-base: 14px;
@@ -108,11 +111,46 @@
108
111
  }
109
112
 
110
113
  /* ============================================================
111
- Bottom bar: single-row layout
112
- play | live | time | ——seekbar—— | settings | volume | fullscreen
114
+ Bottom bar: two-row layout
115
+ Row 1: LIVE + time
116
+ Row 2: play-pause | ——seekbar—— | volume | fullscreen
113
117
  PiP / Cast are in the top bar (via THEME_LAYOUTS.v2 in config.ts)
114
118
  ============================================================ */
115
119
 
120
+ [data-theme="v2"] .eb-player .eb-bottom-bar__controls-row {
121
+ flex-wrap: wrap;
122
+ align-items: center;
123
+ row-gap: 2px;
124
+ }
125
+
126
+ /* Row 1: live-sync and time float above, offset to align with seekbar start */
127
+ [data-theme="v2"] .eb-player .eb-slot-live-sync,
128
+ [data-theme="v2"] .eb-player .eb-slot-time {
129
+ order: -1;
130
+ }
131
+
132
+ /* Align row 1 with the seekbar: offset by play-pause width (38px) + gap (8px) */
133
+ [data-theme="v2"] .eb-player .eb-slot-live-sync {
134
+ margin-left: calc(38px + 8px);
135
+ }
136
+
137
+ /* Invisible full-width flex break between row 1 and row 2 */
138
+ [data-theme="v2"] .eb-player .eb-bottom-bar__controls-row::after {
139
+ content: '';
140
+ width: 100%;
141
+ height: 0;
142
+ order: 0;
143
+ flex-shrink: 0;
144
+ }
145
+
146
+ /* Row 2: play-pause, seekbar, volume, fullscreen */
147
+ [data-theme="v2"] .eb-player .eb-slot-play-pause,
148
+ [data-theme="v2"] .eb-player .eb-bottom-bar__seekbar-zone,
149
+ [data-theme="v2"] .eb-player .eb-slot-volume,
150
+ [data-theme="v2"] .eb-player .eb-slot-fullscreen {
151
+ order: 1;
152
+ }
153
+
116
154
  /* ============================================================
117
155
  Middle bar: glassmorphism transport circles
118
156
  ============================================================ */
@@ -297,9 +335,9 @@
297
335
  transition: height .15s;
298
336
  }
299
337
 
300
- /* Orange gradient fill */
338
+ /* Gradient fill — brightens toward the right */
301
339
  [data-theme="v2"] .eb-player .eb-seekbar-progress {
302
- background: linear-gradient(90deg, #ff841f, color-mix(in srgb, #ff841f 70%, #fff));
340
+ background: linear-gradient(90deg, var(--eb-color-progress, var(--eb-color-primary, #3d4097)), color-mix(in srgb, var(--eb-color-progress, var(--eb-color-primary, #3d4097)) 70%, #fff));
303
341
  border-radius: 3px;
304
342
  transition: height .15s;
305
343
  }
@@ -309,7 +347,7 @@
309
347
  height: 14px;
310
348
  right: -7px;
311
349
  background: #fff;
312
- box-shadow: 0 0 0 3px rgba(255,132,31,.45);
350
+ box-shadow: 0 0 0 3px rgba(61,64,151,.45);
313
351
  }
314
352
 
315
353
  /* ============================================================
@@ -377,7 +415,7 @@
377
415
  }
378
416
 
379
417
  [data-theme="v2"] .eb-player .eb-volume-fill {
380
- background: var(--eb-color-primary, #ff841f);
418
+ background: var(--eb-color-primary, #3d4097);
381
419
  }
382
420
 
383
421
  [data-theme="v2"] .eb-player .eb-volume-thumb {
@@ -518,8 +556,8 @@
518
556
  width: 10px;
519
557
  height: 10px;
520
558
  border-radius: 50%;
521
- background: var(--eb-accent, #ff841f);
522
- box-shadow: 0 0 0 3px rgba(255,132,31,.25);
559
+ background: var(--eb-accent, #3d4097);
560
+ box-shadow: 0 0 0 3px rgba(61,64,151,.25);
523
561
  flex-shrink: 0;
524
562
  }
525
563
 
@@ -539,16 +577,6 @@
539
577
  font-weight: 600;
540
578
  }
541
579
 
542
- /* ============================================================
543
- Loading spinner
544
- ============================================================ */
545
- [data-theme="v2"] .eb-player .eb-loading .eb-icon {
546
- width: 52px;
547
- height: 52px;
548
- color: rgba(255,255,255,.7);
549
- filter: drop-shadow(0 1px 6px rgba(0,0,0,.5));
550
- animation: eb-spin .75s linear infinite;
551
- }
552
580
 
553
581
  /* ============================================================
554
582
  Error overlay
@@ -43,6 +43,7 @@ export declare class CommandHandler {
43
43
  private wireReloadOrchestration;
44
44
  private wireCastHandoff;
45
45
  private wireVolumeRouting;
46
+ private wireGeoblock;
46
47
  private showToast;
47
48
  private wireAbortCleanup;
48
49
  }
@@ -1 +1 @@
1
- {"version":3,"file":"command-handler.d.ts","sourceRoot":"","sources":["../../../../src/core/command-handler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAClC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAA;AAE3E;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,MAAM,CAAA;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,WAAW,CAAI;IACvB,OAAO,CAAC,YAAY,CAAoE;IACxF,OAAO,CAAC,UAAU,CAAoE;IACtF,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,eAAe,CAAI;IAC3B,OAAO,CAAC,kBAAkB,CAAK;gBAG7B,GAAG,EAAE,aAAa,EAClB,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,UAAU,GAAG,IAAI,EAClC,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,EAC3C,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,MAAM,IAAI,EACpB,MAAM,EAAE,WAAW;IAcrB;;;OAGG;IACH,kBAAkB,IAAI,eAAe;IAYrC,OAAO,CAAC,iBAAiB;IAiDzB,OAAO,CAAC,kBAAkB;IA0B1B,OAAO,CAAC,uBAAuB;IAwC/B,OAAO,CAAC,eAAe;IA8BvB,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,gBAAgB;CAMzB"}
1
+ {"version":3,"file":"command-handler.d.ts","sourceRoot":"","sources":["../../../../src/core/command-handler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAClC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AACxD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAA;AAE3E;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,MAAM,CAAA;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,WAAW,CAAI;IACvB,OAAO,CAAC,YAAY,CAAoE;IACxF,OAAO,CAAC,UAAU,CAAoE;IACtF,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,eAAe,CAAI;IAC3B,OAAO,CAAC,kBAAkB,CAAK;gBAG7B,GAAG,EAAE,aAAa,EAClB,KAAK,EAAE,gBAAgB,EACvB,KAAK,EAAE,WAAW,EAClB,SAAS,EAAE,MAAM,UAAU,GAAG,IAAI,EAClC,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,EAC3C,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,MAAM,IAAI,EACpB,MAAM,EAAE,WAAW;IAerB;;;OAGG;IACH,kBAAkB,IAAI,eAAe;IAYrC,OAAO,CAAC,iBAAiB;IAiDzB,OAAO,CAAC,kBAAkB;IA0B1B,OAAO,CAAC,uBAAuB;IAwC/B,OAAO,CAAC,eAAe;IA8BvB,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,YAAY;IAWpB,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,gBAAgB;CAMzB"}
@@ -45,7 +45,7 @@ export interface LibSettings {
45
45
  [key: string]: unknown;
46
46
  }
47
47
  /** Identifies a mountable skin component for layout configuration. */
48
- export type ComponentId = 'play-pause' | 'volume' | 'seekbar' | 'time' | 'live-sync' | 'settings' | 'pip' | 'cast' | 'fullscreen' | 'rewind' | 'forward' | 'share' | 'info';
48
+ export type ComponentId = 'play-pause' | 'volume' | 'seekbar' | 'time' | 'live-sync' | 'settings' | 'pip' | 'cast' | 'fullscreen' | 'rewind' | 'forward' | 'share' | 'info' | 'channel-name';
49
49
  /** Ordered component lists for each alignment zone within a bar. */
50
50
  export interface BarLayout {
51
51
  left?: ComponentId[];
@@ -165,6 +165,7 @@ export interface PlayerConfig {
165
165
  epgDefaultLang: string;
166
166
  showEpgTitlePreview: boolean;
167
167
  showProgressThumb: boolean;
168
+ channelName: string | undefined;
168
169
  layout: LayoutConfig | undefined;
169
170
  [key: string]: unknown;
170
171
  }