Change prettier config

This commit is contained in:
Tobias Berger 2021-09-30 21:26:11 +02:00
parent 579c6624ce
commit 569f6db40b
18 changed files with 58 additions and 219 deletions

View file

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

View file

@ -16,16 +16,9 @@
<meta property="og:url" content="https://cirri.al/sharks/" /> <meta property="og:url" content="https://cirri.al/sharks/" />
<meta property="og:url" content="https://shark.tobot.tech/" /> <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 <meta
property="og:image:secure_url" property="og:image:secure_url"
@ -41,14 +34,8 @@
/> />
<link rel="shortcut icon" href="favicon.png" type="image/x-icon" /> <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" /> <link rel="stylesheet" type="text/css" href="./build/bundle.css" />
<script defer type="module" src="./build/bundle.js"></script> <script defer type="module" src="./build/bundle.js"></script>
@ -69,13 +56,9 @@
<h1>Shark Game??</h1> <h1>Shark Game??</h1>
<span <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> <span>In fact, it only displays this Shark asking you for scripts.</span>
<pre> <pre>

View file

@ -17,15 +17,9 @@
root = document.documentElement; root = document.documentElement;
SharkGame.Settings.settings.subscribe((settings) => { 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) => { settings.appearance.theme.options.forEach((theme) => {
root.classList.toggle( root.classList.toggle(theme, theme === settings.appearance.theme.current);
theme,
theme === settings.appearance.theme.current
);
}); });
}); });
}); });

View file

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

View file

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

View file

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

View file

@ -16,11 +16,7 @@
</tr> </tr>
{#if !collapsed} {#if !collapsed}
{#each resources as [resourceName, resource], index} {#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 colspan="2">{resourceName}</td>
<td>{resource.amount}</td> <td>{resource.amount}</td>
<td>{Math.round(100 * (resource.change + Number.EPSILON)) / 100}/s</td> <td>{Math.round(100 * (resource.change + Number.EPSILON)) / 100}/s</td>

View file

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

View file

@ -26,18 +26,9 @@
</script> </script>
<main> <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} /> <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>
<div id="right-column" on:click={() => toggleSidebar(false)}> <div id="right-column" on:click={() => toggleSidebar(false)}>
<div id="right-top"> <div id="right-top">
@ -56,10 +47,7 @@
<line x1="0" y1="1em" x2="1em" y2="1em" /> <line x1="0" y1="1em" x2="1em" y2="1em" />
</svg> </svg>
</div> </div>
<TabSelector <TabSelector tabs={game.TabHandler.AllTabs} bind:selectedTab={game.TabHandler.currentTab} />
tabs={game.TabHandler.AllTabs}
bind:selectedTab={game.TabHandler.currentTab}
/>
</div> </div>
<div id="tab-content"> <div id="tab-content">
<svelte:component <svelte:component

View file

@ -1,12 +1,9 @@
import { StaticClass } from "./StaticClass"; import { StaticClass } from "./StaticClass";
export class LZString extends 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> { static #createBaseDict(alphabet: string): Record<string, number> {
const dict: Record<string, number> = {}; const dict: Record<string, number> = {};
@ -17,29 +14,19 @@ export class LZString extends StaticClass {
} }
static compressToBase64(input: string): string { 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); return result + "=".repeat((4 - (result.length % 4)) % 4);
} }
static decompressFromBase64(input: string | null): string | null { static decompressFromBase64(input: string | null): string | null {
if (input === null || input === "") return 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 { static compress(uncompressed: string): string {
return LZString.#compress(uncompressed); return LZString.#compress(uncompressed);
} }
static #compress(uncompressed: string): string; 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( static #compress(
uncompressed: string, uncompressed: string,
bitsPerChar = 16, bitsPerChar = 16,
@ -255,15 +242,9 @@ export class LZString extends StaticClass {
static decompress(compressed: string | null): string | null { static decompress(compressed: string | null): string | null {
if (compressed === null || compressed === "") return 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)[] = []; const dictionary: (number | string)[] = [];
let enlargeIn = 4; let enlargeIn = 4;

View file

@ -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) => this.messages.update((oldMessages) =>
[...oldMessages, new Message(message, messageType)].slice( [...oldMessages, new Message(message, messageType)].slice(-Log.#maxLogLength)
-Log.#maxLogLength
)
); );
} }

View file

@ -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"], keyof typeof TabHandler["AllTabs"],
typeof TabHandler["AllTabs"][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 selectedTabName = allTabsEntries[selectedTabIndex][0];
const currentSettings = game.Settings.getSaveable(); const currentSettings = game.Settings.getSaveable();
@ -65,11 +61,8 @@ export class SaveHandler extends StaticClass {
const stringifiedSave = JSON.stringify(save); const stringifiedSave = JSON.stringify(save);
const encodedSave = LZString.compressToBase64(stringifiedSave); const encodedSave = LZString.compressToBase64(stringifiedSave);
console.debug( 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` }% size`
); );
@ -77,9 +70,7 @@ export class SaveHandler extends StaticClass {
} }
static async load(game: typeof SharkGame): Promise<unknown> { 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 loadedSave = JSON.parse(localSave ?? "{}");
const saveVersion = loadedSave.version ?? 0; const saveVersion = loadedSave.version ?? 0;
@ -91,11 +82,7 @@ export class SaveHandler extends StaticClass {
let save = loadedSave; let save = loadedSave;
for (let i = 0; i < migrators.length; i++) { 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); save = migrators[i](save);
} }
@ -104,9 +91,7 @@ export class SaveHandler extends StaticClass {
game.Settings.settings.update((settings) => { game.Settings.settings.update((settings) => {
Object.entries(settings).forEach(([categoryName, categorySettings]) => { Object.entries(settings).forEach(([categoryName, categorySettings]) => {
Object.entries(categorySettings).forEach(([settingName, setting]) => { Object.entries(categorySettings).forEach(([settingName, setting]) => {
setting.current = setting.current = fullSave.settings[`${categoryName};${settingName}`] ?? setting.default;
fullSave.settings[`${categoryName};${settingName}`] ??
setting.default;
}); });
}); });
return settings; return settings;

View file

@ -20,26 +20,15 @@ export class Settings extends StaticClass {
current: true, current: true,
default: true as const, default: true as const,
name: "Enable Planet-dependent Styles" 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, options: [true, false] as const,
}, },
theme: { theme: {
current: "marine", current: "marine",
default: "marine" as const, default: "marine" as const,
name: "Currently enabled theme" 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 description: unknown;
readonly options: readonly 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;

View file

@ -75,10 +75,7 @@ export class SharkGame extends StaticClass {
SaveHandler.load(this); 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)
];
} }
} }

View file

@ -7,6 +7,5 @@ export class TabHandler extends StaticClass {
Home, Home,
Lab, Lab,
} as const; } 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;
} }

