"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _slateReact = require("slate-react");
var _reactImageLightbox = _interopRequireDefault(require("@seafile/react-image-lightbox"));
var _helper = require("../helper");
var _reactI18next = require("react-i18next");
var _constants = require("../../../../constants");
require("@seafile/react-image-lightbox/style.css");
require("./style.css");
const formatImageInfos = images => {
  const formatImages = images.map(src => {
    let name = '';
    try {
      name = src ? decodeURI(src.slice(src.lastIndexOf('/') + 1)).split(/[?？]/)[0] : '';
    } catch (error) {
      console.log('error', error);
      name = '';
    }
    return {
      name: name,
      thumbnail: src
    };
  });
  return formatImages;
};
const ImagePreviewer = _ref => {
  let {
    imgUrl,
    toggleImagePreviewer
  } = _ref;
  const editor = (0, _slateReact.useSlateStatic)();
  const originImages = (0, _helper.getImagesUrlList)(editor.children);
  const images = formatImageInfos(originImages);
  const {
    t
  } = (0, _reactI18next.useTranslation)(_constants.TRANSLATE_NAMESPACE);
  const [imageIndex, setImageIndex] = (0, _react.useState)(Math.max(0, images.findIndex(item => item.thumbnail === imgUrl)));
  const imagesLength = images.length;
  const imageItem = images[imageIndex];
  const imageName = imageItem ? imageItem.name : '';
  const mainSrc = imageItem ? imageItem.thumbnail : {};
  const nextImg = images[(imageIndex + 1) % images.length];
  const prevImg = images[(imageIndex + images.length - 1) % images.length];
  const moveToPrevImage = () => {
    const currentImageIndex = (imageIndex + images.length - 1) % images.length;
    setImageIndex(currentImageIndex);
  };
  const moveToNextImage = () => {
    const newImageIndex = (imageIndex + 1) % images.length;
    setImageIndex(newImageIndex);
  };
  return /*#__PURE__*/_react.default.createElement(_reactImageLightbox.default, {
    imageItems: images,
    currentIndex: imageIndex,
    setImageIndex: setImageIndex,
    wrapperClassName: "sf-editor-image-previewer",
    imageTitle: "".concat(imageName, " (").concat(imageIndex + 1, "/").concat(imagesLength, ")"),
    mainSrc: mainSrc,
    toolbarButtons: [],
    nextSrc: nextImg.thumbnail || nextImg.src,
    prevSrc: prevImg.thumbnail || prevImg.src,
    onCloseRequest: toggleImagePreviewer,
    reactModalProps: {
      shouldReturnFocusAfterClose: true,
      preventScroll: true
    },
    onMovePrevRequest: moveToPrevImage,
    onMoveNextRequest: moveToNextImage,
    imagePadding: 70,
    reactModalStyle: {
      overlay: {
        zIndex: 1071
      }
    },
    zoomInTip: t('Zoom_in'),
    zoomOutTip: t('Zoom_out'),
    closeTip: t('Close')
  });
};
var _default = exports.default = ImagePreviewer;