"use strict";

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

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

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

var _ModalExerciseDetails = _interopRequireDefault(require("./ModalExerciseDetails"));

var _ErrorMessage = _interopRequireDefault(require("../../components/ErrorMessage"));

var _EmptyData = _interopRequireDefault(require("../../components/EmptyData"));

var _antd = require("antd");

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

var _icons = require("@ant-design/icons");

require("./style.css");

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

var _main = require("../../store/rehab/main");

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; }

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

function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }

function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }

var Search = _antd.Input.Search;
var Option = _antd.Select.Option;

var antIcon = /*#__PURE__*/_react["default"].createElement(_icons.LoadingOutlined, {
  style: {
    fontSize: '50px',
    color: '#6b2ba0'
  },
  spin: true,
  twoToneColor: "#52c41a"
});

var playIcon = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM9.5 16.5v-9l7 4.5-7 4.5z';
var pauseIcon = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14H9V8h2v8zm4 0h-2V8h2v8z';

var Library = function Library(props) {
  var _libraryVideos$docs, _libraryVideos$docs2, _objectToSave$videos;

  var dispatch = (0, _reactRedux.useDispatch)();

  var _useSelector = (0, _reactRedux.useSelector)(function (state) {
    return state.rehab.main;
  }),
      libraryVideos = _useSelector.libraryVideos,
      objectToSave = _useSelector.objectToSave,
      users = _useSelector.users,
      physioterapist = _useSelector.physioterapist,
      errorMessage = _useSelector.errorMessage;

  var _useState = (0, _react.useState)(false),
      isModalExerciseDetailsVisible = _useState[0],
      setIsModalExerciseDetailsVisible = _useState[1]; // const [isModalConfirmeRangeDateVisible, setIsModalConfirmeRangeDateVisible] =
  //   useState(false);


  var _useState2 = (0, _react.useState)(null),
      contentType = _useState2[0],
      setContentType = _useState2[1];

  var handleOk = function handleOk() {
    setIsModalExerciseDetailsVisible(false);
  };

  var onChanceCheckbox = function onChanceCheckbox(e, id) {
    dispatch((0, _main.updateVideoOnObjectToSave)({
      checked: e.target.checked,
      values: {
        rehabLibraryId: id
      }
    }));
  };

  var handleCancel = function handleCancel() {
    setIsModalExerciseDetailsVisible(false);
  };

  var showModal = function showModal(value, id) {
    if (id === void 0) {
      id = null;
    }

    dispatch((0, _main.setSelectedVideoId)(id));
    setContentType(value);
    setIsModalExerciseDetailsVisible(true);
  };

  var confirm = function confirm(id) {
    dispatch((0, _main.deleteVideoFromLibrary)(id));
  };

  var onClickSend = /*#__PURE__*/function () {
    var _ref = _asyncToGenerator( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
      var _yield$dispatch, payload;

      return _regenerator["default"].wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              dispatch((0, _main.cleanErrorMessage)());
              _context.next = 3;
              return dispatch((0, _main.savePhysioterapistVideoToPatient)(objectToSave));

            case 3:
              _yield$dispatch = _context.sent;
              payload = _yield$dispatch.payload;

              if ((payload === null || payload === void 0 ? void 0 : payload.status) !== 400) {
                dispatch((0, _main.initSequence)());
              }

            case 6:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    return function onClickSend() {
      return _ref.apply(this, arguments);
    };
  }(); // const onFilterLibrary = (filter, object, page = 1) => {
  //   if (filter === 'default')
  //     return dispatch(
  //       getVideoFromLibrary(`${physioterapist}?page=${page}&default=true`)
  //     );
  //   if (filter === 'personal')
  //     return dispatch(
  //       getVideoFromLibrary(`${physioterapist}?page=${page}&default=false`)
  //     );
  //   return dispatch(getVideoFromLibrary(`${physioterapist}?page=${page}`));
  // };


  var onSearchExerciseFromLibrary = function onSearchExerciseFromLibrary(title, page) {
    if (page === void 0) {
      page = 1;
    }

    dispatch((0, _main.getVideoFromLibrary)(physioterapist + "?page=" + page + "&title=" + title));
  };

  var tooglePlayPauseVideo = function tooglePlayPauseVideo(e, index) {
    var myVideo = document.getElementById('video_' + index);
    myVideo.paused ? myVideo.play() : myVideo.pause();
    document.getElementById(e.currentTarget.id).firstChild.lastChild.setAttribute('d', myVideo.paused ? pauseIcon : playIcon);
  };

  (0, _react.useEffect)(function () {
    if (physioterapist) dispatch((0, _main.getVideoFromLibrary)(physioterapist + "?page=1"));
  }, [physioterapist]);
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, errorMessage ? /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], {
    errorMessage: errorMessage
  }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
    className: "library"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "container"
  }, /*#__PURE__*/_react["default"].createElement("h1", {
    className: "library-title"
  }, "Rehab Library"), /*#__PURE__*/_react["default"].createElement("div", {
    className: "library-content"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Space, {
    direction: "vertical",
    size: 20
  }, /*#__PURE__*/_react["default"].createElement(_antd.Row, {
    className: "library-top"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 8
  }, /*#__PURE__*/_react["default"].createElement(Search, {
    className: "search-videos",
    placeholder: "Search an exercise",
    onSearch: onSearchExerciseFromLibrary,
    enterButton: true
  })), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
    span: 16
  }, /*#__PURE__*/_react["default"].createElement(_antd.Space, {
    direction: "horizontal",
    size: 20,
    align: "center",
    className: "library-actions"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    type: "primary",
    shape: "round",
    size: "large",
    onClick: function onClick() {
      showModal('general');
    }
  }, "Settings")))), /*#__PURE__*/_react["default"].createElement(_antd.Row, {
    gutter: [16, 8]
  }, (libraryVideos === null || libraryVideos === void 0 ? void 0 : (_libraryVideos$docs = libraryVideos.docs) === null || _libraryVideos$docs === void 0 ? void 0 : _libraryVideos$docs.length) == 0 ? /*#__PURE__*/_react["default"].createElement(_EmptyData["default"], null) : libraryVideos === null || libraryVideos === void 0 ? void 0 : (_libraryVideos$docs2 = libraryVideos.docs) === null || _libraryVideos$docs2 === void 0 ? void 0 : _libraryVideos$docs2.map(function (singleVideo, index) {
    var showSettingButton = objectToSave.videos.find(function (video) {
      return singleVideo._id === video.rehabLibraryId;
    });
    return /*#__PURE__*/_react["default"].createElement(_antd.Col, {
      span: 8,
      key: index
    }, /*#__PURE__*/_react["default"].createElement("div", {
      className: "exercise-video-content"
    }, (singleVideo === null || singleVideo === void 0 ? void 0 : singleVideo.processing) ? /*#__PURE__*/_react["default"].createElement(_antd.Result, {
      className: "result" // icon={<RiVideoUploadFill size="50px" />}
      ,
      icon: antIcon,
      title: "processing",
      style: {
        color: '#FFF'
      }
    }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("video", {
      id: 'video_' + index,
      audio: "false",
      className: "exercise-video",
      loop: true,
      muted: true,
      preload: "metadata",
      src: singleVideo.videoUrl,
      type: "video/mp4"
    }), /*#__PURE__*/_react["default"].createElement(_antd.Button, {
      id: 'btn_' + index,
      className: "toogle-play-pause-video",
      type: "link",
      icon: /*#__PURE__*/_react["default"].createElement(_all.MdPlayCircle, {
        size: "50px"
      }),
      onClick: function onClick(e) {
        return tooglePlayPauseVideo(e, index);
      }
    })), /*#__PURE__*/_react["default"].createElement("div", {
      className: "video-footer"
    }, /*#__PURE__*/_react["default"].createElement("h3", null, singleVideo.title), /*#__PURE__*/_react["default"].createElement(_antd.Checkbox, {
      className: "check-exercise",
      onChange: function onChange(e) {
        onChanceCheckbox(e, singleVideo._id);
      }
    })), /*#__PURE__*/_react["default"].createElement("div", {
      className: "video-actions"
    }, /*#__PURE__*/_react["default"].createElement(_antd.Space, {
      style: {
        width: '100%'
      }
    }, showSettingButton && /*#__PURE__*/_react["default"].createElement(_antd.Button, {
      type: "link",
      shape: "circle",
      icon: /*#__PURE__*/_react["default"].createElement(_all.FaCog, {
        size: "22px"
      }),
      onClick: function onClick() {
        showModal('single', singleVideo._id);
      }
    }), /*#__PURE__*/_react["default"].createElement(_antd.Popconfirm, {
      title: "Are you sure to delete this exercise? This will delete for all users assigned to this exercise!",
      onConfirm: function onConfirm() {
        confirm(singleVideo._id);
      },
      overlayStyle: {
        width: '300px'
      },
      okText: "Yes",
      cancelText: "No"
    }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
      type: "link",
      shape: "circle",
      icon: /*#__PURE__*/_react["default"].createElement(_all.IoMdTrash, {
        size: "22px"
      })
    }))))));
  }))))), /*#__PURE__*/_react["default"].createElement(_ModalExerciseDetails["default"], {
    isModalExerciseDetailsVisible: isModalExerciseDetailsVisible,
    handleOk: handleOk,
    handleCancel: handleCancel,
    contentType: contentType
  })), /*#__PURE__*/_react["default"].createElement("div", {
    className: "library-footer"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
    type: "primary",
    shape: "round",
    size: "large",
    onClick: function onClick() {
      showModal('new');
    }
  }, "Record New Exercise"), /*#__PURE__*/_react["default"].createElement(_antd.Button // type='primary'
  , {
    shape: "round",
    size: "large",
    className: "btn-solid-green",
    onClick: onClickSend,
    disabled: (users === null || users === void 0 ? void 0 : users.length) > 0 && (objectToSave === null || objectToSave === void 0 ? void 0 : (_objectToSave$videos = objectToSave.videos) === null || _objectToSave$videos === void 0 ? void 0 : _objectToSave$videos.length) > 0 ? false : true
  }, "Send"))));
};

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