Link to statsviewer player

pointercrate-core-pages/static/css/ui.css

@@ -46,6 +46,26 @@ a.link:after {
   text-decoration: none;
 }
 
+@media (max-width: 768px) {
+  a.mobile-only-link {
+    color: blue;
+  }
+
+  a.mobile-only-link:after {
+    font-family: "Font Awesome 5 Free";
+    font-weight: 600;
+    font-style: normal;
+    display: inline-block;
+    text-decoration: inherit;
+    margin: auto 3px;
+  }
+
+  a.mobile-only-link:after {
+    content: "\f35d";
+    text-decoration: none;
+  }
+}
+
 /* Default header styles */
 
 body,
@@ -575,7 +595,6 @@ h2 .dropdown-menu ul {
 .tooltip {
   position: relative;
   display: inline-block;
-  border-bottom: 1px dotted #555;
 }
 
 .tooltip .tooltiptext {
@@ -638,6 +657,10 @@ h2 .dropdown-menu ul {
   padding-top: 10px;
 }
 
+.underdotted {
+  border-bottom: 1px dotted #555;
+}
+
 .info-green {
   background: #ddffdd;
   border: 1px solid #a8ff93;
@@ -702,3 +725,7 @@ ul.selection-list li {
 .tab-active {
   color: #0881c6;
 }
+
+#claims-claim-panel > a.button {
+  width: fit-content;
+}

pointercrate-core-pages/static/js/modules/form.js

@@ -493,8 +493,10 @@ export class Paginator extends Output {
    * @returns A promise
    */
   selectArbitrary(id) {
-    return get(this.retrievalEndpoint + id + "/").then(
-      this.onReceive.bind(this)
+    return get(this.retrievalEndpoint + id + "/").then(response => {
+          this.setError(null);
+          this.onReceive(response);
+        }
     );
   }
 
@@ -608,13 +610,15 @@ export class Paginator extends Output {
    * @memberof Paginator
    */
   refresh() {
+    this.setError(null);
     return get(this.currentLink)
       .then(this.handleResponse.bind(this))
       .catch(displayError(this));
   }
 
   onPreviousClick() {
     if (this.links.prev) {
+      this.setError(null);
       get(this.links.prev)
         .then(this.handleResponse.bind(this))
         .catch(displayError(this));
@@ -623,6 +627,7 @@ export class Paginator extends Output {
 
   onNextClick() {
     if (this.links.next) {
+      this.setError(null);
       get(this.links.next)
         .then(this.handleResponse.bind(this))
         .catch(displayError(this));

pointercrate-demonlist-pages/src/account/list_integration.rs

@@ -145,6 +145,9 @@ impl AccountPageTab for ListIntegrationTab {
                                 span style = "background-color: #D8EFF3" { "Under Consideration" } "."
                             }
                             (paginator("claims-record-pagination", "/api/v1/records/"))
+                            a.button.blue.hover.no-stretch style = "margin: 10px 37% 5px;" href = (format!("/demonlist/statsviewer?player={}", claim.player.id)) target = "_blank" {
+                                "Go to statsviewer"
+                            }
                         }
                     }
                 }

pointercrate-demonlist-pages/src/demon_page.rs

@@ -424,17 +424,18 @@ impl DemonPage {
                                             }
                                         }
                                         td {
-                                            @if let Some(ref video) = record.video {
-                                                 a href = (video) target = "_blank"{
-                                                    (record.player.name)
-                                                 }
-                                            }
-                                            @else {
+                                            a.underdotted href = {"/demonlist/statsviewer?player="(record.player.id)} target = "_blank" {
                                                 (record.player.name)
                                             }
                                         }
                                         td {
-                                            (record.progress) "%"
+                                            @if let Some(ref video) = record.video {
+                                                a.mobile-only-link href = (video) target = "_blank" {
+                                                    (record.progress) "%"
+                                                }
+                                            } @else {
+                                                (record.progress) "%"
+                                            }
                                         }
                                         td.video-link {
                                             @if let Some(ref video) = record.video {

pointercrate-demonlist-pages/static/css/statsviewer.css

@@ -49,7 +49,6 @@
     flex-grow: 2;
 }
 
-
 .tooltip:hover .tooltiptext {
     opacity: 1 !important;
-}
+}

pointercrate-demonlist-pages/static/js/statsviewer/individual.js

@@ -1,4 +1,4 @@
-import { Dropdown } from "/static/core/js/modules/form.js";
+import { displayError, Dropdown, get } from "/static/core/js/modules/form.js";
 import {
   getCountryFlag,
   populateSubdivisionDropdown,
@@ -23,7 +23,7 @@ class IndividualStatsViewer extends StatsViewer {
 
     var playerData = response.data.data;
 
-    this._rank.innerText = playerData.rank;
+    this._rank.innerText = playerData.rank || "-";
     this._score.innerText = playerData.score.toFixed(2);
 
     this.setName(playerData.name, playerData.nationality);
@@ -143,6 +143,13 @@ class IndividualStatsViewer extends StatsViewer {
       })
     );
   }
+  onSelect(selected) {
+    let params = new URLSearchParams(window.location.href.split('?')[1]);
+    params.set("player", selected.dataset.id);
+    const urlWithoutParam = `${window.location.origin}${window.location.pathname}?${params.toString()}`
+    window.history.replaceState({}, '', urlWithoutParam);
+    super.onSelect(selected);
+  }
 }
 
 $(window).on("load", function () {
@@ -161,7 +168,23 @@ $(window).on("load", function () {
     document.getElementById("statsviewer")
   );
 
-  window.statsViewer.initialize();
+  window.statsViewer.initialize().then(() => {
+    let url = window.location.href;
+    let params = new URLSearchParams(url.split('?')[1]);
+    let playerId = parseInt(params.get('player'));
+    if (playerId !== undefined && !isNaN(playerId)) {
+      window.statsViewer.selectArbitrary(playerId)
+        .catch((err) => {
+          displayError(window.statsViewer)(err)
+
+          // if the param failed, set the URL bar's value to the same location, but with the 
+          // "player" parameter removed
+          params.delete("player");
+          const urlWithoutParam = `${window.location.origin}${window.location.pathname}?${params.toString()}`
+          window.history.replaceState({}, '', urlWithoutParam)
+      })
+    }
+  });
 
   new Dropdown(document.getElementById("continent-dropdown")).addEventListener(
     (selected) => {