Add typings for window.

The codebase is littered with (window as any).some_field.  This diff applies some
types.  There are two benefits:

- More consistency when storing and accessing fields.
- Centralized documentation of the global variables.

src/components/ChatUserList/ChatUserList.tsx

@@ -43,7 +43,7 @@ export function ChatUserList(props: ChatUserListProperties): JSX.Element {
         proxy.current.on("part", () => refresh(proxy?.current?.channel.users_by_name.length || 0));
         proxy.current.on("join", () => console.log("JOin!"));
         proxy.current.on("part", () => console.log("Part!"));
-        (window as any)["proxy"] = proxy.current;
+        window.proxy = proxy.current;
         refresh(proxy.current.channel.users_by_name.length);
 
         return () => {

src/components/ErrorBoundary/ErrorBoundary.tsx

@@ -97,7 +97,7 @@ export class ErrorBoundary extends React.Component<ErrorBoundaryProps, any> {
     }
 }
 
-(window as any)["test_sentry"] = () => {
+window.test_sentry = () => {
     try {
         throw new Error("SENTRY TEST");
     } catch (e) {

src/components/MiniGoban/MiniGoban.tsx

@@ -140,7 +140,7 @@ export function MiniGoban(props: MiniGobanProps): JSX.Element {
         }
 
         if (props.sampleOptions?.undo) {
-            (window as any)["mini_goban"] = goban.current;
+            window.mini_goban = goban.current;
             //goban.current.visual_undo_request_indicator = true;
             goban.current.engine.undo_requested = goban.current.engine.cur_move.move_number;
         }

src/components/NetworkStatus/NetworkStatus.tsx

@@ -87,7 +87,7 @@ export function NetworkStatus(): JSX.Element | null {
         in_live_game ? "in live game," : "not in live game,",
         manually_closed ? "manually closed notification," : "didn't close notification",
         "time control:",
-        (window as any)["global_goban"]?.engine?.time_control,
+        window.global_goban?.engine?.time_control,
     );
 
     if (state === "connected" || state === "went-away") {

src/components/Notifications/NotificationManager.tsx

@@ -198,7 +198,7 @@ export class NotificationManager {
     event_emitter: TypedEventEmitter<NotificationManagerEvents>;
 
     constructor() {
-        (window as any)["notification_manager"] = this;
+        window.notification_manager = this;
         this.event_emitter = new TypedEventEmitter<NotificationManagerEvents>();
 
         this.notifications = {};

src/components/TimeControl/util.ts

@@ -15,7 +15,7 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { computeAverageMoveTime, GobanRenderer, JGOFTimeControl } from "goban";
+import { computeAverageMoveTime, JGOFTimeControl } from "goban";
 import { _, pgettext, ngettext, interpolate } from "@/lib/translate";
 import { TimeControl, TimeControlTypes } from "./TimeControl";
 
@@ -454,7 +454,7 @@ export function usedForCheating(_time_control: ValidTimeControlFormats) {
 
 export function lookingAtOurLiveGame(): boolean {
     // Is the current page looking at a game we are live playing in...
-    const goban = (window as any)["global_goban"] as GobanRenderer;
+    const goban = window.global_goban;
     if (!goban) {
         return false;
     }

src/lib/configure-goban.tsx

@@ -26,8 +26,8 @@ import { Goban, GobanBase, GobanEngine, setGobanRenderer } from "goban";
 import { sfx } from "@/lib/sfx";
 import { toast } from "@/lib/toast";
 
-(window as any)["GobanThemes"] = Goban.THEMES;
-(window as any)["GobanEngine"] = GobanEngine;
+window.GobanThemes = Goban.THEMES;
+window.GobanEngine = GobanEngine;
 
 let previous_toast: any = null;
 

src/lib/debug.ts

@@ -63,4 +63,4 @@ export default class Debug {
     }
 }
 
-(window as any)["debug"] = debug;
+window.debug = debug;

src/lib/hooks.ts

@@ -66,8 +66,8 @@ export function useRefresh(): () => void {
     return React.useCallback(() => refresh(() => Math.random()), [refresh]);
 }
 
-export function useMainGoban(): Goban | null {
-    return (window as any)["global_goban"];
+export function useMainGoban(): Goban | null | undefined {
+    return window.global_goban;
 }
 
 export const useIsDesktop = () => {

src/lib/image_resizer.ts

@@ -28,7 +28,7 @@ export function image_resizer(
     }
 
     console.log(file);
-    (window as any)["file"] = file;
+    window.file = file;
 
     const reader = new FileReader();
     const image = new Image();

src/lib/misc.ts

@@ -1193,7 +1193,7 @@ const real_now = Date.now;
 export function skew_clock(ms: number): void {
     Date.now = () => real_now() + ms;
 }
-(window as any).skew_clock = skew_clock;
+window.skew_clock = skew_clock;
 
 /** Returns true if we are running in local development or on a beta site.
  * False if we are running in production. */

src/lib/ogsHistory.ts

@@ -18,4 +18,4 @@
 import { createBrowserHistory } from "history";
 
 export const browserHistory = createBrowserHistory();
-(window as any)["browserHistory"] = browserHistory;
+window.browserHistory = browserHistory;

src/lib/report_manager.tsx

@@ -414,4 +414,4 @@ function compare_reports(a: Report, b: Report): number {
 
 export const report_manager = new ReportManager();
 
-(window as any)["report_manager"] = report_manager;
+window.report_manager = report_manager;

src/lib/sfx.ts

@@ -447,7 +447,7 @@ export class SFXManager {
         const release_base: string = data.get("config.cdn_release", "");
         const howl = new Howl({
             src:
-                (window as any).safari !== undefined // As of safari 14.1, their webm implementation cannot play our webm audio files correctly.
+                window.safari !== undefined // As of safari 14.1, their webm implementation cannot play our webm audio files correctly.
                     ? [`${release_base}/sound/${sprite_pack.filename_prefix}.mp3`]
                     : [
                           `${release_base}/sound/${sprite_pack.filename_prefix}.webm`,
@@ -630,7 +630,7 @@ export class SFXManager {
 
 export { sprite_packs } from "./sfx_sprites";
 export const sfx = new SFXManager();
-(window as any)["sfx"] = sfx;
+window.sfx = sfx;
 
 const I = setInterval(() => {
     /* postpone downloading stuff till more important things have begun loading */
@@ -643,7 +643,7 @@ const I = setInterval(() => {
 }, 100);
 
 /* Check and warn if we don't have an effect mapping for every sound voice sound */
-(window as any)["sprite_packs"] = sprite_packs;
+window.sprite_packs = sprite_packs;
 const effects = sprite_packs["zz-un-effects"];
 for (const pack of [GameVoiceSounds, CountdownSounds, StoneSounds, EffectsSounds]) {
     for (const name of pack) {

src/lib/sockets.ts

@@ -21,7 +21,7 @@ import { lookingAtOurLiveGame } from "@/components/TimeControl/util";
 
 const debug = new Debug("sockets");
 
-export const socket = new GobanSocket((window as any)["websocket_host"] ?? window.location.origin);
+export const socket = new GobanSocket(window.websocket_host ?? window.location.origin);
 
 // Updated to be more helpful (shorter) when we know latencies
 socket.options.ping_interval = 10000;
@@ -38,7 +38,7 @@ const MAX_TIMEOUT_DELAY = 14000;
 export let ai_host = "https://beta-ai.online-go.com";
 if (
     window.location.hostname.indexOf("dev.beta") >= 0 &&
-    (window as any)["websocket_host"] === "https://online-go.com"
+    window.websocket_host === "https://online-go.com"
 ) {
     // if we're developing locally but connecting to the production system, use our local system for estimation
     ai_host = `http://localhost:13284`;
@@ -97,7 +97,7 @@ socket.on("latency", (latency, drift) => {
     // If they are playing a live game at the moment, work out what timing they would like
     // us to make sure that they have...
     if (lookingAtOurLiveGame()) {
-        const goban = (window as any)["global_goban"] as GobanRenderer;
+        const goban = window.global_goban as GobanRenderer;
         const time_control = goban.engine.time_control as JGOFTimeControl;
         switch (time_control.system) {
             case "fischer":
@@ -192,4 +192,4 @@ export default {
     get_network_latency: get_network_latency,
 };
 
-(window as any)["socket"] = socket;
+window.socket = socket;

src/lib/swal_config.ts

@@ -34,4 +34,4 @@ export const alert = Swal.mixin({
     allowEscapeKey: true,
 });
 
-(window as any)["swal"] = alert;
+window.swal = alert;

src/lib/toast.tsx

@@ -89,4 +89,4 @@ export function toast(element: React.ReactElement<any>, timeout: number = 0): To
     return ret;
 }
 
-(window as any)["toast"] = toast;
+window.toast = toast;

src/lib/translate.test.ts

@@ -4,8 +4,8 @@
  */
 
 // Set the window variables before importing the module
-(window as any)["ogs_current_language"] = "test_language";
-(window as any)["ogs_locales"] = {
+window.ogs_current_language = "test_language";
+window.ogs_locales = {
     en: {},
     test_language: {
         msgid_1: ["translation_1"],
@@ -16,7 +16,7 @@
         "context\u0004singular\u0005plural": ["tr_singular_2", "tr_plural_2"],
     },
 };
-(window as any)["ogs_countries"] = {
+window.ogs_countries = {
     en: { us: "United States" },
     test_language: { test_cc: "test_country" },
 };

src/main.tsx

@@ -121,7 +121,7 @@ import * as preferences from "@/lib/preferences";
 
 try {
     // default_theme is set in index.html based on looking at the OS theme
-    data.setDefault("theme", (window as any)["default_theme"]);
+    data.setDefault("theme", window.default_theme);
 } catch (e) {
     data.setDefault("theme", "light");
 }
@@ -145,16 +145,13 @@ data.setDefault("config", { user: default_user });
 
 data.setDefault("config.user", default_user);
 
-data.setDefault("config.cdn", (window as any)["cdn_service"]);
+data.setDefault("config.cdn", window.cdn_service);
 data.setDefault(
     "config.cdn_host",
-    (window as any)["cdn_service"].replace("https://", "").replace("http://", "").replace("//", ""),
+    window.cdn_service.replace("https://", "").replace("http://", "").replace("//", ""),
 );
-data.setDefault(
-    "config.cdn_release",
-    (window as any)["cdn_service"] + "/" + (window as any)["ogs_release"],
-);
-data.setDefault("config.release", (window as any)["ogs_release"]);
+data.setDefault("config.cdn_release", window.cdn_service + "/" + window.ogs_release);
+data.setDefault("config.release", window.ogs_release);
 
 configure_goban();
 
@@ -224,7 +221,7 @@ try {
 
 player_cache.update(user);
 data.set("user", user);
-(window as any)["user"] = user;
+window.user = user;
 
 console.log("initial user", user);
 /***
@@ -280,7 +277,7 @@ sockets.socket.on("user/update", (user: any) => {
         data.set("config.user", user);
         player_cache.update(user);
         data.set("user", user);
-        (window as any)["user"] = user;
+        window.user = user;
     } else {
         console.log("Ignoring user update for user", user);
     }
@@ -337,9 +334,9 @@ react_root.render(
     </React.StrictMode>,
 );
 
-(window as any)["data"] = data;
-(window as any)["preferences"] = preferences;
-(window as any)["player_cache"] = player_cache;
+window.data = data;
+window.preferences = preferences;
+window.player_cache = player_cache;
 
 import * as requests from "@/lib/requests";
-(window as any)["requests"] = requests;
+window.requests = requests;

src/views/Game/AIReview.tsx

@@ -102,7 +102,7 @@ export class AIReview extends React.Component<AIReviewProperties, AIReviewState>
             table_hidden: preferences.get("ai-summary-table-show"),
         };
         this.state = state;
-        (window as any)["aireview"] = this;
+        window.aireview = this;
     }
 
     componentDidMount() {

src/views/Game/AntiGrief.tsx

@@ -38,7 +38,7 @@ let was_player = false;
 function checkForLeavingLiveGame(pathname: string) {
     try {
         const user = data.get("user");
-        const goban = (window as any)["global_goban"];
+        const goban = window.global_goban;
         const was_on_page = on_game_page;
         const was_live_game = live_game;
 

src/views/Game/Game.tsx

@@ -1144,7 +1144,7 @@ export function Game(): JSX.Element | null {
         goban.current = createGoban(opts);
 
         onResize(true);
-        (window as any)["global_goban"] = goban.current;
+        window.global_goban = goban.current;
         if (review_id) {
             goban.current.setMode("analyze");
         }
@@ -1617,8 +1617,8 @@ export function Game(): JSX.Element | null {
             if (autoplay_timer.current) {
                 clearTimeout(autoplay_timer.current);
             }
-            (window as any)["Game"] = null;
-            (window as any)["global_goban"] = null;
+            window.Game = null;
+            window.global_goban = null;
 
             setExtraActionCallback(null as any);
             $(window).off("focus", onFocus);

src/views/Joseki/Joseki.tsx

@@ -340,7 +340,7 @@ class _Joseki extends React.Component<JosekiProps, JosekiState> {
         this.goban = createGoban(opts);
         this.goban.setMode("puzzle");
         this.goban.on("update", () => this.onBoardUpdate());
-        (window as any)["global_goban"] = this.goban;
+        window.global_goban = this.goban;
     };
 
     componentDidMount = () => {

src/views/LearningHub/InstructionalGoban.tsx

@@ -90,7 +90,7 @@ export class InstructionalGoban extends React.Component<InstructionalGobanProps>
             },
             this.props.config,
         );
-        (window as any)["goban"] = this.goban;
+        window.goban = this.goban;
 
         this.goban.setMode(this.props.config.mode || "puzzle");
         if (this.props.config.engine_phase) {

src/views/LearningHub/LearningPage.tsx

@@ -220,7 +220,7 @@ export abstract class LearningPage extends React.Component<LearningPagePropertie
                     this.instructional_goban!.goban!.engine.getStoneRemovalString(),
                 );
             });
-            (window as any)["global_goban"] = r.goban;
+            window.global_goban = r.goban;
         }
     };
 

src/views/Puzzle/Puzzle.tsx

@@ -290,7 +290,7 @@ export class _Puzzle extends React.Component<PuzzleProperties, PuzzleState> {
         }
         this.goban = createGoban(opts);
         this.goban.setMode("puzzle");
-        (window as any)["global_goban"] = this.goban;
+        window.global_goban = this.goban;
         this.goban.on("update", () => this.onUpdate());
 
         this.goban.on("puzzle-wrong-answer", this.onWrongAnswer);

src/views/SignIn/SignIn.tsx

@@ -29,7 +29,7 @@ import { useUser } from "@/lib/hooks";
 
 import { SocialLoginButtons } from "@/components/SocialLoginButtons";
 
-(window as any)["Md5"] = Md5;
+window.Md5 = Md5;
 import { alert } from "@/lib/swal_config";
 import { LoadingButton } from "@/components/LoadingButton";
 

src/views/Supporter/Supporter.tsx

@@ -154,7 +154,7 @@ function load_checkout_libraries(): void {
             script.async = true;
             //script.charset = "utf-8";
             script.onload = () => {
-                (window as any)["stripe"] = stripe = new Stripe(data.get("config")?.stripe_pk);
+                window.stripe = stripe = new Stripe(data.get("config")?.stripe_pk);
                 resolve();
             };
             script.onerror = () => {

src/views/Tournament/Tournament.tsx

@@ -852,7 +852,7 @@ export function Tournament(): JSX.Element {
         }
     };
 
-    (window as any)["tournament"] = tournament;
+    window.tournament = tournament;
 
     let tournament_time_start_text = "";
     if (tournament.time_start) {
@@ -2631,7 +2631,7 @@ function OpenGothaRoster({
     tournament: TournamentInterface;
     players: TournamentPlayer[];
 }): JSX.Element {
-    (window as any)["players"] = players;
+    window.players = players;
     players.sort((a, b) => a.username.localeCompare(b.username));
     return (
         <div className="OpenGothaRoster">
@@ -2674,7 +2674,7 @@ function OpenGothaTournamentRound({
     const [notes, _set_notes]: [string, (s: string) => void] = React.useState(roundNotes);
     const [notes_updated, set_notes_updated]: [boolean, (b: boolean) => void] =
         React.useState(false);
-    (window as any)["rounds"] = rounds;
+    window.rounds = rounds;
     const round_started = !!(
         rounds.length >= selectedRound && (rounds[selectedRound - 1]?.matches.length || 0) > 0
     );