toby/svelte-sharg
Archived
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Change prettier config

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.prettierrc
View file

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

29
public/index.html
View file

@ -16,16 +16,9 @@
<meta property="og:url" content="https://cirri.al/sharks/" />
<meta property="og:url" content="https://shark.tobot.tech/" />
-->
<meta
property="og:url"
content="https://spencers145.github.io/SharkGame/"
/>
<meta property="og:url" content="https://spencers145.github.io/SharkGame/" />
<meta
property="og:image"
itemprop="image"
content="https://spencers145.github.io/SharkGame/img/sharkgame.png"
/>
<meta 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
rel="image_src"
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="image_src" 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
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
>Oh dear! It seems you have Javascript disabled, or that your current 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>In fact, it only displays this Shark asking you for scripts.</span>
<pre>

10
src/App.svelte
View file

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

6
src/components/Header.svelte
View file

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

6
src/components/Log.svelte
View file

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

14
src/components/Modals/SettingsModal.svelte
View file

@ -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
class="settings-row"
id={`settings-row-${categoryName}-${settingId}`}
>
<div
class="settings-description"
id={`settings-description-${categoryName}-${settingId}`}
>
<div class="settings-row" id={`settings-row-${categoryName}-${settingId}`}>
<div class="settings-description" id={`settings-description-${categoryName}-${settingId}`}>
{setting.name}<br />
<span class="settings-small-description"
>({setting.description})</span
>
<span class="settings-small-description">({setting.description})</span>
</div>
{#each setting.options as option}<button
disabled={setting.current === option}

6
src/components/ResourceTable/ResourceGroup.svelte
View file

@ -16,11 +16,7 @@
</tr>
{#if !collapsed}
{#each resources as [resourceName, resource], index}
<tr
transition:fade
class:even={index % 2 === 0}
class:odd={index % 2 === 1}
>
<tr 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>

9
src/components/Tabs/Home.svelte
View file

@ -10,9 +10,7 @@
function homeActionClick(homeAction: HomeAction) {
if (homeAction.effect.resource) {
const resources = Resources.getResources(
Object.keys(homeAction.effect.resource)
);
const resources = Resources.getResources(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:
homeAction.outcomes[
Math.floor(Math.random() * homeAction.outcomes.length)
],
message: homeAction.outcomes[Math.floor(Math.random() * homeAction.outcomes.length)],
});
}
}

18
src/components/Wrapper.svelte
View file

@ -26,18 +26,9 @@
</script>
<main>
<div
id="left-column"
class:expanded={sidebarExpanded}
class:collapsed={!sidebarExpanded}
>
<div id="left-column" class:expanded={sidebarExpanded} class:collapsed={!sidebarExpanded}>
<ResourceTable resources={game.Resources.Resources} />
<Log
{logLength}
messages={game.Log.messages}
on:addMessage={handleAddMessage}
on:resetLog={handleResetLog}
/>
<Log {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
tabs={game.TabHandler.AllTabs}
bind:selectedTab={game.TabHandler.currentTab}
/>
<TabSelector tabs={game.TabHandler.AllTabs} bind:selectedTab={game.TabHandler.currentTab} />
</div>
<div id="tab-content">
<svelte:component

33
src/shark/LZString.ts
View file

@ -1,12 +1,9 @@
import { StaticClass } from "./StaticClass";
export class LZString extends StaticClass {
static readonly #KeyStrBase64 =
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
static readonly #KeyStrBase64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
static readonly #KeyStrBase64Dict = LZString.#createBaseDict(
LZString.#KeyStrBase64
);
static readonly #KeyStrBase64Dict = LZString.#createBaseDict(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) =>
LZString.#KeyStrBase64.charAt(a)
);
const result = LZString.#compress(input, 6, (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(
input.length,
32,
(index) => LZString.#KeyStrBase64Dict[input.charAt(index)]
);
return LZString.#decompress(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(
uncompressed: string,
bitsPerChar: number,
getCharFromInt: (index: number) => string
): string;
static #compress(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) =>
compressed.charCodeAt(index)
);
return LZString.#decompress(compressed.length, 32768, (index) => compressed.charCodeAt(index));
}
static #decompress(
length: number,
resetValue: number,
getNextValue: (index: number) => number
): string | null {
static #decompress(length: number, resetValue: number, getNextValue: (index: number) => number): string | null {
const dictionary: (number | string)[] = [];
let enlargeIn = 4;

9
src/shark/Log.ts
View file

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

29
src/shark/SaveHandler.ts
View file

@ -29,15 +29,11 @@ export class SaveHandler extends StaticClass {
})();
});
const allTabsEntries = Object.entries(
game.TabHandler.AllTabs
) as unknown as [
const allTabsEntries = Object.entries(game.TabHandler.AllTabs) as unknown as [
keyof typeof TabHandler["AllTabs"],
typeof TabHandler["AllTabs"][keyof typeof TabHandler["AllTabs"]]
][];
const selectedTabIndex = allTabsEntries.findIndex(
([, tab]) => tab === game.TabHandler.currentTab
);
const selectedTabIndex = allTabsEntries.findIndex(([, 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(
Date.now()
).toISOString()} - saving ${stringifiedSave} - encoded to ${
Math.round((encodedSave.length / stringifiedSave.length) * 100 * 100) /
100
`${new Date(Date.now()).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(
localStorage.getItem(SaveHandler.saveName)
);
const localSave = LZString.decompressFromBase64(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(
`Executing save migrator ${i + 1} / ${migrators.length} (${
saveVersion + i + 1
})`
);
console.debug(`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 =
fullSave.settings[`${categoryName};${settingName}`] ??
setting.default;
setting.current = fullSave.settings[`${categoryName};${settingName}`] ?? setting.default;
});
});
return settings;

