unified-video-framework 1.4.354 → 1.4.355
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/package.json +1 -1
- package/packages/web/dist/WebPlayer.d.ts.map +1 -1
- package/packages/web/dist/WebPlayer.js +37 -7
- package/packages/web/dist/WebPlayer.js.map +1 -1
- package/packages/web/dist/react/types/FlashNewsTickerTypes.d.ts +15 -1
- package/packages/web/dist/react/types/FlashNewsTickerTypes.d.ts.map +1 -1
- package/packages/web/src/WebPlayer.ts +39 -9
- package/packages/web/src/react/types/FlashNewsTickerTypes.ts +49 -4
|
@@ -6,10 +6,24 @@ export interface FlashNewsTickerItem {
|
|
|
6
6
|
endTime?: number;
|
|
7
7
|
metadata?: Record<string, any>;
|
|
8
8
|
}
|
|
9
|
+
export interface TickerDisplayConfig {
|
|
10
|
+
items: FlashNewsTickerItem[];
|
|
11
|
+
height?: number;
|
|
12
|
+
backgroundColor?: string;
|
|
13
|
+
textColor?: string;
|
|
14
|
+
fontSize?: number;
|
|
15
|
+
fontWeight?: number | string;
|
|
16
|
+
speed?: number;
|
|
17
|
+
gap?: number;
|
|
18
|
+
separator?: string;
|
|
19
|
+
offset?: number;
|
|
20
|
+
}
|
|
9
21
|
export interface FlashNewsTickerConfig {
|
|
10
22
|
enabled?: boolean;
|
|
11
|
-
items
|
|
23
|
+
items?: FlashNewsTickerItem[];
|
|
12
24
|
position?: 'top' | 'bottom' | 'both';
|
|
25
|
+
topConfig?: TickerDisplayConfig;
|
|
26
|
+
bottomConfig?: TickerDisplayConfig;
|
|
13
27
|
height?: number;
|
|
14
28
|
backgroundColor?: string;
|
|
15
29
|
textColor?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FlashNewsTickerTypes.d.ts","sourceRoot":"","sources":["../../../src/react/types/FlashNewsTickerTypes.ts"],"names":[],"mappings":"AAUA,MAAM,WAAW,mBAAmB;IAElC,EAAE,EAAE,MAAM,CAAC;IAGX,IAAI,EAAE,MAAM,CAAC;IAGb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,OAAO,CAAC,EAAE,MAAM,CAAC;IAGjB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAChC;AAKD,MAAM,WAAW,qBAAqB;IAEpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAGlB,KAAK,EAAE,mBAAmB,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"FlashNewsTickerTypes.d.ts","sourceRoot":"","sources":["../../../src/react/types/FlashNewsTickerTypes.ts"],"names":[],"mappings":"AAUA,MAAM,WAAW,mBAAmB;IAElC,EAAE,EAAE,MAAM,CAAC;IAGX,IAAI,EAAE,MAAM,CAAC;IAGb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,OAAO,CAAC,EAAE,MAAM,CAAC;IAGjB,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAChC;AAKD,MAAM,WAAW,mBAAmB;IAElC,KAAK,EAAE,mBAAmB,EAAE,CAAC;IAK7B,MAAM,CAAC,EAAE,MAAM,CAAC;IAGhB,eAAe,CAAC,EAAE,MAAM,CAAC;IAGzB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAK7B,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAKD,MAAM,WAAW,qBAAqB;IAEpC,OAAO,CAAC,EAAE,OAAO,CAAC;IAGlB,KAAK,CAAC,EAAE,mBAAmB,EAAE,CAAC;IAG9B,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IAGrC,SAAS,CAAC,EAAE,mBAAmB,CAAC;IAGhC,YAAY,CAAC,EAAE,mBAAmB,CAAC;IAKnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAGhB,eAAe,CAAC,EAAE,MAAM,CAAC;IAGzB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAK7B,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,YAAY,CAAC,EAAE,OAAO,CAAC;IAGvB,GAAG,CAAC,EAAE,MAAM,CAAC;IAGb,IAAI,CAAC,EAAE,OAAO,CAAC;IAGf,SAAS,CAAC,EAAE,MAAM,CAAC;IAKnB,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAKD,MAAM,WAAW,kBAAkB;IAEjC,IAAI,EAAE,MAAM,IAAI,CAAC;IAGjB,IAAI,EAAE,MAAM,IAAI,CAAC;IAGjB,SAAS,EAAE,MAAM,OAAO,CAAC;IAGzB,WAAW,EAAE,CAAC,KAAK,EAAE,mBAAmB,EAAE,KAAK,IAAI,CAAC;IAGpD,OAAO,EAAE,CAAC,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAG7C,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAGrC,UAAU,EAAE,MAAM,IAAI,CAAC;IAGvB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,qBAAqB,CAAC,KAAK,IAAI,CAAC;IAG/D,KAAK,EAAE,MAAM,IAAI,CAAC;IAGlB,MAAM,EAAE,MAAM,IAAI,CAAC;IAGnB,QAAQ,EAAE,MAAM,OAAO,CAAC;CACzB"}
|
|
@@ -2281,20 +2281,46 @@ export class WebPlayer extends BasePlayer {
|
|
|
2281
2281
|
this.flashTickerTopElement = null;
|
|
2282
2282
|
this.flashTickerBottomElement = null;
|
|
2283
2283
|
|
|
2284
|
-
if (!config.enabled
|
|
2284
|
+
if (!config.enabled) {
|
|
2285
2285
|
return;
|
|
2286
2286
|
}
|
|
2287
2287
|
|
|
2288
|
-
//
|
|
2289
|
-
if (config.position === '
|
|
2290
|
-
|
|
2291
|
-
|
|
2288
|
+
// Handle 'both' position with separate configs
|
|
2289
|
+
if (config.position === 'both') {
|
|
2290
|
+
// Create top ticker with topConfig or fallback to main config
|
|
2291
|
+
if (config.topConfig && config.topConfig.items && config.topConfig.items.length > 0) {
|
|
2292
|
+
const topConfig = { ...config, ...config.topConfig };
|
|
2293
|
+
this.flashTickerTopElement = this.createTickerElement(topConfig, 'top');
|
|
2294
|
+
this.flashTickerContainer.appendChild(this.flashTickerTopElement);
|
|
2295
|
+
} else if (config.items && config.items.length > 0) {
|
|
2296
|
+
this.flashTickerTopElement = this.createTickerElement(config, 'top');
|
|
2297
|
+
this.flashTickerContainer.appendChild(this.flashTickerTopElement);
|
|
2298
|
+
}
|
|
2299
|
+
|
|
2300
|
+
// Create bottom ticker with bottomConfig or fallback to main config
|
|
2301
|
+
if (config.bottomConfig && config.bottomConfig.items && config.bottomConfig.items.length > 0) {
|
|
2302
|
+
const bottomConfig = { ...config, ...config.bottomConfig };
|
|
2303
|
+
this.flashTickerBottomElement = this.createTickerElement(bottomConfig, 'bottom');
|
|
2304
|
+
this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
|
|
2305
|
+
} else if (config.items && config.items.length > 0) {
|
|
2306
|
+
this.flashTickerBottomElement = this.createTickerElement(config, 'bottom');
|
|
2307
|
+
this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
|
|
2308
|
+
}
|
|
2292
2309
|
}
|
|
2310
|
+
// Handle single position (top or bottom)
|
|
2311
|
+
else {
|
|
2312
|
+
if (!config.items || config.items.length === 0) {
|
|
2313
|
+
return;
|
|
2314
|
+
}
|
|
2293
2315
|
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2316
|
+
if (config.position === 'top') {
|
|
2317
|
+
this.flashTickerTopElement = this.createTickerElement(config, 'top');
|
|
2318
|
+
this.flashTickerContainer.appendChild(this.flashTickerTopElement);
|
|
2319
|
+
} else {
|
|
2320
|
+
// Default to bottom
|
|
2321
|
+
this.flashTickerBottomElement = this.createTickerElement(config, 'bottom');
|
|
2322
|
+
this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
|
|
2323
|
+
}
|
|
2298
2324
|
}
|
|
2299
2325
|
}
|
|
2300
2326
|
|
|
@@ -2334,6 +2360,7 @@ export class WebPlayer extends BasePlayer {
|
|
|
2334
2360
|
|
|
2335
2361
|
// Render items multiple times for continuous seamless loop
|
|
2336
2362
|
const renderItems = () => {
|
|
2363
|
+
if (!config.items) return;
|
|
2337
2364
|
config.items.forEach((item) => {
|
|
2338
2365
|
const span = document.createElement('span');
|
|
2339
2366
|
span.textContent = item.text;
|
|
@@ -2385,6 +2412,9 @@ export class WebPlayer extends BasePlayer {
|
|
|
2385
2412
|
|
|
2386
2413
|
private calculateTickerDuration(config: FlashNewsTickerConfig): number {
|
|
2387
2414
|
const speed = config.speed || 50;
|
|
2415
|
+
if (!config.items || config.items.length === 0) {
|
|
2416
|
+
return 15; // Default minimum duration
|
|
2417
|
+
}
|
|
2388
2418
|
const itemsLength = config.items.reduce((acc, item) => acc + item.text.length, 0);
|
|
2389
2419
|
const avgCharWidth = 10; // Approximate pixel width per character
|
|
2390
2420
|
const gap = config.gap || 100;
|
|
@@ -28,6 +28,45 @@ export interface FlashNewsTickerItem {
|
|
|
28
28
|
metadata?: Record<string, any>;
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
+
/**
|
|
32
|
+
* Configuration for a single ticker (top or bottom)
|
|
33
|
+
*/
|
|
34
|
+
export interface TickerDisplayConfig {
|
|
35
|
+
/** Array of news items to display */
|
|
36
|
+
items: FlashNewsTickerItem[];
|
|
37
|
+
|
|
38
|
+
// Visual styling
|
|
39
|
+
|
|
40
|
+
/** Height of ticker in pixels. Default: 40 */
|
|
41
|
+
height?: number;
|
|
42
|
+
|
|
43
|
+
/** Background color with alpha. Default: 'rgba(0,0,0,0.7)' */
|
|
44
|
+
backgroundColor?: string;
|
|
45
|
+
|
|
46
|
+
/** Text color. Default: '#ffffff' */
|
|
47
|
+
textColor?: string;
|
|
48
|
+
|
|
49
|
+
/** Font size in pixels. Default: 14 */
|
|
50
|
+
fontSize?: number;
|
|
51
|
+
|
|
52
|
+
/** Font weight. Default: 600 */
|
|
53
|
+
fontWeight?: number | string;
|
|
54
|
+
|
|
55
|
+
// Animation
|
|
56
|
+
|
|
57
|
+
/** Animation speed in pixels per second. Default: 50 */
|
|
58
|
+
speed?: number;
|
|
59
|
+
|
|
60
|
+
/** Space between items in pixels. Default: 100 */
|
|
61
|
+
gap?: number;
|
|
62
|
+
|
|
63
|
+
/** Separator text between items. Default: ' • ' */
|
|
64
|
+
separator?: string;
|
|
65
|
+
|
|
66
|
+
/** Offset in pixels for safe area. Default: 0 for bottom, 10 for top */
|
|
67
|
+
offset?: number;
|
|
68
|
+
}
|
|
69
|
+
|
|
31
70
|
/**
|
|
32
71
|
* Configuration for the flash news ticker
|
|
33
72
|
*/
|
|
@@ -35,13 +74,19 @@ export interface FlashNewsTickerConfig {
|
|
|
35
74
|
/** Enable or disable the ticker. Default: true */
|
|
36
75
|
enabled?: boolean;
|
|
37
76
|
|
|
38
|
-
/** Array of news items to display */
|
|
39
|
-
items
|
|
77
|
+
/** Array of news items to display (for backward compatibility when position is 'top' or 'bottom') */
|
|
78
|
+
items?: FlashNewsTickerItem[];
|
|
40
79
|
|
|
41
80
|
/** Position on screen. Default: 'bottom' */
|
|
42
81
|
position?: 'top' | 'bottom' | 'both';
|
|
43
82
|
|
|
44
|
-
|
|
83
|
+
/** Configuration for top ticker (only used when position is 'both') */
|
|
84
|
+
topConfig?: TickerDisplayConfig;
|
|
85
|
+
|
|
86
|
+
/** Configuration for bottom ticker (only used when position is 'both') */
|
|
87
|
+
bottomConfig?: TickerDisplayConfig;
|
|
88
|
+
|
|
89
|
+
// Visual styling (applies to both if position is 'both' and no specific config provided)
|
|
45
90
|
|
|
46
91
|
/** Height of ticker in pixels. Default: 40 */
|
|
47
92
|
height?: number;
|
|
@@ -80,7 +125,7 @@ export interface FlashNewsTickerConfig {
|
|
|
80
125
|
/** Top offset in pixels for safe area. Default: 10 */
|
|
81
126
|
topOffset?: number;
|
|
82
127
|
|
|
83
|
-
/** Bottom offset in pixels for safe area. Default:
|
|
128
|
+
/** Bottom offset in pixels for safe area. Default: 0 */
|
|
84
129
|
bottomOffset?: number;
|
|
85
130
|
}
|
|
86
131
|
|