Overhaul of styles for DataTables, re-add Cookie Notice

WebHostLib/static/tracker.js

@@ -0,0 +1,42 @@
+let tables = null;
+
+window.onload = () => {
+    tables = $(".table").DataTable({
+        paging: false,
+        info: false,
+        scrollCollapse: true,
+
+        // DO NOT use the scrollX or scrollY options. They cause DataTables to split the thead from
+        // the tbody and render two separate tables.
+    });
+
+    const update = () => {
+        const target = $("<div></div>");
+        target.load("/tracker/{{ room.tracker }}", function (response, status) {
+            if (status === "success") {
+                target.find(".table").each(function (i, new_table) {
+                    const new_trs = $(new_table).find("tbody>tr");
+                    const old_table = tables.eq(i);
+                    const topscroll = $(old_table.settings()[0].nScrollBody).scrollTop();
+                    const leftscroll = $(old_table.settings()[0].nScrollBody).scrollLeft();
+                    old_table.clear();
+                    old_table.rows.add(new_trs).draw();
+                    $(old_table.settings()[0].nScrollBody).scrollTop(topscroll);
+                    $(old_table.settings()[0].nScrollBody).scrollLeft(leftscroll);
+                });
+            } else {
+                console.log("Failed to connect to Server, in order to update Table Data.");
+                console.log(response);
+            }
+        })
+    }
+
+    setInterval(update, 30000);
+
+    $(".dataTables_scrollBody").scrollsync({
+        y_sync: true,
+        x_sync: true
+    });
+
+    window.onresize = () => tables.draw();
+}