"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.LiveDotIcon = void 0;

var _preact = require("preact");

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

const baseAnimation = [{
  opacity: 1,
  transform: 'scale(0)'
}, {
  opacity: 0.2,
  offset: 0.7
}, {
  opacity: 0,
  transform: 'scale(1)',
  color: '#000'
}];

class LiveDotIcon extends _preact.Component {
  constructor(props) {
    super(props);
  }

  setSpeed(newSpeed) {
    const circles = this.getCircles();
    this.currentSpeed = newSpeed;

    if (circles) {
      try {
        circles.forEach(circle => {
          const [animation] = circle.getAnimations();
          animation.updatePlaybackRate(newSpeed);
        });
      } catch (e) {// nothing
      }
    }
  }

  updateSpeed(newSpeed) {
    if (newSpeed !== this.currentSpeed) {
      this.setSpeed(newSpeed);
    }
  }

  componentDidMount() {
    this.startAnimation();
    this.setSpeed(this.props.speed);
  }

  shouldComponentUpdate(props) {
    if (props.size !== this.props.size) {
      return true;
    }

    return false;
  }

  UNSAFE_componentWillReceiveProps(props) {
    this.updateSpeed(props.speed);
  }

  getCircles() {
    return this.base && Array.prototype.slice.call(this.base.children);
  }

  startAnimation() {
    const circles = this.getCircles();

    if (circles) {
      try {
        circles.forEach((circle, i) => {
          circle.animate(baseAnimation, {
            duration: 3000,
            delay: i * (3000 / 3),
            iterations: Infinity,
            easing: 'ease-out'
          });
        });
      } catch (e) {// nothing
      }
    }
  }

  render() {
    const style = {
      transformOrigin: 'center'
    };

    const _this$props = this.props,
          {
      size = 24
    } = _this$props,
          rest = _objectWithoutProperties(_this$props, ["size"]);

    const usableSize = size * 0.98;
    const halfSize = usableSize / 2;
    const middle = size / 2;
    return (0, _preact.h)("svg", _extends({
      width: size,
      height: size
    }, rest), (0, _preact.h)("circle", {
      className: "o-0",
      style: style,
      cx: middle,
      cy: middle,
      r: halfSize
    }), (0, _preact.h)("circle", {
      className: "o-0",
      style: style,
      cx: middle,
      cy: middle,
      r: halfSize
    }), (0, _preact.h)("circle", {
      className: "o-0",
      style: style,
      cx: middle,
      cy: middle,
      r: halfSize
    }));
  }

}

exports.LiveDotIcon = LiveDotIcon;