@100mslive/react-native-room-kit/lib/module/components/HLSDistanceFromLive.js

100ms Room Kit provides simple & easy to use UI components to build Live Streaming & Video Conferencing experiences in your apps.

import React from 'react';
import { Platform, StyleSheet, Text } from 'react-native';
import { HMSHLSPlaylistType, useHMSHLSPlayerStat, useIsHLSStreamLive } from '@100mslive/react-native-hms';
import { useSelector } from 'react-redux';
import { useHMSRoomStyle } from '../hooks-util';
import { useIsHLSStreamingOn } from '../hooks-sdk';
export const _HLSDistanceFromLive = () => {
  const isHLSStreamingOn = useIsHLSStreamingOn();
  const isDVRStream = useSelector(state => {
    var _state$hmsStates$room;
    return ((_state$hmsStates$room = state.hmsStates.room) === null || _state$hmsStates$room === void 0 || (_state$hmsStates$room = _state$hmsStates$room.hlsStreamingState.variants) === null || _state$hmsStates$room === void 0 || (_state$hmsStates$room = _state$hmsStates$room[0]) === null || _state$hmsStates$room === void 0 ? void 0 : _state$hmsStates$room.playlistType) === HMSHLSPlaylistType.DVR;
  });
  const isStreamLive = useIsHLSStreamLive();
  if (!isHLSStreamingOn || !isDVRStream || isStreamLive) return null;
  return /*#__PURE__*/React.createElement(HLSDistanceFromLiveText, null);
};
export const HLSDistanceFromLiveText = /*#__PURE__*/React.memo(() => {
  const distanceFromLiveEdge = useHMSHLSPlayerStat('distanceFromLive');
  const textStyle = useHMSRoomStyle((_, typography) => ({
    fontFamily: `${typography.font_family}-Regular`,
    color: '#ffffff'
  }));
  const hhmmss = msToHMS(distanceFromLiveEdge - Platform.select({
    default: 10000,
    ios: 1000
  }));
  return /*#__PURE__*/React.createElement(Text, {
    style: [styles.text, textStyle]
  }, "-", hhmmss);
});
export const HLSDistanceFromLive = /*#__PURE__*/React.memo(_HLSDistanceFromLive);
const styles = StyleSheet.create({
  text: {
    fontSize: 16,
    lineHeight: 24,
    letterSpacing: 0.5,
    marginLeft: 8
  }
});
function msToHMS(ms) {
  const seconds = Math.floor(ms / 1000 % 60);
  const minutes = Math.floor(ms / 1000 / 60 % 60);
  const hours = Math.floor(ms / 1000 / 3600 % 24);
  const humanized = [minutes > 0 ? minutes.toString().padStart(2, '0') : '0', seconds.toString().padStart(2, '0')];
  if (hours > 0) humanized.unshift(hours.toString().padStart(2, '0'));
  return humanized.join(':');
}
//# sourceMappingURL=HLSDistanceFromLive.js.map