Player Better

public/home.js

@@ -24,7 +24,7 @@ async function updateOffense() {
     const offenseBody = document.querySelector("#offense tbody");
     
 
-    let resultObject = await postData("/getHighestOffense", { amount: 10 }, token);
+    let resultObject = await postData("/getHighestOffense", { amount: 100 }, token);
     console.log(resultObject);
 
     if (resultObject.matches.length === 0) {
@@ -38,6 +38,7 @@ async function updateOffense() {
     //   headerRow.innerHTML += `<td>${attribute}</td>`; 
     //});
     headerRow.innerHTML = `
+            <td>Rank</td>
             <td>Position</td>
             <td>Name</td>
             <td>Team</td>
@@ -46,14 +47,17 @@ async function updateOffense() {
     offenseHeader.appendChild(headerRow);
 
     offenseBody.innerHTML = "";
+    let i = 0;
     resultObject.matches.forEach(player => {
+        i++;
         const row = document.createElement("tr");
 
         row.innerHTML = `
+            <td>${i}</td>
             <td>${player.Position}</td>
             <td><a href="/player/${player.PlayerID}">${player.PlayerName}</a></td>
             <td>${player.Team}</td>
-            <td>${(player.OffenseScore + "000000").slice(0, 8)}</td>
+            <td>${Math.floor(player.OffenseScore)}</td>
         `;
         offenseBody.appendChild(row);
     });
@@ -67,7 +71,7 @@ async function updatePaydirt() {
     const paydirtBody = document.querySelector("#paydirt tbody");
     
 
-    let resultObject = await postData("/getHighestPaydirt", { amount: 10 }, token);
+    let resultObject = await postData("/getHighestPaydirt", { amount: 100 }, token);
     console.log(resultObject);
 
     if (resultObject.matches.length === 0) {
@@ -81,6 +85,7 @@ async function updatePaydirt() {
     //   headerRow.innerHTML += `<td>${attribute}</td>`; 
     //});
     headerRow.innerHTML = `
+            <td>Rank</td>
             <td>Position</td>
             <td>Name</td>
             <td>Team</td>
@@ -89,14 +94,17 @@ async function updatePaydirt() {
     paydirtHeader.appendChild(headerRow);
 
     paydirtBody.innerHTML = "";
+    let i = 0;
     resultObject.matches.forEach(player => {
+        i++;
         const row = document.createElement("tr");
 
         row.innerHTML = `
+            <td>${i}</td>
             <td>${player.Position}</td>
             <td><a href="/player/${player.PlayerID}">${player.PlayerName}</a></td>
             <td>${player.Team}</td>
-            <td>${(player.PaydirtScore + "000000").slice(0, 8)}</td>
+            <td>${Math.floor(player.PaydirtScore)}</td>
         `;
         paydirtBody.appendChild(row);
     });
@@ -108,7 +116,7 @@ async function updateHighest() {
     const tableHeader = document.querySelector("#highest thead");
     const tableBody = document.querySelector("#highest tbody");
     
-    let resultObject = await postData("/getHighest", { amount: 10 }, token);
+    let resultObject = await postData("/getHighest", { amount: 100 }, token);
     console.log(resultObject);
 
     if (resultObject.matches.length === 0) {
@@ -122,25 +130,29 @@ async function updateHighest() {
     //   headerRow.innerHTML += `<td>${attribute}</td>`; 
     //});
     headerRow.innerHTML = `
-            <td>Name</td>
-            <td>Contract</td>
-            <td>Team</td>
+            <td>Rank</td>
             <td>Position</td>
+            <td>Name</td>
+            <td>Team</td>
+            <td>Contract</td>
         `;
     tableHeader.appendChild(headerRow);
 
     tableBody.innerHTML = "";
+    let i = 0;
     resultObject.matches.forEach(player => {
+        i++;
         const row = document.createElement("tr");
 
         //for (attribute in player) {
         //    row.innerHTML += `<td>${player}</td>l`;
         //}
         row.innerHTML = `
-            <td><a href="/player/${player.PlayerID}">${player.PlayerName}</a></td>
-            <td>${formatSalary(player.TotalValue)}</td>
-            <td>${player.Team}</td>
+            <td>${i}</td>
             <td>${player.Position}</td>
+            <td><a href="/player/${player.PlayerID}">${player.PlayerName}</a></td>
+            <td>${player.Team}</td>
+            <td>${formatSalary(player.TotalValue)}</td>
         `;
         tableBody.appendChild(row);
     });
@@ -160,22 +172,35 @@ async function updateFavorites() {
     //   headerRow.innerHTML += `<td>${attribute}</td>`; 
     //});
     headerRow.innerHTML = `
+            <td>Rank</td>
+            <td>Position</td>
             <td>Name</td>
             <td>Team</td>
-            <td>Position</td>
+            <td>Remove</td>
         `;
     tableHeader.appendChild(headerRow);
 
     tableBody.innerHTML = "";
     console.log(resultObject.watchlist);
+    let i = 0;
     resultObject.watchlist.forEach(player => {
+        i++;
         const row = document.createElement("tr");
 
         row.innerHTML = `
+            <td>${i}</td>
+            <td>${player.Position}</td>
             <td><a href="/player/${player.PlayerID}">${player.PlayerName}</a></td>
             <td>${player.Team}</td>
-            <td>${player.Position}</td>
+            <td><a href="#" class="remove" data-id="${player.PlayerID}">Stop Watching</a></td>
         `;
         tableBody.appendChild(row);
     });
+
+    document.querySelectorAll(".remove").forEach(element => {
+        element.addEventListener("click", async e => {
+            postData("/toggleWatched", { id: element.dataset.id }, token);
+            element.closest("tr").remove();
+        })
+    });
 };