Fixes file views and downloads.

app.py

@@ -246,7 +246,6 @@ def get_size(path):
         elif size < pow(1024,4):
             return f"{round(size/(pow(1024,3)), 2)} GB"
 
-
 @app.route('/data/<path:filename>')
 def download_data_file(filename):
     return send_from_directory('data', filename)

templates/download_results.html

@@ -25,22 +25,55 @@
     <main>
         <section id="scrapingFormContainer" class="container-fluid d-flex justify-content-center">
             <div class="container-md my-5 mx-2 shadow-lg p-4 ">
-                <h2>Available Files</h2>
+                <h2>Data</h2>
-                <table class="table">
+                <table id="dataFilesTable" class="table table-striped table-bordered table-hover">
                     <thead>
                         <tr>
-                            <td>Data</td>
+                            <th onclick="sortTable(0, 'dataFilesTable')">File Name</th>
-                            <td>Logs</td>    
+                            <th onclick="sortTable(1, 'dataFilesTable')">Last Modified</th>
+                            <th onclick="sortTable(2, 'dataFilesTable')">Created</th>
+                            <th onclick="sortTable(3, 'dataFilesTable')">Size</th>
+                            <th>Action</th>
+                        </tr>
+                    </thead>    
+                    {% for file in files.data %}
+                    <tr>
+                        <td><a href="{{ url_for('download_data_file', filename=file.name.split('/')[-1]) }}" target="_blank">{{ file.name }}</a></td>
+                        <td>{{ file.last_modified | datetimeformat }}</td>
+                        <td>{{ file.created | datetimeformat }}</td>
+                        <td>{{ file.size }}</td>
+                        <td>
+                            <button onclick="deleteFile('{{ file.name }}')">Delete</button>
+                        </td>
+                    </tr>
+                    {% endfor %}
+                    </tbody>
+                </table>
+                <h2>Log</h2>
+                <table id="logFilesTable" class="table table-striped table-bordered table-hover">
+                    <thead>
+                        <tr>
+                            <th onclick="sortTable(0, 'logFilesTable')">File Name</th>
+                            <th onclick="sortTable(1, 'logFilesTable')">Last Modified</th>
+                            <th onclick="sortTable(2, 'logFilesTable')">Created</th>
+                            <th onclick="sortTable(3, 'logFilesTable')">Size</th>
+                            <th>Action</th>
                         </tr>
                     </thead>
                     <tbody>
-                        {% for file in files %}
+                        {% for file in files.log %}
-                        <tr>
+                            <tr>
-                            <td><a href="{{ url_for('download_results', filename=file) }}">{{ file }}</a></td>
+                                <td><a href="{{ url_for('download_log_file', filename=file.name.split('/')[-1]) }}" target="_blank">{{ file.name }}</a></td>
-                            <td><a href="{{ url_for('download_logs', filename=file) }}">{{ file }}</a></td>
+                                <td>{{ file.last_modified | datetimeformat }}</td>
-                        </tr>
+                                <td>{{ file.created | datetimeformat }}</td>
+                                <td>{{ file.size }}</td>
+                                <td>
+                                    <button onclick="deleteFile('{{ file.name }}')">Delete</button>
+                                </td>
+                            </tr>
                         {% endfor %}
                     </tbody>
+                </table>
             </div>
         </section>
     </main>

templates/index.html

@@ -48,11 +48,18 @@
         </section>
 
         <section id="resultsContainer" class="container-fluid d-flex justify-content-center">
-            <div class="container-md my-5 mx-2 shadow-lg p-4">
+            <div class="container-md my-5 mx-2 shadow-lg p-4" style="height: 500px;">
-                <h2>Logs</h2>
+                <div class="row">
-                <button id="prevPage">Previous</button>
+                    <div class="col-7">
-                <button id="nextPage">Next</button>
+                        <h2>Logs</h2>
-                <pre class="pre-scrollable"><code id="logs"></code></pre>
+                        <button id="prevPage">Previous</button>
+                        <button id="nextPage">Next</button>
+                        <pre id="logs" class="pre-scrollable" style="height: 430px; overflow:scroll; "><code></code></pre>
+                    </div>
+                    <div class="col">
+                        <h2>Stats</h2>
+                    </div>
+                </div>
             </div>
         </section>
     </main>