From a70641912ea05442f17cae683a91629c2125d840 Mon Sep 17 00:00:00 2001
From: Kaixhin <design@kaixhin.com>
Date: Wed, 28 Oct 2015 19:15:36 +0000
Subject: [PATCH] feat: display uploaded images

---
 examples/Calinski-Harabasz/README.md         | 2 +-
 examples/Recurrent-Attention-Model/README.md | 2 ++
 index.js                                     | 2 +-
 views/experiment.jade                        | 6 +++++-
 4 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/examples/Calinski-Harabasz/README.md b/examples/Calinski-Harabasz/README.md
index 50a9c1d..299c36b 100644
--- a/examples/Calinski-Harabasz/README.md
+++ b/examples/Calinski-Harabasz/README.md
@@ -43,7 +43,7 @@ The following are the results of running the code on MATLAB R2015b - your result
 | linkage        | 1 | \_NaN\_     |
 | kmeans         | 1 | \_NaN\_     |
 
-Each experiment also produces two scatter plots to show the clustering - one based on sepal length vs. sepal width, and the other based on petal length vs. petal width.
+Each experiment also produces two scatter plots to show the clustering - one based on sepal length vs. sepal width, and the other based on petal length vs. petal width. Note that FGLab automatically displays uploaded images, so it is possible to create the plots within MATLAB and have them displayed on the experiment page.
 
 ## Citations
 
diff --git a/examples/Recurrent-Attention-Model/README.md b/examples/Recurrent-Attention-Model/README.md
index d68701a..93192ea 100644
--- a/examples/Recurrent-Attention-Model/README.md
+++ b/examples/Recurrent-Attention-Model/README.md
@@ -38,6 +38,8 @@ For each glimpse, the extracted patches, `patch<x>.png`, are also extracted:
 
 ![patch1](https://raw.githubusercontent.com/Kaixhin/FGLab/master/examples/Recurrent-Attention-Model/patch1.png)
 
+These images are displayed along with the normal download link for uploaded files.
+
 ## Citations
 
 [1] Mnih, V., Heess, N., & Graves, A. (2014). Recurrent models of visual attention. In *Advances in Neural Information Processing Systems* (pp. 2204-2212).
diff --git a/index.js b/index.js
index ef6ece6..da142a3 100644
--- a/index.js
+++ b/index.js
@@ -350,7 +350,7 @@ app.put("/api/experiments/:id/files", upload.array("_files"), function(req, res,
         gfs.write(fileObj.buffer, true)
         .then(function(gfs) {
           // Save file reference
-          filesP[i] = db.experiments.updateByIdAsync(req.params.id, {$push: {_files: {_id: gfs.fileId, filename: gfs.filename}}});
+          filesP[i] = db.experiments.updateByIdAsync(req.params.id, {$push: {_files: {_id: gfs.fileId, filename: gfs.filename, mimetype: gfs.contentType}}});
         })
         .catch(function(err) {
           console.log(err);
diff --git a/views/experiment.jade b/views/experiment.jade
index 845ffb0..2d8e018 100644
--- a/views/experiment.jade
+++ b/views/experiment.jade
@@ -95,7 +95,11 @@ block scripts
       // Add files
       var $files = $("#files");
       for (var i = 0; i < experiment._files.length; i++) {
-        $files.append("<li><a href='/files/'" + experiment._files[i]._id + "'>" + experiment._files[i].filename + "</a></li>");
+        var file = experiment._files[i];
+        if (file.mimetype.indexOf("image/") === 0) {
+          $files.append("<li><img src='/files/" + file._id + "' class='img-responsive'></li>");
+        }
+        $files.append("<li><a href='/files/" + file._id + "'>" + file.filename + "</a></li>");
       }
 
       if (experiment._charts) {