Add generic multiworld tracker, move lttp multiworld tracker (#1478)

Co-authored-by: Berserker

WebHostLib/static/assets/lttpMultiTracker.js

@@ -0,0 +1,6 @@
+window.addEventListener('load', () => {
+    $(".table-wrapper").scrollsync({
+        y_sync: true,
+        x_sync: true
+    });
+});

WebHostLib/static/assets/multiTrackerCommon.js

@@ -110,7 +110,7 @@ window.addEventListener('load', () => {
     const update = () => {
         const target = $("<div></div>");
         console.log("Updating Tracker...");
-        target.load("/tracker/" + tracker, function (response, status) {
+        target.load(location.href, function (response, status) {
             if (status === "success") {
                 target.find(".table").each(function (i, new_table) {
                     const new_trs = $(new_table).find("tbody>tr");
@@ -137,10 +137,5 @@ window.addEventListener('load', () => {
         tables.draw();
     });
 
-    $(".table-wrapper").scrollsync({
-        y_sync: true,
-        x_sync: true
-    });
-
     adjustTableHeight();
 });

WebHostLib/static/styles/tracker.css

@@ -119,6 +119,33 @@ img.alttp-sprite {
     background-color: #d3c97d;
 }
 
+#tracker-navigation {
+    display: inline-flex;
+    background-color: #b0a77d;
+    margin: 0.5rem;
+    border-radius: 4px;
+}
+
+.tracker-navigation-button {
+    display: block;
+    margin: 4px;
+    padding-left: 12px;
+    padding-right: 12px;
+    border-radius: 4px;
+    text-align: center;
+    font-size: 14px;
+    color: #000;
+    font-weight: lighter;
+}
+
+.tracker-navigation-button:hover {
+    background-color: #e2eabb !important;
+}
+
+.tracker-navigation-button.selected {
+    background-color: rgb(220, 226, 189);
+}
+
 @media all and (max-width: 1700px) {
     table.dataTable thead th.upper-row{
         position: -webkit-sticky;