@theoplayer/react-native-ui/lib/commonjs/ui/components/seekbar/useSlider.js

A React Native UI for @theoplayer/react-native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useSlider = void 0;
var _react = require("react");
var _reactNativeUi = require("@theoplayer/react-native-ui");
var _reactNativeTheoplayer = require("react-native-theoplayer");
const TIME_CHANGE_EVENTS = [_reactNativeTheoplayer.PlayerEventType.TIME_UPDATE, _reactNativeTheoplayer.PlayerEventType.SEEKED];

/**
 * Returns the player's current slider time, and its scrubbing state.
 *
 * This hook must only be used in a component mounted inside a {@link THEOplayerDefaultUi} or {@link UiContainer},
 * or alternatively any other component that provides a {@link PlayerContext}.
 **
 * @group Hooks
 */
const useSlider = () => {
  const {
    player
  } = (0, _react.useContext)(_reactNativeUi.PlayerContext);
  const [isScrubbing, setIsScrubbing] = (0, _react.useState)(false);
  const [currentTime, setCurrentTime] = (0, _react.useState)(player?.currentTime ?? 0);
  (0, _react.useEffect)(() => {
    if (!player) return;
    const onTimeUpdate = () => {
      if (isScrubbing) return;
      setCurrentTime(player.currentTime);
    };
    TIME_CHANGE_EVENTS.forEach(event => player.addEventListener(event, onTimeUpdate));
    return () => {
      TIME_CHANGE_EVENTS.forEach(event => player.removeEventListener(event, onTimeUpdate));
    };
  }, [player, isScrubbing]);
  return [Number.isFinite(currentTime) ? Math.round(currentTime * 1e-3) * 1e3 : 0, isScrubbing, setIsScrubbing];
};
exports.useSlider = useSlider;
//# sourceMappingURL=useSlider.js.map