"use strict";

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

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

var _reactRedux = require("react-redux");

require("./style.css");

var _antd = require("antd");

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

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 Instruction = function Instruction(props) {
  var currentExercise = props.currentExercise,
      toogleInvertVideo = props.toogleInvertVideo;

  var _useState = (0, _react.useState)(true),
      toogleInstruction = _useState[0],
      setToogleInstruction = _useState[1];

  var contentInfo = currentExercise && /*#__PURE__*/_react["default"].createElement("div", {
    className: "info-box"
  }, /*#__PURE__*/_react["default"].createElement("p", null, currentExercise.description === 'undefined' ? 'no description.' : currentExercise.description));

  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, toogleInstruction === false && /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    className: "btn-show-instruction-video",
    type: "primary",
    size: "large",
    icon: /*#__PURE__*/_react["default"].createElement(_all.IoChevronForwardSharp, {
      size: "22px"
    }),
    onClick: function onClick() {
      return setToogleInstruction(!toogleInstruction);
    }
  }), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
    className: toogleInstruction ? 'instruction' : 'instruction hide'
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "instruction-container"
  }, props.children, /*#__PURE__*/_react["default"].createElement("svg", {
    viewBox: "0 0 589 350",
    version: "1.1"
  }, /*#__PURE__*/_react["default"].createElement("title", null, "Group 17"), /*#__PURE__*/_react["default"].createElement("g", {
    id: "Hud",
    stroke: "none",
    strokeWidth: "1",
    fill: "none",
    fillRule: "evenodd"
  }, /*#__PURE__*/_react["default"].createElement("g", {
    id: "overlay-template-copy-6",
    transform: "translate(-98.000000, -581.000000)",
    fill: "#FFFFFF"
  }, /*#__PURE__*/_react["default"].createElement("g", {
    id: "Group-17",
    transform: "translate(98.000000, 581.914062)"
  }, /*#__PURE__*/_react["default"].createElement("path", {
    d: "M-10,151.179687 L3.7109375,138 L76.7109375,138 L84.8554688,145.263672 L207.107422,145.263672 C207.107422,145.327049 208.119857,146.440981 210.144726,148.605469 C201.126785,148.991163 159.030365,148.991163 83.8554688,148.605469 L8.47070313,148.605469 L1,155.938477 L1,263.085937 L1,284.226563 L1,338.085938 L-2.04003906,335.02832 L-2.5,285.226563 L-10,277.626953 L-10,263.085937 L-10,151.179687 Z",
    id: "Rectangle",
    transform: "translate(100.072363, 238.042969) rotate(-90.000000) translate(-100.072363, -238.042969) "
  }), /*#__PURE__*/_react["default"].createElement("path", {
    d: "M378,24.1796875 L391.710937,11 L464.710938,11 L472.855469,18.2636719 L595.107422,18.2636719 C595.107422,18.3270492 596.119857,19.4409815 598.144726,21.6054688 C589.126785,21.9911629 547.030365,21.9911629 471.855469,21.6054688 L396.470703,21.6054688 L389,28.9384766 L389,136.085937 L389,157.226563 L389,211.085938 L385.959961,208.02832 L385.5,158.226563 L378,150.626953 L378,136.085937 L378,24.1796875 Z",
    id: "Rectangle",
    transform: "translate(488.072363, 111.042969) rotate(90.000000) translate(-488.072363, -111.042969) "
  }))))), /*#__PURE__*/_react["default"].createElement("div", {
    className: "instruction-actions"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Space, {
    style: {
      width: '100%'
    }
  }, toogleInvertVideo && /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    type: "link",
    shape: "circle",
    icon: /*#__PURE__*/_react["default"].createElement(_all.MdFlipCameraAndroid, {
      size: "22px"
    }),
    onClick: toogleInvertVideo
  }), currentExercise && /*#__PURE__*/_react["default"].createElement(_antd.Popover, {
    placement: "topLeft",
    content: contentInfo,
    title: currentExercise.title
  }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    type: "link",
    shape: "circle",
    icon: /*#__PURE__*/_react["default"].createElement(_all.MdInfo, {
      size: "22px"
    })
  })), /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    type: "link",
    shape: "circle",
    icon: /*#__PURE__*/_react["default"].createElement(_all.FaEyeSlash, {
      size: "22px"
    }),
    onClick: function onClick() {
      return setToogleInstruction(!toogleInstruction);
    }
  }))), currentExercise && /*#__PURE__*/_react["default"].createElement("div", {
    className: "info-instruction"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Row, null, /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 6
  }, /*#__PURE__*/_react["default"].createElement("h1", null, "weekly: "), currentExercise.frequencyPerWeek, "x"), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 6
  }, /*#__PURE__*/_react["default"].createElement("h1", null, "daily: "), currentExercise.setsPerDay, "x"), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 6
  }, /*#__PURE__*/_react["default"].createElement("h1", null, "sets: "), currentExercise.setsPerSessions, "x"), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 6
  }, /*#__PURE__*/_react["default"].createElement("h1", null, "reps: "), currentExercise.repetitions, "x")))))));
};

var _default = (0, _react.memo)(Instruction);

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