function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import React, { Component } from "react";
import { View, Image, Animated, StyleSheet } from "react-native";
import { connect } from "react-redux";
import moment from "moment";
import { findLandmarkRange, getScaledOffset, get300, detectFaces } from "../helper";
import { saveImagePosition } from "../actions";
class AutoOffsetImage extends Component {
  constructor(props) {
    super(props);
    _defineProperty(this, "onLoad", event => {
      if (event.nativeEvent.source.uri !== this.props.uri) {
        this.setState({
          imageSource: this.props.uri
        });
      }
      // if (event.nativeEvent.source.uri === this.props.uri && !this.state.imageLoaded) {
      //   //unblur
      //   this.setState({
      //     imageLoaded: true,
      //   });
      //   Animated.sequence([
      //     Animated.delay(200),
      //     Animated.timing(this.state.blurRadius, {
      //       toValue: 0,
      //       duration: 500,
      //       useNativeDriver: false,
      //     }),
      //   ]).start();
      // }
    });
    _defineProperty(this, "positionImage", async () => {
      if (this.state.disabled) {
        return;
      }
      try {
        const startTime = moment().valueOf();
        let cachedValues;
        // check local cache
        if (this.props.imagePositions && this.props.imagePositions[this.props.uri]) {
          cachedValues = this.props.imagePositions[this.props.uri];
        }
        // check remote cache
        if (!cachedValues) {
          try {
            const response = await stringActions.getString("plussSpace", `imagefaces_${encodeURIComponent(this.props.uri)}`);
            cachedValues = response.data;
          } catch (e) {
            console.log("errored from cache");
          }
          // run face detection locally
          if (!cachedValues || !cachedValues.faces || !cachedValues.image || _.isEmpty(cachedValues.faces) && moment().add(-1, "w").valueOf() > moment(cachedValues.timestamp).valueOf()) {
            cachedValues = await detectFaces(this.props.uri);
          }
          this.props.saveImagePosition(this.props.uri, cachedValues);
        }
        const image = await findLandmarkRange(this.props.uri, {
          targetWidth: this.props.width,
          targetHeight: this.props.height,
          cachedValues
        });
        const scaledOffset = getScaledOffset(image.width, image.height, this.props.width, this.props.height);
        const {
          start: landmarkStart,
          end: landmarkEnd
        } = image;
        const {
          bounds: imageBounds,
          offset,
          width,
          height
        } = scaledOffset;
        if (landmarkStart.y < imageBounds.start.y) {
          // move up
          offset.y = -Math.max(landmarkStart.y - this.props.height * this.paddingFactor, 0); // move top to 5% above start of landmark
        } else if (landmarkEnd.y > imageBounds.end.y) {
          // move down
          offset.y = -Math.max(landmarkEnd.y + this.props.height * this.paddingFactor - this.props.height, 0); // move bottom to 5% below end of landmark
        }
        if (landmarkStart.x < imageBounds.start.x) {
          // move right
          offset.x = -Math.max(landmarkStart.x - this.props.width * this.paddingFactor, 0); // move left edge to 5% left of start of landmark
        } else if (landmarkEnd.x > imageBounds.end.x) {
          // move left
          offset.x = -Math.max(landmarkEnd.x + this.props.width * this.paddingFactor - this.props.width, 0); // move right edge to 5% left of end of landmark
        }
        this.setState({
          imageStyle: {
            width,
            height,
            top: offset.y,
            left: offset.x
          },
          imageSource: this.props.uri
        });
        const endTime = moment().valueOf();
        if (endTime - startTime < 500) {
          Animated.timing(this.state.blurRadius, {
            toValue: 0,
            duration: 0,
            useNativeDriver: false
          }).start();
        }
      } catch (e) {
        this.setState({
          imageSource: this.props.uri
        });
      }
    });
    this.paddingFactor = this.props.paddingFactor || 0.1;
    this.state = {
      imageStyle: {
        width: this.props.width,
        height: this.props.height
      },
      blurRadius: new Animated.Value(100),
      imageSource: get300(this.props.uri),
      disabled: true
    };
  }
  componentDidMount() {
    this.positionImage();
  }
  componentDidUpdate(prevProps) {
    if (prevProps.uri !== this.props.uri || prevProps.height !== this.props.height || prevProps.width !== this.props.width) {
      this.positionImage();
    }
  }
  render() {
    if (this.state.disabled) {
      return /*#__PURE__*/React.createElement(View, {
        style: [styles.container, {
          width: this.props.width,
          height: this.props.height
        }, this.props.style]
      }, /*#__PURE__*/React.createElement(Image, {
        source: {
          uri: this.state.imageSource
        },
        style: [styles.image, this.state.imageStyle],
        onLoad: this.onLoad
      }), this.props.children);
    }
    return /*#__PURE__*/React.createElement(View, {
      style: [styles.container, {
        width: this.props.width,
        height: this.props.height
      }, this.props.style]
    }, /*#__PURE__*/React.createElement(Animated.Image, {
      blurRadius: this.state.blurRadius,
      source: {
        uri: this.state.imageSource
      },
      style: [styles.image, this.state.imageStyle],
      onLoad: this.onLoad
    }), this.props.children);
  }
}
const styles = StyleSheet.create({
  container: {
    overflow: "hidden"
  },
  image: {
    position: "absolute",
    top: 0,
    left: 0,
    resizeMode: "cover"
  },
  staticImage: {
    resizeMode: "cover"
  }
});
const mapStateToProps = state => {
  return {
    imagePositions: state.media.positions
  };
};
const autoOffsetImage = connect(mapStateToProps, {
  saveImagePosition
})(AutoOffsetImage);
export { autoOffsetImage as AutoOffsetImage };
//# sourceMappingURL=AutoOffsetImage.js.map