Change prettier config

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "printWidth": 120
+}

public/index.html

@@ -16,16 +16,9 @@
     <meta property="og:url" content="https://cirri.al/sharks/" />
     <meta property="og:url" content="https://shark.tobot.tech/" />
     -->
-    <meta
+    <meta property="og:url" content="https://spencers145.github.io/SharkGame/" />
-      property="og:url"
-      content="https://spencers145.github.io/SharkGame/"
-    />
 
-    <meta
+    <meta property="og:image" itemprop="image" content="https://spencers145.github.io/SharkGame/img/sharkgame.png" />
-      property="og:image"
-      itemprop="image"
-      content="https://spencers145.github.io/SharkGame/img/sharkgame.png"
-    />
 
     <meta
       property="og:image:secure_url"
@@ -41,14 +34,8 @@
     />
 
     <link rel="shortcut icon" href="favicon.png" type="image/x-icon" />
-    <link
+    <link rel="image_src" href="https://spencers145.github.io/SharkGame/img/sharkgame.png" />
-      rel="image_src"
+    <link rel="apple-touch-icon" href="https://spencers145.github.io/SharkGame/img/sharkgame.png" />
-      href="https://spencers145.github.io/SharkGame/img/sharkgame.png"
-    />
-    <link
-      rel="apple-touch-icon"
-      href="https://spencers145.github.io/SharkGame/img/sharkgame.png"
-    />
 
     <link rel="stylesheet" type="text/css" href="./build/bundle.css" />
     <script defer type="module" src="./build/bundle.js"></script>
@@ -69,13 +56,9 @@
       <h1>Shark Game??</h1>
 
       <span
-        >Oh dear! It seems you have Javascript disabled, or that your current
+        >Oh dear! It seems you have Javascript disabled, or that your current browser does not support scripts.</span
-        browser does not support scripts.</span
-      >
-      <span
-        >Shark Game requires scripts to work. Otherwise it's just a static
-        webpage that doesn't do much.</span
       >
+      <span>Shark Game requires scripts to work. Otherwise it's just a static webpage that doesn't do much.</span>
       <span>In fact, it only displays this Shark asking you for scripts.</span>
 
       <pre>

src/App.svelte

@@ -17,15 +17,9 @@
     root = document.documentElement;
 
     SharkGame.Settings.settings.subscribe((settings) => {
-      root.classList.toggle(
+      root.classList.toggle("no-theme", !settings.appearance.enableThemes.current);
-        "no-theme",
-        !settings.appearance.enableThemes.current
-      );
       settings.appearance.theme.options.forEach((theme) => {
-        root.classList.toggle(
+        root.classList.toggle(theme, theme === settings.appearance.theme.current);
-          theme,
-          theme === settings.appearance.theme.current
-        );
       });
     });
   });

src/components/Header.svelte

