From a26d1f9bb76493767bceaecffcb6d39b4f5aac7a Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@nebulon.de>
Date: Tue, 1 Mar 2016 18:16:31 +0100
Subject: Add file preview

---
 app/css/style.css     |   4 ++++
 app/img/directory.png | Bin 0 -> 888 bytes
 app/img/html.png      | Bin 0 -> 3744 bytes
 app/img/image.png     | Bin 0 -> 2218 bytes
 app/img/pdf.png       | Bin 0 -> 3221 bytes
 app/img/text.png      | Bin 0 -> 1673 bytes
 app/img/unknown.png   | Bin 0 -> 1416 bytes
 app/img/video.png     | Bin 0 -> 1638 bytes
 app/index.html        |   3 +--
 app/js/app.js         |  26 +++++++++++++++++++++++++-
 10 files changed, 30 insertions(+), 3 deletions(-)
 create mode 100644 app/img/directory.png
 create mode 100644 app/img/html.png
 create mode 100644 app/img/image.png
 create mode 100644 app/img/pdf.png
 create mode 100644 app/img/text.png
 create mode 100644 app/img/unknown.png
 create mode 100644 app/img/video.png

diff --git a/app/css/style.css b/app/css/style.css
index b7e5742..13c6533 100644
--- a/app/css/style.css
+++ b/app/css/style.css
@@ -32,4 +32,8 @@ pre {
 
 .hand {
     cursor: hand;
+}
+
+th {
+    vertical-align: middle !important;
 }
\ No newline at end of file
diff --git a/app/img/directory.png b/app/img/directory.png
new file mode 100644
index 0000000..8630079
Binary files /dev/null and b/app/img/directory.png differ
diff --git a/app/img/html.png b/app/img/html.png
new file mode 100644
index 0000000..51153ea
Binary files /dev/null and b/app/img/html.png differ
diff --git a/app/img/image.png b/app/img/image.png
new file mode 100644
index 0000000..22939ff
Binary files /dev/null and b/app/img/image.png differ
diff --git a/app/img/pdf.png b/app/img/pdf.png
new file mode 100644
index 0000000..95e2308
Binary files /dev/null and b/app/img/pdf.png differ
diff --git a/app/img/text.png b/app/img/text.png
new file mode 100644
index 0000000..daf010d
Binary files /dev/null and b/app/img/text.png differ
diff --git a/app/img/unknown.png b/app/img/unknown.png
new file mode 100644
index 0000000..c5dac42
Binary files /dev/null and b/app/img/unknown.png differ
diff --git a/app/img/video.png b/app/img/video.png
new file mode 100644
index 0000000..6c01aea
Binary files /dev/null and b/app/img/video.png differ
diff --git a/app/index.html b/app/index.html
index 4557fcb..f6c91c9 100644
--- a/app/index.html
+++ b/app/index.html
@@ -138,8 +138,7 @@
                         </tr>
                         <tr v-for="entry in entries" v-on:click="open(entry)" class="hand">
                             <th>
-                                <i class="fa fa-folder-o" v-show="entry.isDirectory"></i>
-                                <i class="fa fa-file-o" v-show="entry.isFile"></i>
+                                <img v-bind:src="entry.previewUrl" height="48px" width="48px"/>
                             </th>
                             <th>{{ entry.filePath }}</th>
                             <th>{{ entry.size }}</th>
diff --git a/app/js/app.js b/app/js/app.js
index 0d6144e..c942e60 100644
--- a/app/js/app.js
+++ b/app/js/app.js
@@ -43,6 +43,27 @@ function encode(filePath) {
     return filePath.split('/').map(encodeURIComponent).join('/');
 }
 
+var mimeTypes = {
+    images: [ '.png', '.jpg', '.jpeg', '.tiff', '.gif' ],
+    text: [ '.txt', '.md' ],
+    pdf: [ '.pdf' ],
+    html: [ '.html', '.htm', '.php' ],
+    video: [ '.mp4', '.mpg', '.mpeg', '.ogg', '.mkv' ]
+};
+
+function getPreviewUrl(entry, basePath) {
+    var path = '/_admin/img/';
+
+    if (entry.isDirectory) return path + 'directory.png';
+    if (mimeTypes.images.some(function (e) { return entry.filePath.endsWith(e); })) return sanitize(basePath + '/' + entry.filePath);
+    if (mimeTypes.text.some(function (e) { return entry.filePath.endsWith(e); })) return path +'text.png';
+    if (mimeTypes.pdf.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'pdf.png';
+    if (mimeTypes.html.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'html.png';
+    if (mimeTypes.video.some(function (e) { return entry.filePath.endsWith(e); })) return path + 'video.png';
+
+    return path + 'unknown.png';
+}
+
 function refresh() {
     loadDirectory(app.path);
 }
@@ -60,7 +81,10 @@ function loadDirectory(filePath) {
         if (error) return console.error(error);
         if (result.statusCode === 401) return logout();
 
-        app.entries = result.body.entries;
+        app.entries = result.body.entries.map(function (entry) {
+            entry.previewUrl = getPreviewUrl(entry, filePath);
+            return entry;
+        });
         app.path = filePath;
         app.pathParts = filePath.split('/').filter(function (e) { return !!e; });
 
-- 
cgit v1.2.3