Avoid sorting the ranking table footer

m4tx · Dec 29, 2016 · 2322848 · 2322848
1 parent 81fcd38
commit 2322848
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 1 deletion.
diff --git a/ext/js/ranking.js b/ext/js/ranking.js
@@ -2,8 +2,24 @@
     'use strict';
 
     const NUMBER_REGEX = /-?(\d+\.?\d+|\d*\.?\d+)/;
+    const TABLE_FOOTER_LABELS = ["Rank", "Name", "Score"];
 
-    $('div.ranking table').tableHeadFixer({
+    let table = $('div.ranking table');
+
+    // Check if there's a ranking footer inside <tbody> by checking if the last
+    // table row has specific labels
+    let footerLabels = $.map(
+        table.find('tbody > tr:last > td'),
+        elem => $(elem).text()
+    );
+    if (TABLE_FOOTER_LABELS.every(x => footerLabels.indexOf(x) !== -1)) {
+        // ...if so, create a <tfoot>
+        let tr = table.find('tr:last').detach();
+        let tfoot = $('<tfoot/>').append(tr);
+        table.append(tfoot);
+    }
+
+    table.tableHeadFixer({
         left: 2
     }).tablesorter({
         textExtraction: function (node) {

diff --git a/ext/scss/ranking.scss b/ext/scss/ranking.scss
@@ -17,5 +17,20 @@ div.ranking {
         background-color: #deffcc !important;
       }
     }
+
+    tfoot > tr {
+      background-color: #ede !important;
+      & > td {
+        padding: 1px .5em 1px .5em !important;
+        border-bottom: none !important;
+      }
+    }
   }
 }
+
+div.ranking tbody > tr:last-child td:first-child:after {
+  // Since the original ranking CSS relies on the fact that the last <tr> is
+  // actually a table footer and move to <tfoot>, we have to restore the
+  // original "Rank" column contents in the last table row
+  content: counter(lp);
+}