diff --git a/app/models.py b/app/models.py
index cc143f8b..2c993f21 100644
--- a/app/models.py
+++ b/app/models.py
@@ -275,7 +275,8 @@ class JobInput(db.Model):
     def to_dict(self):
         return {'id': self.id,
                 'filename': self.filename,
-                'job_id': self.job_id}
+                'job_id': self.job_id,
+                'results': [result.to_dict() for result in self.results]}
 
 
 class JobResult(db.Model):
diff --git a/app/templates/main/jobs/job.html.j2 b/app/templates/main/jobs/job.html.j2
index c35ea427..6603a26b 100644
--- a/app/templates/main/jobs/job.html.j2
+++ b/app/templates/main/jobs/job.html.j2
@@ -50,14 +50,45 @@
       serviceArgsElement.value = this.job.service_args;
       serviceVersionElement = document.getElementById("service-version");
       serviceVersionElement.value = this.job.service_version;
-      statusColor = JobList.STATUS_COLORS[this.job.status]
-                  || JobList.STATUS_COLORS['default'];
+      statusColor = JobList.STATUS_COLORS[this.job.status] || JobList.STATUS_COLORS['default'];
       statusElement = document.getElementById("status");
       statusElement.classList.add(statusColor);
       statusElement.innerHTML = this.job.status;
       titleElement = document.getElementById("title");
       titleElement.innerHTML = this.job.title;
 
+      var downloadIconElement, fileElement, filesElement, input, inputDownloadElement, inputElement, result, resultDownloadElement, resultsElement;
+
+      filesElement = document.getElementById("files");
+      downloadIconElement = document.createElement("i");
+      downloadIconElement.classList.add("material-icons", "left");
+      downloadIconElement.innerText = "file_download";
+      for (input of this.job.inputs) {
+        fileElement = document.createElement("tr");
+        inputDownloadElement = document.createElement("a");
+        inputDownloadElement.classList.add("waves-effect", "waves-light", "btn-small");
+        inputDownloadElement.href = `/jobs/${this.job.id}/download?file=${input.filename}`;
+        inputDownloadElement.innerText = input.filename;
+        inputDownloadElement.appendChild(downloadIconElement.cloneNode(true));
+        inputElement = document.createElement("td");
+        inputElement.id = `input-${input.id}`;
+        inputElement.appendChild(inputDownloadElement);
+        resultsElement = document.createElement("td");
+        resultsElement.id = `results-${input.id}`;
+        // add_results(input);
+        for (result of input.results) {
+          resultDownloadElement = document.createElement("a");
+          resultDownloadElement.classList.add("waves-effect", "waves-light", "btn-small");
+          resultDownloadElement.href = `/jobs/${this.job.id}/download?file=output/${input.filename}/${result.filename}`;
+          resultDownloadElement.innerText = result.filename.split(".").slice(-1)[0];
+          resultDownloadElement.appendChild(downloadIconElement.cloneNode(true));
+          resultsElement.appendChild(resultDownloadElement);
+        }
+        fileElement.appendChild(inputElement);
+        fileElement.appendChild(resultsElement);
+        filesElement.appendChild(fileElement);
+      }
+
       M.updateTextFields();
     }
 
@@ -68,8 +99,17 @@
       for (operation of patch) {
         /* "/jobId/valueName" -> ["jobId", "valueName"] */
         pathArray = operation.path.split("/").slice(1);
+        console.log(operation);
+        console.log(pathArray);
         if (pathArray[0] != this.jobId) {continue;}
         switch(operation.op) {
+          case "add":
+            switch(pathArray[1]) {
+              case "input":
+
+                break;
+            }
+            break;
           case "delete":
             location.reload();
             break;
@@ -208,6 +248,17 @@
               <th style="width: 25%;"></th>
           </tr>
         </thead>
+        <tbody id="files"></tbody>
+      </table>
+
+      <span class="card-title">Files old</span>
+      <table>
+        <thead>
+          <tr>
+              <th style="width: 50%;">Inputs</th>
+              <th style="width: 50%;">Results</th>
+          </tr>
+        </thead>
         <tbody>
           {% for file in files %}
           <tr>