Merge pull request online-go#2402 from online-go/annullment-reasons

Add some explanations as to why a game was annulled
GreenAsJade · Oct 24, 2023 · 3788358 · 3788358
2 parents 4332572 + 87ab944
commit 3788358
Show file tree

Hide file tree

Showing 6 changed files with 242 additions and 101 deletions.
diff --git a/src/models/games.d.ts b/src/models/games.d.ts
@@ -56,6 +56,7 @@ declare namespace rest_api {
         black_lost: boolean;
         white_lost: boolean;
         annulled: boolean;
+        annulment_reason: null | AnnulmentReason;
         started: string; // ISODate
         ended: string; // ISODate
         // For Game History, guaranteed to include the player of interest.
@@ -201,6 +202,28 @@ declare namespace rest_api {
         [flag_key: string]: number | boolean;
     }
 
+    interface AnnulmentReason {
+        /** If a player leaves a bot game, or a bot crashes, don't rate the game.  */
+        bot_game_abandoned?: boolean;
+
+        /** Accounts for players who leave the site with a number of
+         * correspondence games going on */
+        mass_correspondence_timeout_protection?: boolean;
+
+        /* This accounts for a bug in our disconnection code which triggered
+         * incorrectly for correspondence games */
+        correspondence_disconnection?: boolean;
+
+        /** Manually annulled by a moderator */
+        moderator_annulled?: boolean;
+
+        /** We have had some terrible bots, we don't count some of them */
+        bad_bot?: boolean;
+
+        /** For invalid handicaps that got into the system, don't rate */
+        handicap_out_of_range?: boolean;
+    }
+
     /**
      * The response from `games/%game_id%`
      */

diff --git a/src/views/Game/Game.styl b/src/views/Game/Game.styl
@@ -82,115 +82,21 @@ goban-view-bar-width=400px
         box-shadow: 0 3px 5px 1px rgba(50,50,50,0.51) !important;
     }
 