View file

@ -10,11 +10,11 @@ export type HomeAction = {
}; };
export class HomeActions extends StaticClass { export class HomeActions extends StaticClass {
static getActionTable(): { [actionName: string]: HomeAction } { static getActionTable(): Record<string, HomeAction> {
return HomeActions.actionTable; return HomeActions.actionTable;
} }
static actionTable = { static readonly actionTable = Object.seal({
catchFish: { catchFish: {
name: "Catch fish", name: "Catch fish",
effect: { effect: {
@ -72,13 +72,7 @@ export class HomeActions extends StaticClass {
shark: 1, 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",
],
}, },
}; });
} }

View file

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

View file

@ -82,12 +82,7 @@ $color-text: white;
--color-med: #{$color-med-marine}; --color-med: #{$color-med-marine};
--color-dark: #{$color-dark-marine}; --color-dark: #{$color-dark-marine};
--color-darker: #{$color-darker-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) { &:not(.no-theme) {
&.abandoned { &.abandoned {
@ -96,12 +91,7 @@ $color-text: white;
--color-med: #{$color-med-abandoned}; --color-med: #{$color-med-abandoned};
--color-dark: #{$color-dark-abandoned}; --color-dark: #{$color-dark-abandoned};
--color-darker: #{$color-darker-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 { &.chaotic {
--color-lighter: #{$color-lighter-chaotic}; --color-lighter: #{$color-lighter-chaotic};
@ -109,12 +99,7 @@ $color-text: white;
--color-med: #{$color-med-chaotic}; --color-med: #{$color-med-chaotic};
--color-dark: #{$color-dark-chaotic}; --color-dark: #{$color-dark-chaotic};
--color-darker: #{$color-darker-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 { &.frigid {
--color-lighter: #{$color-lighter-frigid}; --color-lighter: #{$color-lighter-frigid};
@ -122,12 +107,7 @@ $color-text: white;
--color-med: #{$color-med-frigid}; --color-med: #{$color-med-frigid};
--color-dark: #{$color-dark-frigid}; --color-dark: #{$color-dark-frigid};
--color-darker: #{$color-darker-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 { &.haven {
--color-lighter: #{$color-lighter-haven}; --color-lighter: #{$color-lighter-haven};
@ -135,12 +115,7 @@ $color-text: white;
--color-med: #{$color-med-haven}; --color-med: #{$color-med-haven};
--color-dark: #{$color-dark-haven}; --color-dark: #{$color-dark-haven};
--color-darker: #{$color-darker-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 { &.shrouded {
--color-lighter: #{$color-lighter-shrouded}; --color-lighter: #{$color-lighter-shrouded};
@ -148,12 +123,7 @@ $color-text: white;
--color-med: #{$color-med-shrouded}; --color-med: #{$color-med-shrouded};
--color-dark: #{$color-dark-shrouded}; --color-dark: #{$color-dark-shrouded};
--color-darker: #{$color-darker-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 { &.tempestuous {
--color-lighter: #{$color-lighter-tempestuous}; --color-lighter: #{$color-lighter-tempestuous};
@ -174,12 +144,7 @@ $color-text: white;
--color-med: #{$color-med-violent}; --color-med: #{$color-med-violent};
--color-dark: #{$color-dark-violent}; --color-dark: #{$color-dark-violent};
--color-darker: #{$color-darker-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
)};
} }
} }
} }