react-native-video-basic-controls/lib/commonjs/Slider.js

Controls for the React Native <Video> component at react-native-video.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Slider = void 0;

var _react = _interopRequireDefault(require("react"));

var _reactNative = require("react-native");

var _MediaControls = _interopRequireDefault(require("./MediaControls.style"));

var _utils = require("./utils");

var _playerStates = require("./constants/playerStates");

var _SliderOP = _interopRequireDefault(require("./SliderOP"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const fullScreenImage = require('./assets/ic_fullscreen.png');

const Slider = props => {
  const {
    fullScreenIconL,
    fullScreenIconP,
    customSliderStyle,
    duration,
    bufferValue,
    mainColor,
    bufferColor,
    onFullScreen,
    isFullscreen,
    onPause,
    progress
  } = props;
  const fullScreenIcon = isFullscreen ? fullScreenIconL : fullScreenIconP;
  const containerStyle = (customSliderStyle === null || customSliderStyle === void 0 ? void 0 : customSliderStyle.containerStyle) || {};
  const customTrackStyle = (customSliderStyle === null || customSliderStyle === void 0 ? void 0 : customSliderStyle.trackStyle) || {};
  const customThumbStyle = (customSliderStyle === null || customSliderStyle === void 0 ? void 0 : customSliderStyle.thumbStyle) || {};

  const dragging = value => {
    const {
      onSeeking = () => {},
      playerState
    } = props;
    onSeeking(value);

    if (playerState === _playerStates.PLAYER_STATES.PAUSED) {
      return;
    }

    onPause();
  };

  const seekVideo = value => {
    props.onSeek(value);
    onPause();
  };

  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: [_MediaControls.default.controlsRow, _MediaControls.default.progressContainer, containerStyle]
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: _MediaControls.default.progressColumnContainer
  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: [_MediaControls.default.timerLabelsContainer]
  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
    style: _MediaControls.default.timerLabel
  }, (0, _utils.humanizeVideoDuration)(progress)), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
    style: _MediaControls.default.timerLabel
  }, (0, _utils.humanizeVideoDuration)(duration))), /*#__PURE__*/_react.default.createElement(_SliderOP.default, {
    style: [_MediaControls.default.progressSlider],
    onValueChange: dragging,
    onSlidingComplete: seekVideo,
    maximumValue: Math.floor(duration),
    value: Math.floor(progress),
    trackStyle: [_MediaControls.default.track, customTrackStyle],
    thumbStyle: [_MediaControls.default.thumb, customThumbStyle, {
      backgroundColor: mainColor
    }],
    minimumTrackTintColor: mainColor,
    bufferTrackTintColor: bufferColor,
    bufferValue: bufferValue
  })), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
    style: _MediaControls.default.fullScreenContainer,
    onPress: onFullScreen
  }, fullScreenIcon ? fullScreenIcon : /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
    source: fullScreenImage
  })));
};

exports.Slider = Slider;
//# sourceMappingURL=Slider.js.map