1 files changed, 60 insertions, 4 deletions
diff --git a/animism-align/frontend/views/media/components/media.formImage.js b/animism-align/frontend/views/media/components/media.formImage.js
index b3d227e..c757d03 100644
--- a/animism-align/frontend/views/media/components/media.formImage.js
+++ b/animism-align/frontend/views/media/components/media.formImage.js
@@ -4,7 +4,9 @@ import { Link } from 'react-router-dom'
 import { session } from '../../../session'
 import { capitalize } from '../../../util'
 
-import { TextInput, LabelDescription, Select, TextArea, Checkbox, SubmitButton, Loader } from '../../../common'
+import { TextInput, LabelDescription, FileInputField, Select, TextArea, Checkbox, SubmitButton, Loader } from '../../../common'
+
+import { ImageSelection } from './media.formImageSelection'
 
 export default class MediaImageForm extends Component {
   state = {
@@ -15,9 +17,7 @@ export default class MediaImageForm extends Component {
     this.handleSelect = this.handleSelect.bind(this)
     this.handleChange = this.handleChange.bind(this)
     this.handleSettingsChange = this.handleSettingsChange.bind(this)
-  }
-
-  componentDidMount() {
+    this.handleUpload = this.handleUpload.bind(this)
   }
 
   handleChange(e) {
@@ -33,11 +33,67 @@ export default class MediaImageForm extends Component {
     this.props.onSettingsChange(name, value)
   }
 
+  handleUpload(image) {
+    // upload fullsize
+    this.uploadFullSize(image)
+    .then(res => {
+      this.props.onSettingsChange('fullsize', data.res)
+      setTimeout(() => {
+      })     
+    })
+  }
+
+  uploadFullSize(image) {
+    actions.upload.upload({
+      image,
+      tag: 'fullsize',
+      username: 'animism',
+    }).then(data => {
+      console.log(data.res)
+      return data.res
+    })
+  }
+  
+  uploadThumbnail(image) {
+    actions.upload.upload({
+      image,
+      tag: 'thumbnail',
+      username: 'animism',
+    }).then(data => {
+      console.log(data.res)
+    })
+  }
+
+  uploadCrop(image) {
+    actions.upload.upload({
+      image,
+      tag: 'crop',
+      username: 'animism',
+    }).then(data => {
+      console.log(data.res)
+      this.props.onSelect('url', data.res.url)
+    })
+  }
+
   render() {
     const { data } = this.props
     console.log(data)
     return (
       <div className='imageForm'>
+        {!data.url &&
+          <FileInputField
+            title='Upload image'
+            onChange={this.handleUpload}
+          />
+        }
+        {data.settings.fullsize &&
+          <div>
+            <ImageSelection
+              url={data.settings.fullsize.url}
+              crop={data.settings.crop}
+            />
+          </div>
+        }
       </div>
     )
   }