"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.KioskControls = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _eui = require("@elastic/eui");
var _i18n = require("@kbn/i18n");
var _time_duration = require("../../../lib/time_duration");
var _i18n2 = require("../../../../i18n");
var _custom_interval = require("./custom_interval");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (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; }
/*
 * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
 * or more contributor license agreements. Licensed under the Elastic License
 * 2.0; you may not use this file except in compliance with the Elastic License
 * 2.0.
 */

const {
  time: timeStrings
} = _i18n2.UnitStrings;
const {
  getSecondsText,
  getMinutesText
} = timeStrings;
const strings = {
  getCycleFormLabel: () => _i18n.i18n.translate('xpack.canvas.workpadHeaderKioskControl.cycleFormLabel', {
    defaultMessage: 'Change cycling interval'
  }),
  getTitle: () => _i18n.i18n.translate('xpack.canvas.workpadHeaderKioskControl.controlTitle', {
    defaultMessage: 'Cycle fullscreen pages'
  }),
  getAutoplayListDurationManualText: () => _i18n.i18n.translate('xpack.canvas.workpadHeaderKioskControl.autoplayListDurationManual', {
    defaultMessage: 'Manually'
  }),
  getDisableTooltip: () => _i18n.i18n.translate('xpack.canvas.workpadHeaderKioskControl.disableTooltip', {
    defaultMessage: 'Disable auto-play'
  })
};
const ListGroup = ({
  children,
  ...rest
}) => /*#__PURE__*/_react.default.createElement("ul", (0, _extends2.default)({
  style: {
    listStyle: 'none',
    margin: 0
  }
}, rest), [children]);
const generateId = (0, _eui.htmlIdGenerator)();
const KioskControls = ({
  autoplayInterval,
  onSetInterval
}) => {
  const disableAutoplay = (0, _react.useCallback)(() => {
    onSetInterval(0);
  }, [onSetInterval]);
  const RefreshItem = ({
    duration,
    label,
    descriptionId
  }) => /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_eui.EuiLink, {
    onClick: () => onSetInterval(duration),
    "aria-describedby": descriptionId
  }, label));
  const interval = (0, _time_duration.timeDuration)(autoplayInterval);
  const intervalTitleId = generateId();
  return /*#__PURE__*/_react.default.createElement(_eui.EuiFlexGroup, {
    direction: "column",
    justifyContent: "spaceBetween",
    className: "canvasViewMenu__kioskSettings"
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, {
    grow: false
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiFlexGroup, {
    alignItems: "center",
    justifyContent: "spaceAround",
    gutterSize: "xs"
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, null, /*#__PURE__*/_react.default.createElement(_eui.EuiDescriptionList, {
    textStyle: "reverse"
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiDescriptionListTitle, null, strings.getTitle()), /*#__PURE__*/_react.default.createElement(_eui.EuiDescriptionListDescription, null, autoplayInterval > 0 ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, timeStrings.getCycleTimeText(interval.length, interval.format)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, strings.getAutoplayListDurationManualText())))), /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, {
    grow: false
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiFlexGroup, {
    justifyContent: "flexEnd",
    gutterSize: "xs"
  }, autoplayInterval > 0 ? /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, {
    grow: false
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiToolTip, {
    position: "bottom",
    content: strings.getDisableTooltip()
  }, /*#__PURE__*/_react.default.createElement(_eui.EuiButtonIcon, {
    iconType: "cross",
    onClick: disableAutoplay,
    "aria-label": strings.getDisableTooltip()
  }))) : null))), /*#__PURE__*/_react.default.createElement(_eui.EuiHorizontalRule, {
    margin: "m"
  }), /*#__PURE__*/_react.default.createElement(_eui.EuiTitle, {
    size: "xxxs",
    id: intervalTitleId
  }, /*#__PURE__*/_react.default.createElement("p", null, strings.getCycleFormLabel())), /*#__PURE__*/_react.default.createElement(_eui.EuiSpacer, {
    size: "s"
  }), /*#__PURE__*/_react.default.createElement(_eui.EuiText, {
    size: "s"
  }, /*#__PURE__*/_react.default.createElement(ListGroup, {
    "aria-labelledby": intervalTitleId,
    className: "canvasControlSettings__list"
  }, /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 5000,
    label: getSecondsText(5),
    descriptionId: intervalTitleId
  }), /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 10000,
    label: getSecondsText(10),
    descriptionId: intervalTitleId
  }), /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 30000,
    label: getSecondsText(30),
    descriptionId: intervalTitleId
  }), /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 60000,
    label: getMinutesText(1),
    descriptionId: intervalTitleId
  }), /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 300000,
    label: getMinutesText(5),
    descriptionId: intervalTitleId
  }), /*#__PURE__*/_react.default.createElement(RefreshItem, {
    duration: 900000,
    label: getMinutesText(15),
    descriptionId: intervalTitleId
  })))), /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, {
    grow: false
  }, /*#__PURE__*/_react.default.createElement(_custom_interval.CustomInterval, {
    onSubmit: value => onSetInterval(value)
  })));
};
exports.KioskControls = KioskControls;
KioskControls.propTypes = {
  autoplayInterval: _propTypes.default.number.isRequired,
  onSetInterval: _propTypes.default.func.isRequired
};