import React, { useEffect, useRef, memo } from 'react';
import { PoseEstimationController } from "../../controller";
import Loading from "../Loading";

var VideoPoseEstimator = function VideoPoseEstimator(props) {
  var canvasRef = useRef(null);
  var videoRef = useRef(null);

  var onInitHandler = function onInitHandler() {// setShowLoading(false);
  };

  useEffect(function () {
    var poseEstimator = new PoseEstimationController(canvasRef.current, videoRef.current, onInitHandler, props);
    poseEstimator.onInit();
    poseEstimator.holistic.updateProps(props);
  }, [props.currentExercise, props.facingMode]);
  return /*#__PURE__*/React.createElement("div", {
    id: "video",
    className: "main-video"
  }, props.loading && /*#__PURE__*/React.createElement(Loading, null), /*#__PURE__*/React.createElement("video", {
    id: "videoNoShow",
    style: {
      display: 'none'
    },
    playsInline: true,
    ref: videoRef
  }), /*#__PURE__*/React.createElement("canvas", {
    id: "canvas",
    ref: canvasRef,
    width: "1280px",
    height: "720px"
  }));
};

export default memo(VideoPoseEstimator);