added route id verification, and better downloader ui

app.js

@@ -23,6 +23,11 @@ app.get("/download/:id", function(req, res) {
 
 app.get("/assets/download/:id", function(req, res) {
   
+  if (!validateID(id)){ 
+    res.send(404);
+    return;
+  }
+
   let id = req.params.id;
   client.hget(id, "filename", function(err, reply) { // maybe some expiration logic too
     if (!reply) {
@@ -44,6 +49,12 @@ app.get("/assets/download/:id", function(req, res) {
 
 app.post("/delete/:id", function(req, res) {
   let id = req.params.id;
+
+  if (!validateID(id)){ 
+    res.send(404);
+    return;
+  }
+  
   let delete_token = req.body.delete_token;
   
   if (!delete_token){ 
@@ -63,6 +74,11 @@ app.post("/delete/:id", function(req, res) {
 
 app.post("/upload/:id", function (req, res, next) {
     
+    if (!validateID(req.params.id)){ 
+      res.send(404);
+      return;
+    }
+
     var fstream;
     req.pipe(req.busboy);
     req.busboy.on("file", function (fieldname, file, filename) {
@@ -93,3 +109,6 @@ app.listen(3000, function () {
   console.log("Portal app listening on port 3000!")
 })
 
+function validateID(route_id) {
+  return route_id.match(/^[0-9a-fA-F]{32}$/) !== null;
+}

public/download.html

@@ -9,5 +9,8 @@
   <button onclick="download()">DOWNLOAD</button>
   <p id="downloadProgress"></p>
 
+  <ul id="downloaded_files">
+  </ul>
+
 </body>
 </html> 

public/download.js

@@ -4,7 +4,11 @@ function download() {
   xhr.open("get", "/assets" + location.pathname.slice(0, -1), true);
   xhr.responseType = "blob";
 
-  xhr.addEventListener("progress", updateProgress);
+  var li = document.createElement("li");
+  var progress = document.createElement("p");
+  li.appendChild(progress);
+  
+  xhr.addEventListener("progress", returnBindedLI(li, progress));
 
   xhr.onload = function(e) {
     if (this.status == 200) {
@@ -39,12 +43,19 @@ function download() {
                 key,
                 array)
             .then(function(decrypted){
+              var filename = xhr.getResponseHeader("Content-Disposition").match(/filename="(.+)"/)[1];
+              
+              var name = document.createElement("p");
+              name.innerHTML = filename;
+              li.insertBefore(name, li.firstChild);
+              document.getElementById("downloaded_files").appendChild(li);
+
               var dataView = new DataView(decrypted);
               var blob = new Blob([dataView]);
               var downloadUrl = URL.createObjectURL(blob);
               var a = document.createElement("a");
               a.href = downloadUrl;
-                a.download = xhr.getResponseHeader("Content-Disposition").match(/filename="(.+)"/)[1];
+              a.download = filename
               console.log(xhr.getResponseHeader("Content-Disposition"));
               document.body.appendChild(a);
               a.click();
@@ -88,9 +99,26 @@ function strToIv(str) {
   return iv;
 }
 
-function updateProgress(e) {
+function returnBindedLI(li, progress) {
+  return function updateProgress(e) {
             if (e.lengthComputable) { 
               var percentComplete = Math.floor((e.loaded / e.total) * 100);
-    document.getElementById("downloadProgress").innerHTML = "Progress: " + percentComplete + "%";
+              progress.innerHTML = "Progress: " + percentComplete + "%";
+            } 
+
+            if (percentComplete === 100) {
+              var finished = document.createElement("p");
+              finished.innerHTML = "Your download has finished.";
+              li.appendChild(finished);
+
+              var close = document.createElement("button");
+              close.innerHTML = "Ok";
+              close.addEventListener("click", function() {
+                document.getElementById("downloaded_files").removeChild(li);
+              });
+
+              li.appendChild(close);
+            }
+
          }
 }