From 897246c7a6f1699609feebbbcfa0fa9ea882b11f Mon Sep 17 00:00:00 2001 From: Claude Brisson Date: Thu, 18 Jan 2024 06:57:34 +0100 Subject: [PATCH] Review paired list content layout ; ESC for unselection --- view-webapp/src/main/sass/tour.scss | 16 ++++++ view-webapp/src/main/webapp/js/main.js | 56 +++++++++++-------- .../src/main/webapp/tour-pairing.inc.html | 16 ++++-- 3 files changed, 61 insertions(+), 27 deletions(-) diff --git a/view-webapp/src/main/sass/tour.scss b/view-webapp/src/main/sass/tour.scss index 1e0230f..78386a0 100644 --- a/view-webapp/src/main/sass/tour.scss +++ b/view-webapp/src/main/sass/tour.scss @@ -202,6 +202,22 @@ } } } + #paired { + .listitem { + position: relative; + gap: 0; + .table, .handicap { + width: 3em; + } + .black, .white { + width: 45%; + } + .levels { + width: 6em; + } + } + + } #pairing-buttons { display: flex; flex-flow: column nowrap; diff --git a/view-webapp/src/main/webapp/js/main.js b/view-webapp/src/main/webapp/js/main.js index 5cbeb44..6ff4174 100644 --- a/view-webapp/src/main/webapp/js/main.js +++ b/view-webapp/src/main/webapp/js/main.js @@ -189,44 +189,56 @@ onLoad(() => { // keyboard handling document.on('keyup', e => { + let tab = document.location.hash; switch (e.key) { case 'Escape': { - if ($('#player').hasClass('shown') && $('#needle')[0].value) { + if (tab === '#registration') { + if ($('#player').hasClass('shown') && $('#needle')[0].value) { $('#needle')[0].value = ''; initSearch(); - } else { - close_modal(); + } else { + close_modal(); + } + } else if (tab === '#pairing') { + console.log('here') + $('#pairing-lists .selected.listitem').removeClass('selected'); } break; } case 'ArrowDown': { - if (typeof(searchResultShown) === 'function' && searchResultShown()) { - let lines = $('.result-line'); - if (typeof (searchHighlight) === 'undefined') searchHighlight = 0; - else ++searchHighlight; - searchHighlight = Math.min(searchHighlight, lines.length - 1); - lines.removeClass('highlighted'); - lines[searchHighlight].addClass('highlighted'); + if (tab === '#registration') { + if (typeof(searchResultShown) === 'function' && searchResultShown()) { + let lines = $('.result-line'); + if (typeof (searchHighlight) === 'undefined') searchHighlight = 0; + else ++searchHighlight; + searchHighlight = Math.min(searchHighlight, lines.length - 1); + lines.removeClass('highlighted'); + lines[searchHighlight].addClass('highlighted'); + } } break; } case 'ArrowUp': { - if (typeof(searchResultShown) === 'function' && searchResultShown()) { - let lines = $('.result-line'); - if (typeof (searchHighlight) === 'undefined') searchHighlight = 0; - else --searchHighlight; - searchHighlight = Math.max(searchHighlight, 0); - lines.removeClass('highlighted'); - lines[searchHighlight].addClass('highlighted'); + if (tab === '#registration') { + if (typeof(searchResultShown) === 'function' && searchResultShown()) { + let lines = $('.result-line'); + if (typeof (searchHighlight) === 'undefined') searchHighlight = 0; + else --searchHighlight; + searchHighlight = Math.max(searchHighlight, 0); + lines.removeClass('highlighted'); + lines[searchHighlight].addClass('highlighted'); + } } break; } case 'Enter': { - if (typeof(searchResultShown) === 'function') { - if (searchResultShown()) { - fillPlayer(searchResult[searchHighlight]); - } else { - $('#register')[0].click(); + if (tab === '#registration') { + if (typeof(searchResultShown) === 'function') { + if (searchResultShown()) { + fillPlayer(searchResult[searchHighlight]); + } else { + $('#register')[0].click(); + } } } break; diff --git a/view-webapp/src/main/webapp/tour-pairing.inc.html b/view-webapp/src/main/webapp/tour-pairing.inc.html index 9468c74..05f2a95 100644 --- a/view-webapp/src/main/webapp/tour-pairing.inc.html +++ b/view-webapp/src/main/webapp/tour-pairing.inc.html @@ -48,11 +48,17 @@
- #foreach($game in $games) - #set($white = $pmap[$game.w]) - #set($black = $pmap[$game.b]) -
#$game.t#if($white)$white.name $white.firstname #rank($white.rank)#{else}BIP#end #if($black)$black.name $black.firstname #rank($black.rank)#{else}BIP#end#if($game.h)h$game.h#end
- #end +#foreach($game in $games) + #set($white = $pmap[$game.w]) + #set($black = $pmap[$game.b]) +
+
#$game.t
+
#if($white)$white.name $white.firstname#{else}BIP#end
+
#if($white)#rank($white.rank)#end / #if($black)#rank($black.rank)#end
+
#if($black)$black.name $black.firstname#{else}BIP#end
+
#if($game.h)h$game.h#{else} #end
+
+#end