"use strict";

exports.__esModule = true;
exports.default = void 0;
var _get2 = _interopRequireDefault(require("lodash/fp/get"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _classnames = _interopRequireDefault(require("classnames"));
var _novaIcons = require("@coorpacademy/nova-icons");
var _provider = _interopRequireDefault(require("../../atom/provider"));
var _style = _interopRequireDefault(require("./style.css"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
class Audio extends _react.default.Component {
  static contextTypes = {
    skin: _provider.default.childContextTypes.skin
  };
  constructor(props, context) {
    super(props, context);
    this.handlePlay = this.handlePlay.bind(this);
    this.audioElement = null;
    this.setAudio = this.setAudio.bind(this);
  }
  shouldComponentUpdate(nextProps) {
    const {
      mediaUrl
    } = this.props;
    return nextProps.mediaUrl !== mediaUrl;
  }
  componentDidUpdate() {
    this.audioElement.load();
  }
  setAudio = element => {
    this.audioElement = element;
  };
  handlePlay(e) {
    const {
      onPlay
    } = this.props;
    if (onPlay) onPlay(e);
  }
  render() {
    const {
      description,
      mediaUrl,
      poster
    } = this.props;
    const {
      skin
    } = this.context;
    const white = (0, _get2.default)('common.white', skin);
    return /*#__PURE__*/_react.default.createElement("div", {
      className: _style.default.frame,
      style: {
        backgroundImage: `url(${poster})`
      }
    }, /*#__PURE__*/_react.default.createElement(_novaIcons.NovaCompositionCoorpacademyMicrophone, {
      style: {
        color: white
      },
      className: _style.default.icon
    }), description ? /*#__PURE__*/_react.default.createElement("div", {
      className: (0, _classnames.default)(_style.default.description, _style.default.innerHTML),
      "data-name": "audioDescription"
      // eslint-disable-next-line react/no-danger
      ,
      dangerouslySetInnerHTML: {
        __html: description
      }
    }) : null, /*#__PURE__*/_react.default.createElement("audio", {
      className: _style.default.audio,
      controls: true,
      controlsList: "nodownload",
      ref: this.setAudio,
      autoPlay: "",
      onPlay: this.handlePlay,
      name: "media",
      "data-testid": "audio",
      "data-name": "audio",
      preload: "auto"
    }, /*#__PURE__*/_react.default.createElement("source", {
      src: mediaUrl
    })));
  }
}
Audio.propTypes = process.env.NODE_ENV !== "production" ? {
  description: _propTypes.default.string,
  mediaUrl: _propTypes.default.string,
  poster: _propTypes.default.string,
  onPlay: _propTypes.default.func
} : {};
var _default = exports.default = Audio;
//# sourceMappingURL=index.js.map