@mottosports/motto-video-player 1.0.1-rc.81 → 1.0.1-rc.82

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/dist/index.d.mts CHANGED
@@ -163,10 +163,6 @@ interface PlayerEvents {
163
163
  * Callback when Mux analytics updates data
164
164
  */
165
165
  onMuxDataUpdate?: (data: MuxDataUpdatePayload) => void;
166
- /**
167
- * Callback when live state changes
168
- */
169
- onLiveStateChange?: (isLive: boolean) => void;
170
166
  /**
171
167
  * Callback when live status changes (includes edge proximity)
172
168
  */
@@ -175,6 +171,40 @@ interface PlayerEvents {
175
171
  isNearEdge: boolean;
176
172
  liveEdge?: number;
177
173
  }) => void;
174
+ /**
175
+ * Callback when video time updates
176
+ * Provides different data for regular videos vs live streams
177
+ */
178
+ onTimeUpdate?: (timeData: TimeUpdateData) => void;
179
+ }
180
+ /**
181
+ * Time update data for both regular videos and live streams
182
+ */
183
+ interface TimeUpdateData {
184
+ /**
185
+ * Current playback position in seconds
186
+ */
187
+ currentTime: number;
188
+ /**
189
+ * Total duration in seconds (Infinity for live streams)
190
+ */
191
+ duration: number;
192
+ /**
193
+ * Whether this is a live stream
194
+ */
195
+ isLive: boolean;
196
+ /**
197
+ * For live streams: the live edge position in seconds
198
+ */
199
+ liveEdge?: number;
200
+ /**
201
+ * For live streams: how far behind the live edge (in seconds)
202
+ */
203
+ timeBehindLive?: number;
204
+ /**
205
+ * For regular videos: playback progress as percentage (0-100)
206
+ */
207
+ progress?: number;
178
208
  }
179
209
  /**
180
210
  * Seekbar color configuration
@@ -666,4 +696,4 @@ interface BigPlayIconProps {
666
696
  }
667
697
  declare const BigPlayIcon: React.FC<BigPlayIconProps>;
668
698
 
669
- export { BigPlayIcon, CreativeWork, type CreativeWorkData, type CreativeWorkProps, CreativeWorksSortDirection, Event, type EventData, type EventProps, EventsSortDirection, type IconSizes, Player, type PlayerEvents, type PlayerProps, QueryProvider, SkipBackIcon, SkipForwardIcon, Video, type VideoData, type VideoProps, queryClient };
699
+ export { BigPlayIcon, CreativeWork, type CreativeWorkData, type CreativeWorkProps, CreativeWorksSortDirection, Event, type EventData, type EventProps, EventsSortDirection, type IconSizes, Player, type PlayerEvents, type PlayerProps, QueryProvider, SkipBackIcon, SkipForwardIcon, type TimeUpdateData, Video, type VideoData, type VideoProps, queryClient };
package/dist/index.d.ts CHANGED
@@ -163,10 +163,6 @@ interface PlayerEvents {
163
163
  * Callback when Mux analytics updates data
164
164
  */
165
165
  onMuxDataUpdate?: (data: MuxDataUpdatePayload) => void;
166
- /**
167
- * Callback when live state changes
168
- */
169
- onLiveStateChange?: (isLive: boolean) => void;
170
166
  /**
171
167
  * Callback when live status changes (includes edge proximity)
172
168
  */
@@ -175,6 +171,40 @@ interface PlayerEvents {
175
171
  isNearEdge: boolean;
176
172
  liveEdge?: number;
177
173
  }) => void;
174
+ /**
175
+ * Callback when video time updates
176
+ * Provides different data for regular videos vs live streams
177
+ */
178
+ onTimeUpdate?: (timeData: TimeUpdateData) => void;
179
+ }
180
+ /**
181
+ * Time update data for both regular videos and live streams
182
+ */
183
+ interface TimeUpdateData {
184
+ /**
185
+ * Current playback position in seconds
186
+ */
187
+ currentTime: number;
188
+ /**
189
+ * Total duration in seconds (Infinity for live streams)
190
+ */
191
+ duration: number;
192
+ /**
193
+ * Whether this is a live stream
194
+ */
195
+ isLive: boolean;
196
+ /**
197
+ * For live streams: the live edge position in seconds
198
+ */
199
+ liveEdge?: number;
200
+ /**
201
+ * For live streams: how far behind the live edge (in seconds)
202
+ */
203
+ timeBehindLive?: number;
204
+ /**
205
+ * For regular videos: playback progress as percentage (0-100)
206
+ */
207
+ progress?: number;
178
208
  }
