"use strict";

exports.__esModule = true;
exports["default"] = void 0;

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

var _reactVideoRecorder = _interopRequireDefault(require("react-video-recorder"));

var _all = require("react-icons/all");

var _timer = _interopRequireDefault(require("react-video-recorder/lib/defaults/timer"));

var _countdown = _interopRequireDefault(require("react-video-recorder/lib/defaults/countdown"));

require("./style.css");

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

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var VideoRecord = function VideoRecord(props) {
  var isInvertCam = props.isInvertCam,
      aspectArea = props.aspectArea;

  var _useState = (0, _react.useState)(null),
      videoBlob = _useState[0],
      setVideoBlob = _useState[1];

  var onRecording = function onRecording(value) {
    if (props === null || props === void 0 ? void 0 : props.onRecording) props.onRecording(value);
  };

  var onSubmit = function onSubmit(video) {
    props.onFinish(video);
  };

  (0, _react.useEffect)(function () {
    var supportedConstraints = navigator.mediaDevices.getSupportedConstraints();

    if (supportedConstraints.width && supportedConstraints.height && supportedConstraints.aspectRatio) {
      navigator.mediaDevices.getUserMedia({
        audio: true,
        video: {
          width: aspectArea === null || aspectArea === void 0 ? void 0 : aspectArea.width,
          height: aspectArea === null || aspectArea === void 0 ? void 0 : aspectArea.height,
          aspectRatio: {
            exact: 1.777777777777778,
            ideal: 1.777777777777778
          },
          resizeMode: 'crop-and-scale'
        }
      });
    }
  }, []);
  return console.log('aspectArea', aspectArea), /*#__PURE__*/_react["default"].createElement("div", {
    className: isInvertCam ? 'videoRecord inverted' : 'videoRecord',
    style: {
      width: (aspectArea === null || aspectArea === void 0 ? void 0 : aspectArea.width) + "px",
      height: (aspectArea === null || aspectArea === void 0 ? void 0 : aspectArea.height) + "px"
    }
  }, /*#__PURE__*/_react["default"].createElement(_reactVideoRecorder["default"], {
    isOnInitially: true,
    wrapperClassName: "video-record-item",
    timeLimit: 60000,
    onRecordingComplete: setVideoBlob,
    renderActions: function renderActions(_ref) {
      var isRecording = _ref.isRecording,
          isCameraOn = _ref.isCameraOn,
          streamIsReady = _ref.streamIsReady,
          isRunningCountdown = _ref.isRunningCountdown,
          isReplayingVideo = _ref.isReplayingVideo,
          countdownTime = _ref.countdownTime,
          timeLimit = _ref.timeLimit,
          onStartRecording = _ref.onStartRecording,
          onStopRecording = _ref.onStopRecording,
          onStopReplaying = _ref.onStopReplaying;
      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isRecording && /*#__PURE__*/_react["default"].createElement(_timer["default"], {
        timeLimit: timeLimit
      }), isRunningCountdown && /*#__PURE__*/_react["default"].createElement(_countdown["default"], {
        countdownTime: countdownTime
      }), isRecording && /*#__PURE__*/_react["default"].createElement("button", {
        className: "btn-stop-record btn-solid-red",
        onClick: function onClick() {
          onStopRecording();
        }
      }, /*#__PURE__*/_react["default"].createElement(_all.RiStopCircleLine, {
        className: "ri-icon",
        size: "16"
      }), "STOP"), isRecording == false && isRunningCountdown != true && isCameraOn && streamIsReady && /*#__PURE__*/_react["default"].createElement("button", {
        className: "btn-start-record btn-solid-green",
        onClick: function onClick() {
          onRecording(true);
          onStartRecording();
        }
      }, /*#__PURE__*/_react["default"].createElement(_all.RiRecordCircleLine, {
        className: "ri-icon",
        size: "16px"
      }), "RECORD"), isReplayingVideo && /*#__PURE__*/_react["default"].createElement("button", {
        className: "btn-delete-record btn-solid-red",
        onClick: function onClick() {
          onRecording(false);
          onStopReplaying();
          setVideoBlob();
        }
      }, /*#__PURE__*/_react["default"].createElement(_all.RiDeleteBin6Line, {
        className: "ri-icon",
        size: "16px"
      }), "DISCARD"), videoBlob && /*#__PURE__*/_react["default"].createElement("button", {
        className: "btn-submit-record btn-solid-green",
        onClick: function onClick() {
          onSubmit(videoBlob);
          onStopReplaying();
          setVideoBlob();
        }
      }, /*#__PURE__*/_react["default"].createElement(_all.BiRightArrowCircle, {
        className: "ri-icon",
        size: "20px"
      }), "SUBMIT"));
    }
  }));
};

var _default = VideoRecord;
exports["default"] = _default;
module.exports = exports.default;