"use strict";

require("core-js/modules/es.object.define-property.js");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.RoomScreenShareStateBar = void 0;
require("core-js/modules/es.array.concat.js");
require("core-js/modules/web.timers.js");
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _reactRnd = require("react-rnd");
var _react = require("react");
var _transferPositionIcon = require("./transfer-position-icon");
var _shareActionNav = require("./share-action-nav");
var _shareStateNav = require("./share-state-nav");
require("./index.css");
var _jsxRuntime = require("react/jsx-runtime");
var RoomScreenShareStateBar = exports.RoomScreenShareStateBar = function RoomScreenShareStateBar() {
  var NAV_HEIGHT = 84;
  var HIDDEN_TIMEOUT = 3000;
  var MAX_Y = window.innerHeight - NAV_HEIGHT;
  var _useState = (0, _react.useState)(_transferPositionIcon.TransferPosition.TOP),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    navCurrentPosition = _useState2[0],
    setNavCurrentPosition = _useState2[1];
  var _useState3 = (0, _react.useState)(0),
    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
    currentCoordinateX = _useState4[0],
    setCurrentCoordinateX = _useState4[1];
  var _useState5 = (0, _react.useState)(0),
    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
    currentCoordinateY = _useState6[0],
    setCurrentCoordinateY = _useState6[1];
  var _useState7 = (0, _react.useState)(false),
    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
    showTransferAnimation = _useState8[0],
    setShowTransferAnimation = _useState8[1];
  var _useState9 = (0, _react.useState)(false),
    _useState0 = (0, _slicedToArray2["default"])(_useState9, 2),
    hiddenShareActionNav = _useState0[0],
    setHiddenShareActionNav = _useState0[1];
  var rndRef = (0, _react.useRef)(null);
  var hideTimeout = (0, _react.useRef)(0);
  var handlerShareNavTransferPosition = function handlerShareNavTransferPosition(targetPosition) {
    setShowTransferAnimation(true);
    setNavCurrentPosition(targetPosition);
    setCurrentCoordinateY(targetPosition === _transferPositionIcon.TransferPosition.TOP ? 0 : MAX_Y);
  };
  var handleDragStop = function handleDragStop(_, data) {
    setShowTransferAnimation(false);
    setCurrentCoordinateX(data.x);
    setCurrentCoordinateY(data.y);
    if (data.y === MAX_Y || data.y > MAX_Y) {
      setNavCurrentPosition(_transferPositionIcon.TransferPosition.BOTTOM);
    } else if (data.y === 0 || data.y < 0) {
      setNavCurrentPosition(_transferPositionIcon.TransferPosition.TOP);
    }
  };
  var handleMouseEnter = function handleMouseEnter() {
    console.log('handleMouseEnter');
    clearTimeout(hideTimeout.current);
    setHiddenShareActionNav(false);
  };
  var handleMouseLeave = function handleMouseLeave() {
    hideTimeout.current = window.setTimeout(function () {
      setHiddenShareActionNav(true);
    }, HIDDEN_TIMEOUT);
  };
  (0, _react.useEffect)(function () {
    if (rndRef.current) {
      var width = rndRef.current.offsetWidth;
      var x = window.innerWidth / 2 - width / 2;
      setCurrentCoordinateX(x);
    }
  }, [rndRef]);
  console.log('useEffect', currentCoordinateX, currentCoordinateY, 'innerHeight', window.innerHeight, 'MAX_Y', MAX_Y);
  (0, _react.useEffect)(function () {
    handleMouseLeave();
    return function () {
      clearTimeout(hideTimeout.current);
    };
  }, []);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRnd.Rnd, {
    style: {
      transition: showTransferAnimation ? '0.2s' : '0s'
    },
    bounds: "window",
    allowAnyClick: false,
    cancel: ".share-action-nav__not-draggable",
    dragHandleClassName: "share-action-nav__can-draggable",
    enableUserSelectHack: true,
    enableResizing: false,
    "default": {
      x: currentCoordinateX,
      y: currentCoordinateY,
      width: 'auto',
      height: NAV_HEIGHT
    },
    onDragStop: handleDragStop,
    position: {
      x: currentCoordinateX,
      y: currentCoordinateY
    },
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      ref: rndRef,
      onMouseEnter: handleMouseEnter,
      onMouseLeave: handleMouseLeave,
      className: "fcr-flex  ".concat(navCurrentPosition === _transferPositionIcon.TransferPosition.BOTTOM ? 'share-action-nav__move_to_bottom' : 'share-action-nav__move_to_top', "\n    ").concat(hiddenShareActionNav && currentCoordinateY === MAX_Y && 'completely-hidden-in-bottom', "\n    ").concat(hiddenShareActionNav && currentCoordinateY === 0 && 'completely-hidden-in-top', "\n    "),
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_shareActionNav.ShareActionNav, {
        className: "".concat(hiddenShareActionNav ? 'invisible' : '')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareStateNav.ShareStateNav, {
        onShareStateNavTransferPosition: handlerShareNavTransferPosition,
        currentPosition: navCurrentPosition
      })]
    })
  });
};