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
  );