Initial skeleton (hehe) commit

Signed-off-by: Matt Strapp <matt@mattstrapp.net>

24 files changed, 489 insertions, 0 deletions

diff --git a/clients/www/.eslintignore b/clients/www/.eslintignore
new file mode 100644
index 0000000..3897265
--- /dev/null
+++ b/clients/www/.eslintignore
@@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
diff --git a/clients/www/.eslintrc.cjs b/clients/www/.eslintrc.cjs
new file mode 100644
index 0000000..ebc1958
--- /dev/null
+++ b/clients/www/.eslintrc.cjs
@@ -0,0 +1,30 @@
+module.exports = {
+	root: true,
+	extends: [
+		'eslint:recommended',
+		'plugin:@typescript-eslint/recommended',
+		'plugin:svelte/recommended',
+		'prettier'
+	],
+	parser: '@typescript-eslint/parser',
+	plugins: ['@typescript-eslint'],
+	parserOptions: {
+		sourceType: 'module',
+		ecmaVersion: 2020,
+		extraFileExtensions: ['.svelte']
+	},
+	env: {
+		browser: true,
+		es2017: true,
+		node: true
+	},
+	overrides: [
+		{
+			files: ['*.svelte'],
+			parser: 'svelte-eslint-parser',
+			parserOptions: {
+				parser: '@typescript-eslint/parser'
+			}
+		}
+	]
+};
diff --git a/clients/www/.gitignore b/clients/www/.gitignore
new file mode 100644
index 0000000..b8f5758
--- /dev/null
+++ b/clients/www/.gitignore
@@ -0,0 +1,12 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
+
+/dev-dist
\ No newline at end of file
diff --git a/clients/www/.npmrc b/clients/www/.npmrc
new file mode 100644
index 0000000..b6f27f1
--- /dev/null
+++ b/clients/www/.npmrc
@@ -0,0 +1 @@
+engine-strict=true
diff --git a/clients/www/.prettierignore b/clients/www/.prettierignore
new file mode 100644
index 0000000..3897265
--- /dev/null
+++ b/clients/www/.prettierignore
@@ -0,0 +1,13 @@
+.DS_Store
+node_modules
+/build
+/.svelte-kit
+/package
+.env
+.env.*
+!.env.example
+
+# Ignore files for PNPM, NPM and YARN
+pnpm-lock.yaml
+package-lock.json
+yarn.lock
diff --git a/clients/www/.prettierrc b/clients/www/.prettierrc
new file mode 100644
index 0000000..a77fdde
--- /dev/null
+++ b/clients/www/.prettierrc
@@ -0,0 +1,9 @@
+{
+	"useTabs": true,
+	"singleQuote": true,
+	"trailingComma": "none",
+	"printWidth": 100,
+	"plugins": ["prettier-plugin-svelte"],
+	"pluginSearchDirs": ["."],
+	"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
+}
diff --git a/clients/www/.vscode/settings.json b/clients/www/.vscode/settings.json
new file mode 100644
index 0000000..c35c0ee
--- /dev/null
+++ b/clients/www/.vscode/settings.json
@@ -0,0 +1,117 @@
+{
+	"prettier.documentSelectors": [
+		"**/*.svelte"
+	],
+	"tailwindCSS.classAttributes": [
+		"class",
+		"accent",
+		"active",
+		"aspectRatio",
+		"background",
+		"badge",
+		"bgBackdrop",
+		"bgDark",
+		"bgDrawer",
+		"bgLight",
+		"blur",
+		"border",
+		"button",
+		"buttonAction",
+		"buttonBack",
+		"buttonClasses",
+		"buttonComplete",
+		"buttonDismiss",
+		"buttonNeutral",
+		"buttonNext",
+		"buttonPositive",
+		"buttonTextCancel",
+		"buttonTextConfirm",
+		"buttonTextFirst",
+		"buttonTextLast",
+		"buttonTextNext",
+		"buttonTextPrevious",
+		"buttonTextSubmit",
+		"caretClosed",
+		"caretOpen",
+		"chips",
+		"color",
+		"controlSeparator",
+		"controlVariant",
+		"cursor",
+		"display",
+		"element",
+		"fill",
+		"fillDark",
+		"fillLight",
+		"flex",
+		"gap",
+		"gridColumns",
+		"height",
+		"hover",
+		"inactive",
+		"indent",
+		"justify",
+		"meter",
+		"padding",
+		"position",
+		"regionAnchor",
+		"regionBackdrop",
+		"regionBody",
+		"regionCaption",
+		"regionCaret",
+		"regionCell",
+		"regionChildren",
+		"regionChipList",
+		"regionChipWrapper",
+		"regionCone",
+		"regionContent",
+		"regionControl",
+		"regionDefault",
+		"regionDrawer",
+		"regionFoot",
+		"regionFootCell",
+		"regionFooter",
+		"regionHead",
+		"regionHeadCell",
+		"regionHeader",
+		"regionIcon",
+		"regionInput",
+		"regionInterface",
+		"regionInterfaceText",
+		"regionLabel",
+		"regionLead",
+		"regionLegend",
+		"regionList",
+		"regionListItem",
+		"regionNavigation",
+		"regionPage",
+		"regionPanel",
+		"regionRowHeadline",
+		"regionRowMain",
+		"regionSummary",
+		"regionSymbol",
+		"regionTab",
+		"regionTrail",
+		"ring",
+		"rounded",
+		"select",
+		"shadow",
+		"slotDefault",
+		"slotFooter",
+		"slotHeader",
+		"slotLead",
+		"slotMessage",
+		"slotMeta",
+		"slotPageContent",
+		"slotPageFooter",
+		"slotPageHeader",
+		"slotSidebarLeft",
+		"slotSidebarRight",
+		"slotTrail",
+		"spacing",
+		"text",
+		"track",
+		"width",
+		"zIndex"
+	]
+}
\ No newline at end of file
diff --git a/clients/www/README.md b/clients/www/README.md
new file mode 100644
index 0000000..5c91169
--- /dev/null
+++ b/clients/www/README.md
@@ -0,0 +1,38 @@
+# create-svelte
+
+Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
+
+## Creating a project
+
+If you're seeing this, you've probably already done this step. Congrats!
+
+```bash
+# create a new project in the current directory
+npm create svelte@latest
+
+# create a new project in my-app
+npm create svelte@latest my-app
+```
+
+## Developing
+
+Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
+
+```bash
+npm run dev
+
+# or start the server and open the app in a new browser tab
+npm run dev -- --open
+```
+
+## Building
+
+To create a production version of your app:
+
+```bash
+npm run build
+```
+
+You can preview the production build with `npm run preview`.
+
+> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
diff --git a/clients/www/package.json b/clients/www/package.json
new file mode 100644
index 0000000..8c15875
--- /dev/null
+++ b/clients/www/package.json
@@ -0,0 +1,43 @@
+{
+  "name": "website",
+  "description": "The actual website",
+  "version": "0.0.1",
+  "private": true,
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build && cp .svelte-kit/output/server/sw.js.map .svelte-kit/output/server/workbox-*.map build/",
+    "preview": "vite preview",
+    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "lint": "prettier --plugin-search-dir . --check . && eslint .",
+    "format": "prettier --plugin-search-dir . --write ."
+  },
+  "devDependencies": {
+    "@skeletonlabs/skeleton": "2.3.0",
+    "@skeletonlabs/tw-plugin": "0.2.2",
+    "@sveltejs/adapter-auto": "^2.1.0",
+    "@sveltejs/adapter-static": "^2.0.3",
+    "@sveltejs/kit": "^1.26.0",
+    "@tailwindcss/forms": "0.5.6",
+    "@tailwindcss/typography": "0.5.10",
+    "@types/node": "20.8.7",
+    "@typescript-eslint/eslint-plugin": "^6.8.0",
+    "@typescript-eslint/parser": "^6.8.0",
+    "@vite-pwa/sveltekit": "^0.2.7",
+    "autoprefixer": "10.4.16",
+    "eslint": "^8.51.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-svelte": "^2.34.0",
+    "postcss": "8.4.31",
+    "prettier": "^3.0.3",
+    "prettier-plugin-svelte": "^3.0.3",
+    "svelte": "^4.2.2",
+    "svelte-check": "^3.5.2",
+    "tailwindcss": "3.3.3",
+    "tslib": "^2.6.2",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
+    "vite-plugin-tailwind-purgecss": "0.1.3"
+  },
+  "type": "module"
+}
\ No newline at end of file
diff --git a/clients/www/postcss.config.cjs b/clients/www/postcss.config.cjs
new file mode 100644
index 0000000..16dce0b
--- /dev/null
+++ b/clients/www/postcss.config.cjs
@@ -0,0 +1,6 @@
+module.exports = {
+	plugins: {
+		tailwindcss: {},
+		autoprefixer: {},
+	},
+}
\ No newline at end of file
diff --git a/clients/www/src/app.d.ts b/clients/www/src/app.d.ts
new file mode 100644
index 0000000..4c48b71
--- /dev/null
+++ b/clients/www/src/app.d.ts
@@ -0,0 +1,12 @@
+// See https://kit.svelte.dev/docs/types#app
+// for information about these interfaces
+// and what to do when importing types
+
+import 'vite-plugin-pwa/info'
+
+declare namespace App {
+	// interface Locals {}
+	// interface PageData {}
+	// interface Error {}
+	// interface Platform {}
+}
diff --git a/clients/www/src/app.html b/clients/www/src/app.html
new file mode 100644
index 0000000..fff52f4
--- /dev/null
+++ b/clients/www/src/app.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en" class="dark">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%sveltekit.assets%/img/favicon.png" />
+		<meta name="viewport" content="width=device-width" />
+		%sveltekit.head%
+	</head>
+	<body data-sveltekit-preload-data="hover" data-theme="vintage">
+		<div style="display: contents" class="h-full overflow-hidden">%sveltekit.body%</div>
+	</body>
+</html>
diff --git a/clients/www/src/app.postcss b/clients/www/src/app.postcss
new file mode 100644
index 0000000..ddaec40
--- /dev/null
+++ b/clients/www/src/app.postcss
@@ -0,0 +1,9 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+@tailwind variants;
+
+html,
+body {
+	@apply h-full overflow-hidden;
+}
\ No newline at end of file
diff --git a/clients/www/src/lib/offlineToast.ts b/clients/www/src/lib/offlineToast.ts
new file mode 100644
index 0000000..3ae943e
--- /dev/null
+++ b/clients/www/src/lib/offlineToast.ts
@@ -0,0 +1,33 @@
+import { getToastStore, type ToastSettings } from '@skeletonlabs/skeleton';
+
+const toastStore = getToastStore();
+
+const offline: ToastSettings = {
+	message: 'You are currently offline.',
+	background: 'variant-filled-error',
+	autohide: false
+};
+
+const online: ToastSettings = {
+	message: 'You are back online.',
+	background: 'variant-filled-success',
+	autohide: true,
+	timeout: 3000
+};
+
+/**
+ * Make a toast for if the PWA is ever brought offline for whatever reason.
+ */
+export default function offlineToast() {
+	window.addEventListener('offline', () => {
+		toastStore.clear();
+		toastStore.trigger(offline);
+	});
+
+	window.addEventListener('online', () => {
+		toastStore.clear();
+		setTimeout(() => {
+			toastStore.trigger(online);
+		}, 300);
+	});
+}
diff --git a/clients/www/src/routes/+layout.svelte b/clients/www/src/routes/+layout.svelte
new file mode 100644
index 0000000..15780c3
--- /dev/null
+++ b/clients/www/src/routes/+layout.svelte
@@ -0,0 +1,33 @@
+<script lang="ts">
+	import '../app.postcss';
+	import { AppShell, AppBar, LightSwitch, initializeStores } from '@skeletonlabs/skeleton';
+
+	import { pwaInfo } from 'virtual:pwa-info';
+
+	$: webManifest = pwaInfo ? pwaInfo.webManifest.linkTag : '';
+
+	initializeStores();
+</script>
+
+<svelte:head>
+  <!-- eslint-disable-next-line svelte/no-at-html-tags VitePWA can probably be trusted -->
+  {@html webManifest}
+</svelte:head>
+
+<!-- App Shell -->
+<AppShell>
+	<svelte:fragment slot="header">
+		<!-- App Bar -->
+		<AppBar gridColumns="grid-cols-3" slotDefault="place-self-center" slotTrail="place-content-end">
+			<svelte:fragment slot="lead">
+				<LightSwitch />
+			</svelte:fragment>
+			<a href="#">Zelda: Oracle Password Generator</a>
+			<svelte:fragment slot="trail">
+				<a href="#">TODO: SOURCE CODE</a>
+			</svelte:fragment>
+		</AppBar>
+	</svelte:fragment>
+	<!-- Page Route Content -->
+	<slot />
+</AppShell>
diff --git a/clients/www/src/routes/+layout.ts b/clients/www/src/routes/+layout.ts
new file mode 100644
index 0000000..c8cacf0
--- /dev/null
+++ b/clients/www/src/routes/+layout.ts
@@ -0,0 +1 @@
+export const prerender = true;
\ No newline at end of file
diff --git a/clients/www/src/routes/+page.svelte b/clients/www/src/routes/+page.svelte
new file mode 100644
index 0000000..2ea190a
--- /dev/null
+++ b/clients/www/src/routes/+page.svelte
@@ -0,0 +1 @@
+TODO: Draw the rest of the owl
\ No newline at end of file
diff --git a/clients/www/static/.nojekyll b/clients/www/static/.nojekyll
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/clients/www/static/.nojekyll
diff --git a/clients/www/static/img/favicon.png b/clients/www/static/img/favicon.png
new file mode 100644
index 0000000..d4307cd
--- /dev/null
+++ b/clients/www/static/img/favicon.png
diff --git a/clients/www/static/img/pwa-192x192.png b/clients/www/static/img/pwa-192x192.png
new file mode 100644
index 0000000..d7fcf17
--- /dev/null
+++ b/clients/www/static/img/pwa-192x192.png
diff --git a/clients/www/svelte.config.js b/clients/www/svelte.config.js
new file mode 100644
index 0000000..0fe9ccb
--- /dev/null
+++ b/clients/www/svelte.config.js
@@ -0,0 +1,18 @@
+import adapter from '@sveltejs/adapter-static';
+import { vitePreprocess } from '@sveltejs/kit/vite';
+
+
+/** @type {import('@sveltejs/kit').Config} */
+const config = {
+	extensions: ['.svelte'],
+	// Consult https://kit.svelte.dev/docs/integrations#preprocessors
+	// for more information about preprocessors
+	preprocess: [ vitePreprocess()],
+	kit: {
+		adapter: adapter(),
+		paths: {
+			base: process.env.NODE_ENV === "production" ? "/oracle-client" : "",
+		}
+	}
+};
+export default config;
\ No newline at end of file
diff --git a/clients/www/tailwind.config.ts b/clients/www/tailwind.config.ts
new file mode 100644
index 0000000..f9b395d
--- /dev/null
+++ b/clients/www/tailwind.config.ts
@@ -0,0 +1,27 @@
+import { join } from 'path'
+import type { Config } from 'tailwindcss'
+import forms from '@tailwindcss/forms';
+import typography from '@tailwindcss/typography';
+import { skeleton } from '@skeletonlabs/tw-plugin'
+
+export default {
+	darkMode: 'class',
+	content: ['./src/**/*.{html,js,svelte,ts}', join(require.resolve('@skeletonlabs/skeleton'), '../**/*.{html,js,svelte,ts}')],
+	theme: {
+		extend: {},
+	},
+	plugins: [
+		forms,
+		typography,
+		skeleton({
+			themes: {
+				preset: [
+					{
+						name: 'vintage',
+						enhancements: true,
+					},
+				],
+			},
+		}),
+	],
+} satisfies Config;
diff --git a/clients/www/tsconfig.json b/clients/www/tsconfig.json
new file mode 100644
index 0000000..92885b8
--- /dev/null
+++ b/clients/www/tsconfig.json
@@ -0,0 +1,18 @@
+{
+	"extends": "./.svelte-kit/tsconfig.json",
+	"compilerOptions": {
+		"allowJs": true,
+		"checkJs": true,
+		"esModuleInterop": true,
+		"forceConsistentCasingInFileNames": true,
+		"resolveJsonModule": true,
+		"skipLibCheck": true,
+		"sourceMap": true,
+		"strict": true,
+		"types": ["vite-plugin-pwa/client"]
+	}
+	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
+	//
+	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
+	// from the referenced tsconfig.json - TypeScript does not merge them in
+}
diff --git a/clients/www/vite.config.ts b/clients/www/vite.config.ts
new file mode 100644
index 0000000..ca89d5b
--- /dev/null
+++ b/clients/www/vite.config.ts
@@ -0,0 +1,43 @@
+import { purgeCss } from 'vite-plugin-tailwind-purgecss';
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+import { SvelteKitPWA } from '@vite-pwa/sveltekit';
+
+export default defineConfig({
+	build: {
+		sourcemap: true
+	},
+	css: {
+		devSourcemap: false
+	},
+	plugins: [
+		sveltekit(),
+		SvelteKitPWA({
+			devOptions: {
+				enabled: true,
+				type: 'module'
+			},
+			manifest: {
+				name: 'Oracle Client',
+				short_name: 'Oracle Client',
+				theme_color: '#3EBCC5',
+				description: "A web-based client for the Oracle of Ages/Seasons password system",
+				display_override: ["window-controls-overlay", "standalone", "minimal-ui"],
+				display: "fullscreen",
+				icons: [
+					{
+						src: "img/pwa-192x192.png",
+						sizes: "192x192",
+						type: "image/png",
+					}
+				],
+				id: "."
+			},
+			registerType: 'autoUpdate',
+			workbox: {
+				globPatterns: ['client/**/*.{js,css,html,svg,png}']
+			}
+		}),
+		purgeCss()
+	]
+});