Persistent table sort on registration page

view-webapp/src/main/sass/main.scss

@@ -359,7 +359,7 @@
     cursor: pointer;
   }
 
-  thead {
+  thead th {
     position: sticky;
     top: 0;
   }

view-webapp/src/main/webapp/js/main.js

@@ -200,7 +200,6 @@ onLoad(() => {
             close_modal();
           }
         } else if (tab === '#pairing') {
-          console.log('here')
           $('#pairing-lists .selected.listitem').removeClass('selected');
         }
         break;

view-webapp/src/main/webapp/js/tour-information.inc.js

@@ -118,7 +118,6 @@ onLoad(() => {
   $('#tournament-infos').on('submit', e => {
     e.preventDefault();
     let form = e.target;
-    console.log(form.val('country'));
     let tour = {
       name: form.val('name'),
       shortName: form.val('shortName'),

view-webapp/src/main/webapp/js/tour-registration.inc.js

@@ -73,6 +73,7 @@ function fillPlayer(player) {
   let form = $('#player-form')[0];
   form.val('name', player.name);
   form.val('firstname', player.firstname);
+  console.log(country);
   form.val('country', country);
   form.val('club', player.club);
   form.val('rank', parseRank(player.rank));
@@ -83,6 +84,8 @@ function fillPlayer(player) {
   $('#register').focus();
 }
 
+let tableSort;
+
 onLoad(() => {
   $('input.numeric').imask({
     mask: Number,
@@ -90,7 +93,37 @@ onLoad(() => {
     min: 0,
     max: 4000
   });
-  new Tablesort($('#players')[0]);
+
+  let prevSort = store('registrationSort');
+  if (prevSort) {
+    let columns = $('#players thead th');
+    columns.forEach(th => {
+      th.removeAttribute('data-sort-default');
+      th.removeAttribute('aria-sort');
+    })
+    prevSort.forEach(i => {
+      let col = columns[Math.abs(i)];
+      col.setAttribute('data-sort-default', '1');
+      if (i < 0) {
+        // take into account TableSort initiailization bug
+        col.setAttribute('aria-sort', 'ascending');
+      }
+    });
+  }
+  tableSort = new Tablesort($('#players')[0]);
+  $('#players').on('afterSort', e => {
+    let sort = [];
+    $('#players thead th').forEach((th, i) => {
+      let attr = th.attr('aria-sort');
+      if (attr) {
+        let dir = i;
+        if (attr === 'descending') dir = -dir;
+        sort.push(dir);
+      }
+    });
+    store('registrationSort', sort);
+  });
+
   $('#add').on('click', e => {
     let form = $('#player-form')[0];
     form.addClass('add');
@@ -110,6 +143,7 @@ onLoad(() => {
   });
 
   $('#register').on('click', e => {
+    console.log("clicked")
     let form = e.target.closest('form');
     let valid = true;
     let required = ['name', 'firstname', 'country', 'club', 'rank', 'rating'];
@@ -128,6 +162,7 @@ onLoad(() => {
     $('#player-form')[0].dispatchEvent(new CustomEvent('submit', {cancelable: true}));
   });
   $('#player-form').on('submit', e => {
+    console.log("submit")
     e.preventDefault();
     let form = $('#player-form')[0];
     let player = {
@@ -143,6 +178,7 @@ onLoad(() => {
     if (form.hasClass('add')) {
       api.postJson(`tour/${tour_id}/part`, player)
         .then(player => {
+          console.log(player)
           if (player !== 'error') {
             window.location.reload();
           }
@@ -152,6 +188,7 @@ onLoad(() => {
       player['id'] = id;
       api.putJson(`tour/${tour_id}/part/${id}`, player)
         .then(player => {
+          console.log(player)
           if (player !== 'error') {
             window.location.reload();
           }
@@ -171,7 +208,7 @@ onLoad(() => {
           form.val('firstname', player.firstname);
           form.val('rating', player.rating);
           form.val('rank', player.rank);
-          form.val('country', player.country);
+          form.val('country', player.country.toLowerCase());
           form.val('club', player.club);
           form.val('final', player.final);
           if (player.final) $('#final-reg').addClass('final');

view-webapp/src/main/webapp/js/tour-results.inc.js

@@ -38,9 +38,7 @@ onLoad(()=>{
     let gameId = e.target.closest('tr').data('id');
     let result = cell.data('result');
     let index = results.indexOf(result);
-    console.log(index)
     result = results[(index + 1)%results.length];
-    console.log(result)
     setResult(gameId, result);
   });
 });

view-webapp/src/main/webapp/lib/tablesort-5.4.0/tablesort.min.js

@@ -1,6 +1 @@
-/*!
+(function(){function e(t,n){if(!(this instanceof e))return new e(t,n);if(!t||t.tagName!=="TABLE")throw new Error("Element must be a table");this.init(t,n||{})}var t=[],n=function(e){var t;return!window.CustomEvent||typeof window.CustomEvent!="function"?(t=document.createEvent("CustomEvent"),t.initCustomEvent(e,!1,!1,void 0)):t=new CustomEvent(e),t},s=function(e,t){return e.getAttribute(t.sortAttribute||"data-sort")||e.textContent||e.innerText||""},a=function(e,t){return e=e.trim().toLowerCase(),t=t.trim().toLowerCase(),e===t?0:e<t?1:-1},o=function(e,t){return[].slice.call(e).find(function(e){return e.getAttribute("data-sort-column-key")===t})},i=function(e,t){return function(n,s){var o=e(n.td,s.td);return o===0?t?s.index-n.index:n.index-s.index:o}};e.extend=function(e,n,s){if(typeof n!="function"||typeof s!="function")throw new Error("Pattern and sort must be a function");t.push({name:e,pattern:n,sort:s})},e.prototype={init:function(e,t){var s,o,i,a,r,n=this;if(n.table=e,n.thead=!1,n.options=t,e.rows&&e.rows.length>0)if(e.tHead&&e.tHead.rows.length>0){for(s=0;s<e.tHead.rows.length;s++)if(e.tHead.rows[s].getAttribute("data-sort-method")==="thead"){o=e.tHead.rows[s];break}o||(o=e.tHead.rows[e.tHead.rows.length-1]),n.thead=!0}else o=e.rows[0];if(!o)return;r=function(){n.current&&n.current!==this&&n.current.removeAttribute("aria-sort"),n.current=this,n.sortTable(this)};for(s=0;s<o.cells.length;s++)i=o.cells[s],i.setAttribute("role","columnheader"),i.getAttribute("data-sort-method")!=="none"&&(i.tabindex=0,i.addEventListener("click",r,!1),i.getAttribute("data-sort-default")!==null&&(a=i));a&&(n.current=a,n.sortTable(a))},sortTable:function(e,r){var h,l=this,v=e.getAttribute("data-sort-column-key"),_=e.cellIndex,g=a,c="",p=[],d=l.thead?0:1,j=e.getAttribute("data-sort-method"),m=e.getAttribute("aria-sort");if(l.table.dispatchEvent(n("beforeSort")),r||(m==="ascending"?m="descending":m==="descending"?m="ascending":m=l.options.descending?"descending":"ascending",e.setAttribute("aria-sort",m)),l.table.rows.length<2)return;if(!j){for(;p.length<3&&d<l.table.tBodies[0].rows.length;)v?h=o(l.table.tBodies[0].rows[d].cells,v):h=l.table.tBodies[0].rows[d].cells[_],c=h?s(h,l.options):"",c=c.trim(),c.length>0&&p.push(c),d++;if(!p)return}for(d=0;d<t.length;d++)if(c=t[d],j){if(c.name===j){g=c.sort;break}}else if(p.every(c.pattern)){g=c.sort;break}l.col=_;for(d=0;d<l.table.tBodies.length;d++){var u,f=[],y={},b=0,w=0;if(l.table.tBodies[d].rows.length<2)continue;for(u=0;u<l.table.tBodies[d].rows.length;u++)c=l.table.tBodies[d].rows[u],c.getAttribute("data-sort-method")==="none"?y[b]=c:(v?h=o(c.cells,v):h=c.cells[l.col],f.push({tr:c,td:h?s(h,l.options):"",index:b})),b++;m==="descending"?f.sort(i(g,!0)):(f.sort(i(g,!1)),f.reverse());for(u=0;u<b;u++)y[u]?(c=y[u],w++):c=f[u-w].tr,l.table.tBodies[d].appendChild(c)}l.table.dispatchEvent(n("afterSort"))},refresh:function(){this.current!==void 0&&this.sortTable(this.current,!0)}},typeof module!="undefined"&&module.exports?module.exports=e:window.Tablesort=e})()
- * tablesort v5.4.0 (2023-05-04)
- * http://tristen.ca/tablesort/demo/
- * Copyright (c) 2023 ; Licensed MIT
-*/
-!function(){function r(t,e){if(!(this instanceof r))return new r(t,e);if(!t||"TABLE"!==t.tagName)throw new Error("Element must be a table");this.init(t,e||{})}function m(t){var e;return window.CustomEvent&&"function"==typeof window.CustomEvent?e=new CustomEvent(t):(e=document.createEvent("CustomEvent")).initCustomEvent(t,!1,!1,void 0),e}function p(t,e){return t.getAttribute(e.sortAttribute||"data-sort")||t.textContent||t.innerText||""}function v(t,e){return(t=t.trim().toLowerCase())===(e=e.trim().toLowerCase())?0:t<e?1:-1}function A(t,e){return[].slice.call(t).find(function(t){return t.getAttribute("data-sort-column-key")===e})}function E(n,o){return function(t,e){var r=n(t.td,e.td);return 0===r?o?e.index-t.index:t.index-e.index:r}}var x=[];r.extend=function(t,e,r){if("function"!=typeof e||"function"!=typeof r)throw new Error("Pattern and sort must be a function");x.push({name:t,pattern:e,sort:r})},r.prototype={init:function(t,e){var r,n,o,i=this;if(i.table=t,i.thead=!1,i.options=e,t.rows&&0<t.rows.length)if(t.tHead&&0<t.tHead.rows.length){for(a=0;a<t.tHead.rows.length;a++)if("thead"===t.tHead.rows[a].getAttribute("data-sort-method")){r=t.tHead.rows[a];break}r=r||t.tHead.rows[t.tHead.rows.length-1],i.thead=!0}else r=t.rows[0];if(r){function s(){i.current&&i.current!==this&&i.current.removeAttribute("aria-sort"),i.current=this,i.sortTable(this)}for(var a=0;a<r.cells.length;a++)(o=r.cells[a]).setAttribute("role","columnheader"),"none"!==o.getAttribute("data-sort-method")&&(o.tabindex=0,o.addEventListener("click",s,!1),null!==o.getAttribute("data-sort-default")&&(n=o));n&&(i.current=n,i.sortTable(n))}},sortTable:function(t,e){var r=this,n=t.getAttribute("data-sort-column-key"),o=t.cellIndex,i=v,s="",a=[],d=r.thead?0:1,u=t.getAttribute("data-sort-method"),l=t.getAttribute("aria-sort");if(r.table.dispatchEvent(m("beforeSort")),e||(l="ascending"===l||"descending"!==l&&r.options.descending?"descending":"ascending",t.setAttribute("aria-sort",l)),!(r.table.rows.length<2)){if(!u){for(;a.length<3&&d<r.table.tBodies[0].rows.length;)0<(s=(s=(f=n?A(r.table.tBodies[0].rows[d].cells,n):r.table.tBodies[0].rows[d].cells[o])?p(f,r.options):"").trim()).length&&a.push(s),d++;if(!a)return}for(d=0;d<x.length;d++)if(s=x[d],u){if(s.name===u){i=s.sort;break}}else if(a.every(s.pattern)){i=s.sort;break}for(r.col=o,d=0;d<r.table.tBodies.length;d++){var c,f,h=[],b={},w=0,g=0;if(!(r.table.tBodies[d].rows.length<2)){for(c=0;c<r.table.tBodies[d].rows.length;c++)"none"===(s=r.table.tBodies[d].rows[c]).getAttribute("data-sort-method")?b[w]=s:(f=n?A(s.cells,n):s.cells[r.col],h.push({tr:s,td:f?p(f,r.options):"",index:w})),w++;for("descending"===l?h.sort(E(i,!0)):(h.sort(E(i,!1)),h.reverse()),c=0;c<w;c++)b[c]?(s=b[c],g++):s=h[c-g].tr,r.table.tBodies[d].appendChild(s)}}r.table.dispatchEvent(m("afterSort"))}},refresh:function(){void 0!==this.current&&this.sortTable(this.current,!0)}},"undefined"!=typeof module&&module.exports?module.exports=r:window.Tablesort=r}();

view-webapp/src/main/webapp/tour-registration.inc.html

@@ -18,8 +18,9 @@
           <th>Country</th>
           <th>Club</th>
           <th>Rank</th>
-          <th>Rating</th>
+          ## TableSort bug which inverts specified sort...
-          <th>Participation</th>
+          <th data-sort-default="1" aria-sort="ascending">Rating</th>
+          <th data-sort-method="none">Participation</th>
         </thead>
         <tbody>
 #foreach($part in $parts)

view-webapp/src/main/webapp/tour-standings.inc.html

@@ -66,7 +66,7 @@
           <td>$part.num</td>
           <td>$part.place</td>
           <td>$part.name $part.firstname</td>
-          <td>#rank($part.rank)</td>
+          <td data-sort="$part.rank">#rank($part.rank)</td>
           <td>$part.country</td>
           <td>$number.format('0.#', $part.NBW)</td>
   #set($mx = $round - 1)