unified-video-framework 1.4.353 → 1.4.355

package/packages/web/dist/react/types/FlashNewsTickerTypes.d.ts

@@ -6,10 +6,24 @@ export interface FlashNewsTickerItem {
     endTime?: number;
     metadata?: Record<string, any>;
 }
+export interface TickerDisplayConfig {
+    items: FlashNewsTickerItem[];
+    height?: number;
+    backgroundColor?: string;
+    textColor?: string;
+    fontSize?: number;
+    fontWeight?: number | string;
+    speed?: number;
+    gap?: number;
+    separator?: string;
+    offset?: number;
+}
 export interface FlashNewsTickerConfig {
     enabled?: boolean;
-    items: FlashNewsTickerItem[];
+    items?: FlashNewsTickerItem[];
     position?: 'top' | 'bottom' | 'both';
+    topConfig?: TickerDisplayConfig;
+    bottomConfig?: TickerDisplayConfig;
     height?: number;
     backgroundColor?: string;
     textColor?: string;

package/packages/web/dist/react/types/FlashNewsTickerTypes.d.ts.map

@@ -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;IAG7B,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IAKrC,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"}
+{"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"}

package/packages/web/src/WebPlayer.ts

@@ -2281,20 +2281,46 @@ export class WebPlayer extends BasePlayer {
     this.flashTickerTopElement = null;
     this.flashTickerBottomElement = null;
 
-    if (!config.enabled || !config.items || config.items.length === 0) {
+    if (!config.enabled) {
       return;
     }
 
-    // Create top ticker if needed
-    if (config.position === 'top' || config.position === 'both') {
-      this.flashTickerTopElement = this.createTickerElement(config, 'top');
-      this.flashTickerContainer.appendChild(this.flashTickerTopElement);
+    // Handle 'both' position with separate configs
+    if (config.position === 'both') {
+      // Create top ticker with topConfig or fallback to main config
+      if (config.topConfig && config.topConfig.items && config.topConfig.items.length > 0) {
+        const topConfig = { ...config, ...config.topConfig };
+        this.flashTickerTopElement = this.createTickerElement(topConfig, 'top');
+        this.flashTickerContainer.appendChild(this.flashTickerTopElement);
+      } else if (config.items && config.items.length > 0) {
+        this.flashTickerTopElement = this.createTickerElement(config, 'top');
+        this.flashTickerContainer.appendChild(this.flashTickerTopElement);
+      }
+
+      // Create bottom ticker with bottomConfig or fallback to main config
+      if (config.bottomConfig && config.bottomConfig.items && config.bottomConfig.items.length > 0) {
+        const bottomConfig = { ...config, ...config.bottomConfig };
+        this.flashTickerBottomElement = this.createTickerElement(bottomConfig, 'bottom');
+        this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
+      } else if (config.items && config.items.length > 0) {
+        this.flashTickerBottomElement = this.createTickerElement(config, 'bottom');
+        this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
+      }
     }
+    // Handle single position (top or bottom)
+    else {
+      if (!config.items || config.items.length === 0) {
+        return;
+      }
 
-    // Create bottom ticker if needed
-    if (config.position === 'bottom' || config.position === 'both' || !config.position) {
-      this.flashTickerBottomElement = this.createTickerElement(config, 'bottom');
-      this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
+      if (config.position === 'top') {
+        this.flashTickerTopElement = this.createTickerElement(config, 'top');
+        this.flashTickerContainer.appendChild(this.flashTickerTopElement);
+      } else {
+        // Default to bottom
+        this.flashTickerBottomElement = this.createTickerElement(config, 'bottom');
+        this.flashTickerContainer.appendChild(this.flashTickerBottomElement);
+      }
     }
   }
 
@@ -2303,7 +2329,7 @@ export class WebPlayer extends BasePlayer {
     ticker.className = `uvf-flash-ticker ticker-${position}`;
 
     const bottomOffset = config.bottomOffset || 0;
-    const topOffset = config.topOffset || 10;
+    const topOffset = config.topOffset || 0;
     const height = config.height || 40;
 
     ticker.style.cssText = `
@@ -2334,6 +2360,7 @@ export class WebPlayer extends BasePlayer {
 
     // Render items multiple times for continuous seamless loop
     const renderItems = () => {
+      if (!config.items) return;
       config.items.forEach((item) => {
         const span = document.createElement('span');
         span.textContent = item.text;
@@ -2385,6 +2412,9 @@ export class WebPlayer extends BasePlayer {
 
   private calculateTickerDuration(config: FlashNewsTickerConfig): number {
     const speed = config.speed || 50;
+    if (!config.items || config.items.length === 0) {
+      return 15; // Default minimum duration
+    }
     const itemsLength = config.items.reduce((acc, item) => acc + item.text.length, 0);
     const avgCharWidth = 10; // Approximate pixel width per character
     const gap = config.gap || 100;

package/packages/web/src/react/types/FlashNewsTickerTypes.ts

@@ -28,6 +28,45 @@ export interface FlashNewsTickerItem {
   metadata?: Record<string, any>;
 }
 
+/**
+ * Configuration for a single ticker (top or bottom)
+ */
+export interface TickerDisplayConfig {
+  /** Array of news items to display */
+  items: FlashNewsTickerItem[];
+
+  // Visual styling
+
+  /** Height of ticker in pixels. Default: 40 */
+  height?: number;
+
+  /** Background color with alpha. Default: 'rgba(0,0,0,0.7)' */
+  backgroundColor?: string;
+
+  /** Text color. Default: '#ffffff' */
+  textColor?: string;
+
+  /** Font size in pixels. Default: 14 */
+  fontSize?: number;
+
+  /** Font weight. Default: 600 */
+  fontWeight?: number | string;
+
+  // Animation
+
+  /** Animation speed in pixels per second. Default: 50 */
+  speed?: number;
+
+  /** Space between items in pixels. Default: 100 */
+  gap?: number;
+
+  /** Separator text between items. Default: ' • ' */
+  separator?: string;
+
+  /** Offset in pixels for safe area. Default: 0 for bottom, 10 for top */
+  offset?: number;
+}
+
 /**
  * Configuration for the flash news ticker
  */
@@ -35,13 +74,19 @@ export interface FlashNewsTickerConfig {
   /** Enable or disable the ticker. Default: true */
   enabled?: boolean;
 
-  /** Array of news items to display */
-  items: FlashNewsTickerItem[];
+  /** Array of news items to display (for backward compatibility when position is 'top' or 'bottom') */
+  items?: FlashNewsTickerItem[];
 
   /** Position on screen. Default: 'bottom' */
   position?: 'top' | 'bottom' | 'both';
 
-  // Visual styling
+  /** Configuration for top ticker (only used when position is 'both') */
+  topConfig?: TickerDisplayConfig;
+
+  /** Configuration for bottom ticker (only used when position is 'both') */
+  bottomConfig?: TickerDisplayConfig;
+
+  // Visual styling (applies to both if position is 'both' and no specific config provided)
 
   /** Height of ticker in pixels. Default: 40 */
   height?: number;
@@ -80,7 +125,7 @@ export interface FlashNewsTickerConfig {
   /** Top offset in pixels for safe area. Default: 10 */
   topOffset?: number;
 
-  /** Bottom offset in pixels for safe area. Default: 10 */
+  /** Bottom offset in pixels for safe area. Default: 0 */
   bottomOffset?: number;
 }