Merge pull request #499 from frank-weinberg/feature/blink-overtime

improve user guidance at game end
rollerderby · Dec 30, 2021 · b20fbfb · b20fbfb
2 parents 1dffaf4 + 1c3b6b5
commit b20fbfb
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 28 deletions.
diff --git a/html/components/team-time-tab.css b/html/components/team-time-tab.css
@@ -1,5 +1,6 @@
 
-#GameControl.clickMe { color: green !important; font-size: 200% !important; } 
+.MetaControl .clickMe { color: black; background: #ff9010; } 
+.MetaControl .ui-button.ui-state-active { color: black; background: #0c0; } 
 
 /* Key Control */
 .KeyControl span.Indicator { font-size: 75%; } 

diff --git a/html/components/team-time-tab.js b/html/components/team-time-tab.js
@@ -133,7 +133,7 @@ function createMetaControlTable(gameId) {
       }
     });
 
-  $('<button>')
+  var startButton = $('<button>')
     .attr('id', 'GameControl')
     .text('Start New Game')
     .addClass('clickMe')
@@ -142,6 +142,11 @@ function createMetaControlTable(gameId) {
     .on('click', function () {
       createGameControlDialog(gameId);
     });
+  var firstLoad = true;
+  setTimeout(function () {
+    firstLoad = false;
+    updateHighlights();
+  }, 120000);
 
   var periodEndControlsLabel = $('<label>')
     .attr('for', 'PeriodEndControlsCheckbox')
@@ -154,30 +159,8 @@ function createMetaControlTable(gameId) {
     .button()
     .on('click', function () {
       table.find('tr.PeriodEnd').toggleClass('Hidden', !this.checked);
+      updateHighlights();
     });
-  var doPulseFlag = false;
-  var doPulse = function () {
-    if (doPulseFlag) {
-      periodEndControlsLabel.fadeTo(500, 0.25).fadeTo(500, 1, doPulse);
-    } else {
-      setTimeout(doPulse, 500);
-    }
-  };
-  doPulse();
-  WS.Register(
-    [
-      'ScoreBoard.Game(' + gameId + ').NoMoreJam',
-      'ScoreBoard.Game(' + gameId + ').Clock(Period).Number',
-      'ScoreBoard.Game(' + gameId + ').Rule(Period.Number)',
-    ],
-    function (k, v) {
-      var noMoreJam = isTrue(WS.state['ScoreBoard.Game(' + gameId + ').Clock(Period).Time']);
-      var last =
-        WS.state['ScoreBoard.Game(' + gameId + ').Rulesets.CurrentRule(Period.Number)'] ===
-        WS.state['ScoreBoard.Game(' + gameId + ').Clock(Period).Number'];
-      doPulseFlag = noMoreJam && last;
-    }
-  );
 
   var confirmedButton = toggleButton('ScoreBoard.Game(' + gameId + ').OfficialScore', 'Official Score', 'Unofficial Score');
   confirmedButton.appendTo(periodEndTd);
@@ -190,15 +173,37 @@ function createMetaControlTable(gameId) {
     .on('click', function () {
       periodEndTimeoutDialog.dialog('open');
     });
-  WS.Register('ScoreBoard.Game(' + gameId + ').Rule(Period.Number)');
-  $('<button>')
+  var otButton = $('<button>')
     .text('Overtime')
     .appendTo(periodEndTd)
     .button()
     .on('click', function () {
       createOvertimeDialog(WS.state['ScoreBoard.Game(' + gameId + ').Rule(Period.Number)'], gameId);
     });
 
+  function updateHighlights() {
+    var noPeriod = !isTrue(WS.state['ScoreBoard.Game(' + gameId + ').InPeriod']);
+    var last =
+      WS.state['ScoreBoard.Game(' + gameId + ').Rule(Period.Number)'] == WS.state['ScoreBoard.Game(' + gameId + ').Clock(Period).Number'];
+    var tie = WS.state['ScoreBoard.Game(' + gameId + ').Team(1).Score'] === WS.state['ScoreBoard.Game(' + gameId + ').Team(2).Score'];
+    var official = isTrue(WS.state['ScoreBoard.Game(' + gameId + ').OfficialScore']);
+
+    startButton.toggleClass('clickMe', official || firstLoad);
+    periodEndControlsLabel.toggleClass('clickMe', noPeriod && last && !official && table.find('tr.PeriodEnd').hasClass('Hidden'));
+    confirmedButton.toggleClass('clickMe', noPeriod && last && !tie && !official);
+    otButton.toggleClass('clickMe', noPeriod && last && tie && !official);
+  }
+  WS.Register(
+    [
+      'ScoreBoard.Game(' + gameId + ').InPeriod',
+      'ScoreBoard.Game(' + gameId + ').Clock(Period).Number',
+      'ScoreBoard.Game(' + gameId + ').Rule(Period.Number)',
+      'ScoreBoard.Game(' + gameId + ').Team(*).Score',
+      'ScoreBoard.Game(' + gameId + ').OfficialScore',
+    ],
+    updateHighlights
+  );
+
   return table;
 }
 
@@ -240,7 +245,6 @@ function createGameControlDialog(gameId) {
   var adhocState = $('<div>').addClass('section').appendTo(dialog);
 
   var adhocStartGame = function () {
-    $('#GameControl').removeClass('clickMe');
     var StartTime = adhocGame.find('input.StartTime').val();
     var IntermissionClock = null;
     var points1 = Number(adhocState.find('input.Points.Team1').val());