reallow non-media files by default

public/css/app.css

@@ -73,3 +73,16 @@
 .image {
 	width: 100%;
 }
+
+div.nonmedia {
+	height: 100px;
+	width: 100%;
+}
+
+div.nonmedia p {
+	color: #444;
+	font-size: 20px;
+	font-weight: 400;
+	line-height: 100px;
+	text-align: center;
+}

routes/index.js

@@ -33,18 +33,28 @@ const storage = multer.diskStorage({
   }
 });
 
+let allowedMimeTypes = [
+  'image/png',
+  'image/jpg',
+  'image/jpeg',
+  'image/gif',
+  'image/webp',
+  'video/mp4',
+  'video/mov',
+  'video/webm',
+  'audio/mpeg',
+  'audio/ogg'
+]
+
 const fileFilter = function(req, file, cb) {
-    if (file.mimetype == "image/png" || file.mimetype == "image/jpg" || file.mimetype == "image/jpeg" || file.mimetype == "image/gif" || file.mimetype == "image/webp"
+  if (allowedMimeTypes.includes(file.mimetype)) {
-      || file.mimetype == "video/mp4" || file.mimetype == "video/mov" || file.mimetype == "video/webm"
+    cb(null, true);
-      || file.mimetype == "audio/mpeg" || file.mimetype == "audio/ogg") {
-        cb(null, true)
   } else {
     cb(null, false);
-        //return cb(new Error('Only media files allowed'));
   }
 }
 
-let upload = multer({ storage: storage, fileFilter: fileFilter });
+let upload = multer({ storage: storage /**, fileFilter: fileFilter**/ }); //maybe make this a env variable?
 
 function fetchMedia(req, res, next) {
   db.all('SELECT * FROM media', (err, rows) => {

views/index.ejs

@@ -46,8 +46,12 @@ function extension(string) {
                             <div class="view">
                                 <% if (extension(file.path) == ".mp4" || extension(file.path) == ".mov" || extension(file.path) == "webp") { %>
                                 <video autoplay loop muted playsinline class="image" src="/uploads/<%=file.path %>" width="100%" onclick="copyURI(event)"></video>
-								<% } else { %>
+                                <% } else if (extension(file.path) == ".jpg" || extension(file.path) == ".jpeg" || extension(file.path) == ".png" || extension(file.path) == ".gif" || extension(file.path) == ".webp" ) { %>
                                 <img class="image" src="/uploads/<%=file.path %>" width="100%" onclick="copyURI(event)">
+				<% } else {%> <!-- non-media file -->
+                        	<div class="nonmedia" onclick="copyURI(event)">
+					<p><%=extension(file.path)%> file</p>
+				</div>
 				<% } %>
                                 <label text-align:"center"><%= file.path %></label>
                                 <button class="destroy" form="delete-<%= file.path %>"></button>