-    .play-controls {
-        flex-grow: 0;
-        flex-shrink: 0;
-        display: block;
-        user-select: none;
-        display: flex;
-        align-items: flex-start;
-        flex-direction: column;
-        justify-content: center;
-        padding-top: 0.5rem;
-        max-width: 100vw;
-        //height: 23rem;
-        //min-height: 5rem;
-
-        > div {
-            width: 100%;
-        }
-
-        .annulled-indicator {
-            color: red;
-            text-align: center;
-        }
-
-        .game-action-buttons {
-            position: relative;
-            text-align: center;
-        }
-
-        .analyze-mode-buttons {
-            display: flex;
-            flex-direction: column;
-            justify-content: space-around;
-            align-items: center;
-            margin-top: 5px;
-            margin-bottom: 5px;
-            button {
-                themed background-color success
-                themed-darken border-color success border-darken-amount
-            }
-            button:hover {
-                themed-lighten background-color success button-highlight-brighten-amount
-                themed-darken border-color success button-border-highlight-darken-amount
-            }
-        }
-        .pause-controls {
-            text-align: center;
-        }
-        .play-buttons {
-            height: 2.6rem;
-            min-height: 2.6rem;
-            display: flex;
-            width: 100%;
-            justify-content: space-between;
-            > span {
-                flex-grow: 1;
-                flex-basis: 33%;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-            }
-            > span:first-child {
-                justify-content: flex-start;
-            }
-            > span:last-child {
-                justify-content: flex-end;
-            }
-        }
-        .stone-removal-controls {
-            text-align: center;
-
-            .explanation {
-                padding: 1rem;
-                font-style: italic;
-            }
-        }
-        .cancel-button {
-            /*
-            position: absolute;
-            right: 0.5em;
-            bottom: 0.5em;
-            */
-        }
-        .undo-button {
-            //position: absolute;
-            //left: 0.5em;
-        }
-        .accept-undo-button {
-            /*
-            position: absolute;
-            left: 0.5em;
-            bottom: 0.5em;
-            */
-        }
-    }
 
     .filler {
         flex-grow: 1;
         flex-basis: 95%;
     }
 
     .center-col {
-        .play-controls {
+        .PlayControls {
             flex-grow: 0;
             padding-top: 0;
         }
     }
 
     &.wide .right-col {
-        .play-controls {
+        .PlayControls {
             flex-grow: 1;
             flex-shrink: 0;
             //justify-content: center;
@@ -503,7 +409,7 @@ goban-view-bar-width=400px
 			#move-tree-container {
 				display: none;
 			}
-			.play-controls {
+			.PlayControls {
 				flex-grow: 0;
                 /*
                 .accept-undo-button {

diff --git a/src/views/Game/Game.tsx b/src/views/Game/Game.tsx
@@ -125,6 +125,7 @@ export function Game(): JSX.Element {
     const [black_flags, set_black_flags] = React.useState<null | rest_api.GamePlayerFlags>(null);
     const [white_flags, set_white_flags] = React.useState<null | rest_api.GamePlayerFlags>(null);
     const [annulled, set_annulled] = React.useState(false);
+    const [annulment_reason, set_annulment_reason] = React.useState<rest_api.AnnulmentReason>(null);
     const [ai_review_enabled, set_ai_review_enabled] = React.useState(
         preferences.get("ai-review-enabled"),
     );
@@ -761,6 +762,7 @@ export function Game(): JSX.Element {
             updateVariationName={updateVariationName}
             variationKeyPress={variationKeyPress}
             annulled={annulled}
+            annulment_reason={annulment_reason}
             zen_mode={zen_mode}
             selected_chat_log={selected_chat_log}
             stopEstimatingScore={stopEstimatingScore}
@@ -1293,6 +1295,7 @@ export function Game(): JSX.Element {
                     tournament_id.current = game.tournament;
 
                     set_annulled(game.annulled);
+                    set_annulment_reason(game.annulment_reason);
                     set_historical_black(game.historical_ratings.black);
                     set_historical_white(game.historical_ratings.white);
 

diff --git a/src/views/Game/PlayControls.styl b/src/views/Game/PlayControls.styl
@@ -1,3 +1,136 @@
-.play-controls {
-  min-height: 5rem;
+.PlayControls {
+    flex-grow: 0;
+    flex-shrink: 0;
+    display: block;
+    user-select: none;
+    display: flex;
+    align-items: flex-start;
+    flex-direction: column;
+    justify-content: center;
+    padding-top: 0.5rem;
+    max-width: 100vw;
+    min-height: 5rem;
+
+    // height: 23rem;
+    // min-height: 5rem;
+    > div {
+        width: 100%;
+    }
+
+    .annulled-indicator {
+        color: red;
+        text-align: center;
+        position: relative;
+        cursor: help;
+
+        .fa {
+            themed: color shade1;
+            margin-left: 0.5rem;
+        }
+
+        .annulment-reason {
+            display: none;
+        }
+    }
+
+    .annulled-indicator:hover {
+        .annulment-reason {
+            display: inline-block;
+            position: absolute;
+            top: 1.1rem;
+            left: 50%;
+            transform: translateX(-50%);
+            themed: background-color shade4;
+            border: 1px solid;
+            themed: border-color shade3;
+            z-index: z.popover;
+            themed: color fg;
+            padding: 0.5rem;
+            border-radius: 0.5rem;
+            max-width: 90vw;
+            text-align: justify;
+        }
+    }
+
+    .game-action-buttons {
+        position: relative;
+        text-align: center;
+    }
+
+    .analyze-mode-buttons {
+        display: flex;
+        flex-direction: column;
+        justify-content: space-around;
+        align-items: center;
+        margin-top: 5px;
+        margin-bottom: 5px;
+
+        button {
+            themed: background-color success;
+            themed-darken: border-color success border-darken-amount;
+        }
+
+        button:hover {
+            themed-lighten: background-color success button-highlight-brighten-amount;
+            themed-darken: border-color success button-border-highlight-darken-amount;
+        }
+    }
+
+    .pause-controls {
+        text-align: center;
+    }
+
+    .play-buttons {
+        height: 2.6rem;
+        min-height: 2.6rem;
+        display: flex;
+        width: 100%;
+        justify-content: space-between;
+
+        > span {
+            flex-grow: 1;
+            flex-basis: 33%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+
+        > span:first-child {
+            justify-content: flex-start;
+        }
+
+        > span:last-child {
+            justify-content: flex-end;
+        }
+    }
+
+    .stone-removal-controls {
+        text-align: center;
+
+        .explanation {
+            padding: 1rem;
+            font-style: italic;
+        }
+    }
+
+    .cancel-button {
+        /*
+        position: absolute;
+        right: 0.5em;
+        bottom: 0.5em;
+        */
+    }
+
+    .undo-button {
+        // position: absolute;
+        // left: 0.5em;
+    }
+
+    .accept-undo-button {
+        /*
+        position: absolute;
+        left: 0.5em;
+        bottom: 0.5em;
+        */
+    }
 }
diff --git a/src/views/Game/PlayControls.test.tsx b/src/views/Game/PlayControls.test.tsx
@@ -67,6 +67,7 @@ const PLAY_CONTROLS_DEFAULTS = {
         return;
     },
     annulled: false,
+    annulment_reason: null,
     zen_mode: false,
     selected_chat_log: "main",
     stopEstimatingScore: () => {