import React, { memo, useEffect } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import Results from "../components/TransistionResults";
import SingleResult from "../components/TransistionSingleResult";
import ReadySetGo from "../components/TransistionReadySetGo";
import Openning from "../components/TransistionOpenning";
import Closing from "../components/TransistionClosing";
import InstructionalVideo from "./InstructionalVideo";
import Tutorial from "./Tutorial";
import SplashPage from "./SplashPage";
import { FiAlertCircle } from 'react-icons/all';
import { nextTransition, resetResultsExercises, nextExercise, savePhysicalAssessmentsMetrics, getPrintScreen, goToWeeklyAssessment, repetingExercise } from "../store/rom/main";

var Main = function Main(props) {
  var dispatch = useDispatch();

  var _useSelector = useSelector(function (state) {
    return state.rom.main;
  }),
      user = _useSelector.user,
      tutorial = _useSelector.tutorial,
      splash = _useSelector.splash,
      currentExercise = _useSelector.currentExercise,
      currentTransition = _useSelector.currentTransition,
      finishedExercises = _useSelector.finishedExercises,
      resultsExercises = _useSelector.resultsExercises,
      exercises = _useSelector.exercises,
      paused = _useSelector.paused,
      pose = _useSelector.pose,
      identifier = _useSelector.identifier,
      gallery = _useSelector.gallery,
      assessment = _useSelector.assessment,
      session = _useSelector.session,
      isRepetingExercise = _useSelector.isRepetingExercise,
      bodyPartsNotVisible = _useSelector.bodyPartsNotVisible;

  var onNextTransition = function onNextTransition() {
    dispatch(nextTransition());
  };

  var onRepeatExercise = function onRepeatExercise() {
    dispatch(repetingExercise(true));
  };

  var onResetResultExercises = function onResetResultExercises() {
    dispatch(resetResultsExercises());
  };

  var onSavePhysicalAssessmentsMetrics = function onSavePhysicalAssessmentsMetrics() {
    dispatch(savePhysicalAssessmentsMetrics({
      session: session.id,
      identifier: identifier,
      user: user,
      anonymous: true,
      metrics: {
        exercise: currentExercise._id,
        value: pose.angleResult,
        printscreen: getPrintScreen()
      }
    }));
  };

  var onWeeklyAssessment = function onWeeklyAssessment() {
    dispatch(goToWeeklyAssessment());
  }; // useEffect(()=>{
  // },[bodyPartsNotVisible])


  useEffect(function () {
    if (isRepetingExercise && !paused) {
      onNextTransition();
    }
  }, [isRepetingExercise, paused]);
  useEffect(function () {
    if (!splash.isOpened && !tutorial.isOpened && !paused && !gallery.isOpened && !assessment.isOpened && !isRepetingExercise && currentTransition === -1 && exercises.length > 0) {
      dispatch(nextExercise());
      onNextTransition();
    }
  }, [tutorial, currentTransition, finishedExercises.finished, paused, isRepetingExercise]);
  return /*#__PURE__*/React.createElement(React.Fragment, null, tutorial.isOpened && /*#__PURE__*/React.createElement(Tutorial, null), splash.isOpened && /*#__PURE__*/React.createElement(SplashPage, {
    onNextTransition: onNextTransition
  }), (currentTransition === 0 || currentTransition === 1) && /*#__PURE__*/React.createElement(InstructionalVideo, {
    onNextTransition: onNextTransition
  }), bodyPartsNotVisible.part1 !== null && bodyPartsNotVisible.part3 !== null && bodyPartsNotVisible.part3 !== null && /*#__PURE__*/React.createElement("div", {
    className: "body-parts-alert"
  }, /*#__PURE__*/React.createElement("span", {
    className: "alert-icon"
  }, /*#__PURE__*/React.createElement(FiAlertCircle, {
    width: 50,
    height: 50
  })), /*#__PURE__*/React.createElement("span", {
    className: "alert-text"
  }, /*#__PURE__*/React.createElement("h1", null, "You're too close to the camera. Please step back so your entire body appears in the video."))), currentTransition === 1 && /*#__PURE__*/React.createElement(ReadySetGo, {
    isPaused: paused,
    onNextTransition: onNextTransition,
    onSavePhysicalAssessmentsMetrics: onSavePhysicalAssessmentsMetrics
  }), currentTransition === 2 && /*#__PURE__*/React.createElement(Closing, {
    isPaused: paused,
    onNextTransition: onNextTransition
  }), currentTransition === 3 && /*#__PURE__*/React.createElement(SingleResult, {
    isPaused: paused,
    onNextTransition: onNextTransition,
    exercise: currentExercise,
    resultsExercises: resultsExercises,
    onRepeatExercise: onRepeatExercise
  }), currentTransition === 4 && /*#__PURE__*/React.createElement(Openning, {
    isPaused: paused,
    onNextTransition: onNextTransition
  }), finishedExercises.isOpened && finishedExercises.finished && /*#__PURE__*/React.createElement(Results, {
    resultsExercises: resultsExercises,
    onResetResultExercises: onResetResultExercises,
    onWeeklyAssessment: onWeeklyAssessment
  }), props.children);
};

export default memo(Main);