179
209
  /**
180
210
  * Seekbar color configuration
@@ -666,4 +696,4 @@ interface BigPlayIconProps {
666
696
  }
667
697
  declare const BigPlayIcon: React.FC<BigPlayIconProps>;
668
698
 
669
- export { BigPlayIcon, CreativeWork, type CreativeWorkData, type CreativeWorkProps, CreativeWorksSortDirection, Event, type EventData, type EventProps, EventsSortDirection, type IconSizes, Player, type PlayerEvents, type PlayerProps, QueryProvider, SkipBackIcon, SkipForwardIcon, Video, type VideoData, type VideoProps, queryClient };
699
+ export { BigPlayIcon, CreativeWork, type CreativeWorkData, type CreativeWorkProps, CreativeWorksSortDirection, Event, type EventData, type EventProps, EventsSortDirection, type IconSizes, Player, type PlayerEvents, type PlayerProps, QueryProvider, SkipBackIcon, SkipForwardIcon, type TimeUpdateData, Video, type VideoData, type VideoProps, queryClient };
package/dist/index.js CHANGED
@@ -490,7 +490,7 @@ var supportsWidevinePersistentLicenses = () => {
490
490
  var import_mux_data_shakaplayer = __toESM(require("@mux/mux-data-shakaplayer"));
491
491
 
492
492
  // package.json
493
- var version = "1.0.1-rc.81";
493
+ var version = "1.0.1-rc.82";
494
494
 
495
495
  // src/utils/licenseCache.ts
496
496
  var PERSISTENT_LICENSE_PREFIX = "motto_lic_";
@@ -1611,17 +1611,43 @@ var useShakaUI = (playerRef, containerRef, videoRef, controls, chromecastConfig,
1611
1611
 
1612
1612
  // src/hooks/useEventHandlers.ts
1613
1613
  var import_react7 = require("react");
1614
- var useEventHandlers = (videoRef, handlers) => {
1614
+ var useEventHandlers = (videoRef, playerRef, handlers) => {
1615
+ const timeUpdateHandlerRef = (0, import_react7.useRef)(null);
1615
1616
  const setupEventListeners = (0, import_react7.useCallback)(() => {
1616
1617
  const video = videoRef.current;
1617
1618
  if (!video) return;
1618
- const { onPlay, onPause, onEnded, onLoadStart, onCanPlay } = handlers;
1619
+ const { onPlay, onPause, onEnded, onLoadStart, onCanPlay, onTimeUpdate } = handlers;
1619
1620
  if (onPlay) video.addEventListener("play", onPlay);
1620
1621
  if (onPause) video.addEventListener("pause", onPause);
1621
1622
  if (onEnded) video.addEventListener("ended", onEnded);
1622
1623
  if (onLoadStart) video.addEventListener("loadstart", onLoadStart);
1623
1624
  if (onCanPlay) video.addEventListener("canplay", onCanPlay);
1624
- }, [videoRef, handlers]);
1625
+ if (onTimeUpdate) {
1626
+ const handleTimeUpdate = () => {
1627
+ const player = playerRef.current;
1628
+ const currentTime = video.currentTime;
1629
+ const duration = video.duration;
1630
+ const isLive = player && typeof player.isLive === "function" ? player.isLive() : false;
1631
+ const timeData = {
1632
+ currentTime,
1633
+ duration,
1634
+ isLive
1635
+ };
1636
+ if (isLive && player && typeof player.seekRange === "function") {
1637
+ const seekRange = player.seekRange();
1638
+ if (seekRange && seekRange.end !== void 0) {
1639
+ timeData.liveEdge = seekRange.end;
1640
+ timeData.timeBehindLive = seekRange.end - currentTime;
1641
+ }
1642
+ } else if (duration && isFinite(duration) && duration > 0) {
1643
+ timeData.progress = currentTime / duration * 100;
1644
+ }
1645
+ onTimeUpdate(timeData);
1646
+ };
1647
+ timeUpdateHandlerRef.current = handleTimeUpdate;
1648
+ video.addEventListener("timeupdate", handleTimeUpdate);
1649
+ }
1650
+ }, [videoRef, playerRef, handlers]);
1625
1651
  const cleanupEventListeners = (0, import_react7.useCallback)(() => {
1626
1652
  const video = videoRef.current;
1627
1653
  if (!video) return;
@@ -1631,6 +1657,10 @@ var useEventHandlers = (videoRef, handlers) => {
1631
1657
  if (onEnded) video.removeEventListener("ended", onEnded);
1632
1658
  if (onLoadStart) video.removeEventListener("loadstart", onLoadStart);
1633
1659
  if (onCanPlay) video.removeEventListener("canplay", onCanPlay);
1660
+ if (timeUpdateHandlerRef.current) {
1661
+ video.removeEventListener("timeupdate", timeUpdateHandlerRef.current);
1662
+ timeUpdateHandlerRef.current = null;
1663
+ }
1634
1664
  }, [videoRef, handlers]);
1635
1665
  return {
1636
1666
  setupEventListeners,
@@ -2231,12 +2261,13 @@ var Player = (0, import_react12.forwardRef)(
2231
2261
  skipForward,
2232
2262
  enabled: true
2233
2263
  });
2234
- const { setupEventListeners, cleanupEventListeners } = useEventHandlers(videoRef, {
2264
+ const { setupEventListeners, cleanupEventListeners } = useEventHandlers(videoRef, playerRef, {
2235
2265
  onPlay: events?.onPlay,
2236
2266
  onPause: events?.onPause,
2237
2267
  onEnded: events?.onEnded,
2238
2268
  onLoadStart: events?.onLoadStart,
2239
- onCanPlay: events?.onCanPlay
2269
+ onCanPlay: events?.onCanPlay,
2270
+ onTimeUpdate: events?.onTimeUpdate
2240
2271
  });
2241
2272
  const { uiRef, initializeUI, destroyUI } = useShakaUI(
2242
2273
  playerRef,