@@ -14,11 +14,7 @@
       game.SaveHandler.save(game);
     },
     settings() {
-      openModal(
+      openModal(SettingsModal, { settings: game.Settings.settings }, { replace: true });
-        SettingsModal,
-        { settings: game.Settings.settings },
-        { replace: true }
-      );
     },
     help() {
       console.log("help");

src/components/Log.svelte

@@ -6,11 +6,7 @@
   import type { Writable } from "svelte/store";
   import { slide } from "svelte/transition";
 
-  import type {
+  import type { AddMessageEvent, ResetMessagesEvent, Message } from "../shark/Message";
-    AddMessageEvent,
-    ResetMessagesEvent,
-    Message,
-  } from "../shark/Message";
   import { MessageType } from "../shark/Message";
 
   export let messages: Writable<Message[]>;

src/components/Modals/SettingsModal.svelte

@@ -14,18 +14,10 @@
       <h4>{categoryName.toUpperCase()}</h4>
       <div class="settings-category" id={`settings-category-${categoryName}`}>
         {#each Object.entries(categorySettings) as [settingId, setting] (settingId)}
-          <div
+          <div class="settings-row" id={`settings-row-${categoryName}-${settingId}`}>
-            class="settings-row"
+            <div class="settings-description" id={`settings-description-${categoryName}-${settingId}`}>
-            id={`settings-row-${categoryName}-${settingId}`}
-          >
-            <div
-              class="settings-description"
-              id={`settings-description-${categoryName}-${settingId}`}
-            >
               {setting.name}<br />
-              <span class="settings-small-description"
+              <span class="settings-small-description">({setting.description})</span>
-                >({setting.description})</span
-              >
             </div>
             {#each setting.options as option}<button
                 disabled={setting.current === option}

src/components/ResourceTable/ResourceGroup.svelte

@@ -16,11 +16,7 @@
 </tr>
 {#if !collapsed}
   {#each resources as [resourceName, resource], index}
-    <tr
+    <tr transition:fade class:even={index % 2 === 0} class:odd={index % 2 === 1}>
-      transition:fade
-      class:even={index % 2 === 0}
-      class:odd={index % 2 === 1}
-    >
       <td colspan="2">{resourceName}</td>
       <td>{resource.amount}</td>
       <td>{Math.round(100 * (resource.change + Number.EPSILON)) / 100}/s</td>

src/components/Tabs/Home.svelte

@@ -10,9 +10,7 @@
 
   function homeActionClick(homeAction: HomeAction) {
     if (homeAction.effect.resource) {
-      const resources = Resources.getResources(
+      const resources = Resources.getResources(Object.keys(homeAction.effect.resource));
-        Object.keys(homeAction.effect.resource)
-      );
 
       if (resources !== null) {
         for (const [resourceName, resource] of Object.entries(resources)) {
@@ -23,10 +21,7 @@
 
     if (homeAction.outcomes) {
       dispatch("addMessage", {
-        message:
+        message: homeAction.outcomes[Math.floor(Math.random() * homeAction.outcomes.length)],
-          homeAction.outcomes[
-            Math.floor(Math.random() * homeAction.outcomes.length)
-          ],
       });
     }
   }

src/components/Wrapper.svelte

@@ -26,18 +26,9 @@
 </script>
 
 <main>
-  <div
+  <div id="left-column" class:expanded={sidebarExpanded} class:collapsed={!sidebarExpanded}>
-    id="left-column"
-    class:expanded={sidebarExpanded}
-    class:collapsed={!sidebarExpanded}
-  >
     <ResourceTable resources={game.Resources.Resources} />
-    <Log
+    <Log {logLength} messages={game.Log.messages} on:addMessage={handleAddMessage} on:resetLog={handleResetLog} />
-      {logLength}
-      messages={game.Log.messages}
-      on:addMessage={handleAddMessage}
-      on:resetLog={handleResetLog}
-    />
   </div>
   <div id="right-column" on:click={() => toggleSidebar(false)}>
     <div id="right-top">
@@ -56,10 +47,7 @@
           <line x1="0" y1="1em" x2="1em" y2="1em" />
         </svg>
       </div>
-      <TabSelector
+      <TabSelector tabs={game.TabHandler.AllTabs} bind:selectedTab={game.TabHandler.currentTab} />
-        tabs={game.TabHandler.AllTabs}
-        bind:selectedTab={game.TabHandler.currentTab}
-      />
     </div>
     <div id="tab-content">
       <svelte:component

src/shark/LZString.ts

@@ -1,12 +1,9 @@
 import { StaticClass } from "./StaticClass";
 
 export class LZString extends StaticClass {
-  static readonly #KeyStrBase64 =
+  static readonly #KeyStrBase64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
-    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
 
-  static readonly #KeyStrBase64Dict = LZString.#createBaseDict(
+  static readonly #KeyStrBase64Dict = LZString.#createBaseDict(LZString.#KeyStrBase64);
-    LZString.#KeyStrBase64
-  );
 
   static #createBaseDict(alphabet: string): Record<string, number> {
     const dict: Record<string, number> = {};
@@ -17,29 +14,19 @@ export class LZString extends StaticClass {
   }
 
   static compressToBase64(input: string): string {
-    const result = LZString.#compress(input, 6, (a) =>
+    const result = LZString.#compress(input, 6, (a) => LZString.#KeyStrBase64.charAt(a));
-      LZString.#KeyStrBase64.charAt(a)
-    );
     return result + "=".repeat((4 - (result.length % 4)) % 4);
   }
   static decompressFromBase64(input: string | null): string | null {
     if (input === null || input === "") return null;
-    return LZString.#decompress(
+    return LZString.#decompress(input.length, 32, (index) => LZString.#KeyStrBase64Dict[input.charAt(index)]);
-      input.length,
-      32,
-      (index) => LZString.#KeyStrBase64Dict[input.charAt(index)]
-    );
   }
 
   static compress(uncompressed: string): string {
     return LZString.#compress(uncompressed);
   }
   static #compress(uncompressed: string): string;
-  static #compress(
+  static #compress(uncompressed: string, bitsPerChar: number, getCharFromInt: (index: number) => string): string;
-    uncompressed: string,
-    bitsPerChar: number,
-    getCharFromInt: (index: number) => string
-  ): string;
   static #compress(
     uncompressed: string,
     bitsPerChar = 16,
@@ -255,15 +242,9 @@ export class LZString extends StaticClass {
 
   static decompress(compressed: string | null): string | null {
     if (compressed === null || compressed === "") return null;
-    return LZString.#decompress(compressed.length, 32768, (index) =>
+    return LZString.#decompress(compressed.length, 32768, (index) => compressed.charCodeAt(index));
-      compressed.charCodeAt(index)
-    );
   }
-  static #decompress(
+  static #decompress(length: number, resetValue: number, getNextValue: (index: number) => number): string | null {
-    length: number,
-    resetValue: number,
-    getNextValue: (index: number) => number
-  ): string | null {
     const dictionary: (number | string)[] = [];
 
     let enlargeIn = 4;

src/shark/Log.ts

@@ -14,14 +14,9 @@ export class Log extends StaticClass {
     })();
   }
 
-  static addMessage(
+  static addMessage(message: string, messageType: MessageType = MessageType.message): void {
-    message: string,
-    messageType: MessageType = MessageType.message
-  ): void {
     this.messages.update((oldMessages) =>
-      [...oldMessages, new Message(message, messageType)].slice(
+      [...oldMessages, new Message(message, messageType)].slice(-Log.#maxLogLength)
-        -Log.#maxLogLength
-      )
     );
   }
 

src/shark/SaveHandler.ts

@@ -29,15 +29,11 @@ export class SaveHandler extends StaticClass {
       })();
     });
 
-    const allTabsEntries = Object.entries(
+    const allTabsEntries = Object.entries(game.TabHandler.AllTabs) as unknown as [
-      game.TabHandler.AllTabs
-    ) as unknown as [
       keyof typeof TabHandler["AllTabs"],
       typeof TabHandler["AllTabs"][keyof typeof TabHandler["AllTabs"]]
     ][];
-    const selectedTabIndex = allTabsEntries.findIndex(
+    const selectedTabIndex = allTabsEntries.findIndex(([, tab]) => tab === game.TabHandler.currentTab);
-      ([, tab]) => tab === game.TabHandler.currentTab
-    );
     const selectedTabName = allTabsEntries[selectedTabIndex][0];
 
     const currentSettings = game.Settings.getSaveable();
@@ -65,11 +61,8 @@ export class SaveHandler extends StaticClass {
     const stringifiedSave = JSON.stringify(save);
     const encodedSave = LZString.compressToBase64(stringifiedSave);
     console.debug(
-      `${new Date(
+      `${new Date(Date.now()).toISOString()} - saving ${stringifiedSave} - encoded to ${
-        Date.now()
+        Math.round((encodedSave.length / stringifiedSave.length) * 100 * 100) / 100
-      ).toISOString()} - saving ${stringifiedSave} - encoded to ${
-        Math.round((encodedSave.length / stringifiedSave.length) * 100 * 100) /
-        100
       }% size`
     );
 
@@ -77,9 +70,7 @@ export class SaveHandler extends StaticClass {
   }
 
   static async load(game: typeof SharkGame): Promise<unknown> {
-    const localSave = LZString.decompressFromBase64(
+    const localSave = LZString.decompressFromBase64(localStorage.getItem(SaveHandler.saveName));
-      localStorage.getItem(SaveHandler.saveName)
-    );
     const loadedSave = JSON.parse(localSave ?? "{}");
     const saveVersion = loadedSave.version ?? 0;
 
@@ -91,11 +82,7 @@ export class SaveHandler extends StaticClass {
 
     let save = loadedSave;
     for (let i = 0; i < migrators.length; i++) {
-      console.debug(
+      console.debug(`Executing save migrator ${i + 1} / ${migrators.length} (${saveVersion + i + 1})`);
-        `Executing save migrator ${i + 1} / ${migrators.length} (${
-          saveVersion + i + 1
-        })`
-      );
       save = migrators[i](save);
     }
 
@@ -104,9 +91,7 @@ export class SaveHandler extends StaticClass {
     game.Settings.settings.update((settings) => {
       Object.entries(settings).forEach(([categoryName, categorySettings]) => {
         Object.entries(categorySettings).forEach(([settingName, setting]) => {
-          setting.current =
+          setting.current = fullSave.settings[`${categoryName};${settingName}`] ?? setting.default;
-            fullSave.settings[`${categoryName};${settingName}`] ??
-            setting.default;
         });
       });
       return settings;

src/shark/Settings.ts

@@ -20,26 +20,15 @@ export class Settings extends StaticClass {
         current: true,
         default: true as const,
         name: "Enable Planet-dependent Styles" as const,
-        description:
+        description: "Whether page colors should change for different planets" as const,
-          "Whether page colors should change for different planets" as const,
         options: [true, false] as const,
       },
       theme: {
         current: "marine",
         default: "marine" as const,
         name: "Currently enabled theme" as const,
-        description:
+        description: "Only applied if planet-dependent styles are enabled" as const,
-          "Only applied if planet-dependent styles are enabled" as const,
+        options: ["abandoned", "chaotic", "frigid", "haven", "marine", "shrouded", "tempestuous", "violent"],
-        options: [
-          "abandoned",
-          "chaotic",
-          "frigid",
-          "haven",
-          "marine",
-          "shrouded",
-          "tempestuous",
-          "violent",
-        ],
       },
     },
   };
@@ -67,8 +56,4 @@ export type Setting = {
   readonly description: unknown;
   readonly options: readonly unknown[];
 };
-export type SettingsRecord = typeof Settings["settings"] extends Writable<
+export type SettingsRecord = typeof Settings["settings"] extends Writable<infer X> ? X : never;
-  infer X
->
-  ? X
-  : never;

src/shark/SharkGame.ts

@@ -75,10 +75,7 @@ export class SharkGame extends StaticClass {
 
     SaveHandler.load(this);
 
-    SharkGame.title =
+    SharkGame.title = SharkGame.#GAME_NAMES[Math.floor(Math.random() * SharkGame.#GAME_NAMES.length)];
-      SharkGame.#GAME_NAMES[
-        Math.floor(Math.random() * SharkGame.#GAME_NAMES.length)
-      ];
   }
 }
 

src/shark/TabHandler.ts

@@ -7,6 +7,5 @@ export class TabHandler extends StaticClass {
     Home,
     Lab,
   } as const;
-  static currentTab: typeof TabHandler.AllTabs[keyof typeof TabHandler.AllTabs] =
+  static currentTab: typeof TabHandler.AllTabs[keyof typeof TabHandler.AllTabs] = TabHandler.AllTabs.Home;
-    TabHandler.AllTabs.Home;
 }

src/shark/data/HomeActions.ts

@@ -10,11 +10,11 @@ export type HomeAction = {
 };
 
 export class HomeActions extends StaticClass {
-  static getActionTable(): { [actionName: string]: HomeAction } {
+  static getActionTable(): Record<string, HomeAction> {
     return HomeActions.actionTable;
   }
 
-  static actionTable = {
+  static readonly actionTable = Object.seal({
     catchFish: {
       name: "Catch fish",
       effect: {
@@ -72,13 +72,7 @@ export class HomeActions extends StaticClass {
           shark: 1,
         },
       },
-      outcomes: [
+      outcomes: ["S h a r k", "s.h.a.r.k.", "shark", "sharg", "that was probably a shark"],
-        "S h a r k",
-        "s.h.a.r.k.",
-        "shark",
-        "sharg",
-        "that was probably a shark",
-      ],
     },
-  };
+  });
 }

src/shark/data/Resources.ts

@@ -38,20 +38,15 @@ export class Resources extends StaticClass {
   static getResource(resourceName: string): Resource | null {
     let result: null | Resource = null;
     Resources.Resources.update((res) => {
-      if (Object.hasOwnProperty.call(res, resourceName))
+      if (Object.hasOwnProperty.call(res, resourceName)) result = res[resourceName];
-        result = res[resourceName];
       return res;
     });
     return result;
   }
 
   static getResources(resourceNames: string[]): Record<string, Resource> | null;
-  static getResources(
+  static getResources(...resourceNames: string[]): Record<string, Resource> | null;
-    ...resourceNames: string[]
+  static getResources(...resourceNames: string[] | string[][]): Record<string, Resource> | null {
-  ): Record<string, Resource> | null;
-  static getResources(
-    ...resourceNames: string[] | string[][]
-  ): Record<string, Resource> | null {
     if (Array.isArray(resourceNames[0])) {
       resourceNames = resourceNames[0];
     }

src/styles/themes.scss

@@ -82,12 +82,7 @@ $color-text: white;
   --color-med: #{$color-med-marine};
   --color-dark: #{$color-dark-marine};
   --color-darker: #{$color-darker-marine};
-  --color-title: #{rgba(
+  --color-title: #{rgba(red($color-med-marine), green($color-med-marine), blue($color-med-marine), 0.2)};
-      red($color-med-marine),
-      green($color-med-marine),
-      blue($color-med-marine),
-      0.2
-    )};
 
   &:not(.no-theme) {
     &.abandoned {
@@ -96,12 +91,7 @@ $color-text: white;
       --color-med: #{$color-med-abandoned};
       --color-dark: #{$color-dark-abandoned};
       --color-darker: #{$color-darker-abandoned};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-abandoned), green($color-med-abandoned), blue($color-med-abandoned), 0.2)};
-          red($color-med-abandoned),
-          green($color-med-abandoned),
-          blue($color-med-abandoned),
-          0.2
-        )};
     }
     &.chaotic {
       --color-lighter: #{$color-lighter-chaotic};
@@ -109,12 +99,7 @@ $color-text: white;
       --color-med: #{$color-med-chaotic};
       --color-dark: #{$color-dark-chaotic};
       --color-darker: #{$color-darker-chaotic};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-chaotic), green($color-med-chaotic), blue($color-med-chaotic), 0.2)};
-          red($color-med-chaotic),
-          green($color-med-chaotic),
-          blue($color-med-chaotic),
-          0.2
-        )};
     }
     &.frigid {
       --color-lighter: #{$color-lighter-frigid};
@@ -122,12 +107,7 @@ $color-text: white;
       --color-med: #{$color-med-frigid};
       --color-dark: #{$color-dark-frigid};
       --color-darker: #{$color-darker-frigid};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-frigid), green($color-med-frigid), blue($color-med-frigid), 0.2)};
-          red($color-med-frigid),
-          green($color-med-frigid),
-          blue($color-med-frigid),
-          0.2
-        )};
     }
     &.haven {
       --color-lighter: #{$color-lighter-haven};
@@ -135,12 +115,7 @@ $color-text: white;
       --color-med: #{$color-med-haven};
       --color-dark: #{$color-dark-haven};
       --color-darker: #{$color-darker-haven};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-haven), green($color-med-haven), blue($color-med-haven), 0.2)};
-          red($color-med-haven),
-          green($color-med-haven),
-          blue($color-med-haven),
-          0.2
-        )};
     }
     &.shrouded {
       --color-lighter: #{$color-lighter-shrouded};
@@ -148,12 +123,7 @@ $color-text: white;
       --color-med: #{$color-med-shrouded};
       --color-dark: #{$color-dark-shrouded};
       --color-darker: #{$color-darker-shrouded};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-shrouded), green($color-med-shrouded), blue($color-med-shrouded), 0.2)};
-          red($color-med-shrouded),
-          green($color-med-shrouded),
-          blue($color-med-shrouded),
-          0.2
-        )};
     }
     &.tempestuous {
       --color-lighter: #{$color-lighter-tempestuous};
@@ -174,12 +144,7 @@ $color-text: white;
       --color-med: #{$color-med-violent};
       --color-dark: #{$color-dark-violent};
       --color-darker: #{$color-darker-violent};
-      --color-title: #{rgba(
+      --color-title: #{rgba(red($color-med-violent), green($color-med-violent), blue($color-med-violent), 0.2)};
-          red($color-med-violent),
-          green($color-med-violent),
-          blue($color-med-violent),
-          0.2
-        )};
     }
   }
 }