23
src/shark/Settings.ts
View file

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

5
src/shark/SharkGame.ts
View file

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

3
src/shark/TabHandler.ts
View file

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

14
src/shark/data/HomeActions.ts
View file

@ -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: [
"S h a r k",
"s.h.a.r.k.",
"shark",
"sharg",
"that was probably a shark",
],
outcomes: ["S h a r k", "s.h.a.r.k.", "shark", "sharg", "that was probably a shark"],
},
};
});
}

11
src/shark/data/Resources.ts
View file

@ -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))
result = res[resourceName];
if (Object.hasOwnProperty.call(res, resourceName)) result = res[resourceName];
return res;
});
return result;
}
static getResources(resourceNames: string[]): Record<string, Resource> | null;
static getResources(
...resourceNames: string[]
): Record<string, Resource> | null;
static getResources(
...resourceNames: string[] | string[][]
): Record<string, Resource> | null {
static getResources(...resourceNames: string[]): Record<string, Resource> | null;
static getResources(...resourceNames: string[] | string[][]): Record<string, Resource> | null {
if (Array.isArray(resourceNames[0])) {
resourceNames = resourceNames[0];
}

49
src/styles/themes.scss
View file

@ -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(
red($color-med-marine),
green($color-med-marine),
blue($color-med-marine),
0.2
)};
--color-title: #{rgba(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(
red($color-med-abandoned),
green($color-med-abandoned),
blue($color-med-abandoned),
0.2
)};
--color-title: #{rgba(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(
red($color-med-chaotic),
green($color-med-chaotic),
blue($color-med-chaotic),
0.2
)};
--color-title: #{rgba(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(
red($color-med-frigid),
green($color-med-frigid),
blue($color-med-frigid),
0.2
)};
--color-title: #{rgba(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(
red($color-med-haven),
green($color-med-haven),
blue($color-med-haven),
0.2
)};
--color-title: #{rgba(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(
red($color-med-shrouded),
green($color-med-shrouded),
blue($color-med-shrouded),
0.2
)};
--color-title: #{rgba(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(
red($color-med-violent),
green($color-med-violent),
blue($color-med-violent),
0.2
)};
--color-title: #{rgba(red($color-med-violent), green($color-med-violent), blue($color-med-violent), 0.2)};
}
}
}