From 3cf70771cb45cc16ec33ffe44e7a1a4799d8f395 Mon Sep 17 00:00:00 2001
From: Jules Laplace <julescarbon@gmail.com>
Date: Tue, 23 Jun 2020 23:18:07 +0200
Subject: adding web app base

---
 .../frontend/common/imageCrop.component.js         | 41 ++++++++++++++++++++++
 1 file changed, 41 insertions(+)
 create mode 100644 animism-align/frontend/common/imageCrop.component.js

(limited to 'animism-align/frontend/common/imageCrop.component.js')

diff --git a/animism-align/frontend/common/imageCrop.component.js b/animism-align/frontend/common/imageCrop.component.js
new file mode 100644
index 0000000..9cae850
--- /dev/null
+++ b/animism-align/frontend/common/imageCrop.component.js
@@ -0,0 +1,41 @@
+import React, { Component } from 'react';
+import { cropImage } from '../util'
+
+export default class ImageCrop extends Component {
+  state = {
+    cropURL: null
+  }
+
+  componentDidMount() {
+    const { url, crop } = this.props
+    this.crop(url, crop)
+  }
+
+  componentDidUpdate(prevProps) {
+    const { url, crop } = this.props
+    if (this.props.crop !== prevProps.crop) {
+      cropImage(url, crop).then(canvas =>{
+        const cropURL = canvas.toDataURL('image/jpeg', 0.8)
+        this.setState({ cropURL })
+      })
+    }
+  }
+
+  crop(url, crop) {
+    cropImage(url, crop).then(canvas =>{
+      const cropURL = canvas.toDataURL('image/jpeg', 0.8)
+      this.setState({ cropURL })
+    })
+  }
+
+
+  render() {
+    const { cropURL } = this.state
+    if (!cropURL) {
+      return null
+    }
+    return (
+      <img src={cropURL} className='preview' />
+    )
+  }
+}
-- 
cgit v1.2.3-70-g09d2