Small bug fixes: (#43)

- updates README with docs badge - fixes issue with null images in frontend
rvshi · May 1, 2018 · 30e6887 · 30e6887
1 parent 18dfab4
commit 30e6887
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 29 deletions.
diff --git a/README.md b/README.md
@@ -1,6 +1,7 @@
 # Image Processing Web Service
 
-[![Build Status](https://travis-ci.org/rvshi/ImageProcessorS18.svg?branch=master)](https://travis-ci.org/rvshi/ImageProcessorS18)
+[![Build Status](https://travis-ci.org/rvshi/ImageProcessorS18.svg?branch=master)](https://travis-ci.org/rvshi/ImageProcessorS18) [![Documentation Status](https://readthedocs.org/projects/image-processor-s18/badge/?version=latest)](http://image-processor-s18.readthedocs.io/en/latest/?badge=latest)
+
 
 __Team:__ 59ers
 

diff --git a/frontend/src/components/App.jsx b/frontend/src/components/App.jsx
@@ -81,12 +81,13 @@ class App extends Component {
           this.notify('Username or password are incorrect.', 'bad');
         }
       });
-    } else if (path === 'upload' && images && images.original) {
-      post(jwt, path, { username, file: images.original }, (res, success) => {
+    } else if (path === 'upload' && options) {
+      const { original } = options;
+      post(jwt, path, { username, file: original }, (res, success) => {
         if (success) {
           const originalID = res.data.fileID;
-          this.setState({ images: { ...images, originalID } });
-          this.notify(`Image uploaded`, 'good');
+          this.setState({ images: { ...images, original, originalID } });
+          this.notify('Image uploaded', 'good');
           this.request('process');
         } else {
           this.notify('Error uploading image.', 'bad');
@@ -107,14 +108,25 @@ class App extends Component {
       const { which, fileID, filetype } = options;
       post(jwt, path, { username, fileID, filetype }, (res, success) => {
         if (success) {
-          const imgFile = `data:image/${filetype};base64,${res.data.file}`
-          if (cb) {
-            cb(imgFile);
-          } else {
+          const file = res.data.file;
+          if (file) {
+            const imgFile = `data:image/${filetype};base64,${file}`
+            if (cb) {
+              cb(imgFile);
+            } else {
+              this.setState({
+                images:
+                  Object.assign({}, this.state.images, {
+                    [which]: imgFile
+                  })
+              });
+            }
+          } else { // handle case where images are deleted from server
             this.setState({
               images:
                 Object.assign({}, this.state.images, {
-                  [which]: imgFile
+                  [which]: null,
+                  [which + 'ID']: null
                 })
             });
           }

diff --git a/frontend/src/components/Dashboard/index.jsx b/frontend/src/components/Dashboard/index.jsx
@@ -43,29 +43,26 @@ class Dashboard extends Component {
 
       const reader = new FileReader();
       reader.readAsDataURL(file);
-      reader.onload = () => this.props.update('images', {
-        ...this.props.images,
-        original: reader.result
-      }, () => this.props.request('upload'));
+      reader.onload = () => this.props.request('upload', { original: reader.result })
     }
   }
 
   render() {
-    const { request, logout, username, images } = this.props,
-      req = {
-        process: () => request('process'),
-        download: (which, type) => request('download', {
-          which,
-          fileID: images.processedID,
-          filetype: type
-        }, (file) => {
-          const uploader = this.refs.imageDownloader;
-          const fileName = `${images.processedID}.${type}`;
-          uploader.setAttribute("href", file);
-          uploader.setAttribute("download", fileName);
-          uploader.click();
-        })
-      };
+    const { request, logout, username, images } = this.props;
+    const req = {
+      process: () => request('process'),
+      download: (which, type) => request('download', {
+        which,
+        fileID: images.processedID,
+        filetype: type
+      }, (file) => {
+        const uploader = this.refs.imageDownloader;
+        const fileName = `${images.processedID}.${type}`;
+        uploader.setAttribute("href", file);
+        uploader.setAttribute("download", fileName);
+        uploader.click();
+      })
+    };
 
     return (
       <div className="Dashboard">