DutchEllie
/
svelte-testing
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

PWA time
continuous-integration/drone/push Build is passing Details

This commit is contained in:
DutchEllie 2022-07-04 16:27:11 +02:00
parent 23e098a376
commit d5ae762517
Signed by: DutchEllie
SSH Key Fingerprint: SHA256:dKq6ZSgN5E3Viqrw/+xAdf2VdR6hdRGNyrYqXXwfjTY
15 changed files with 675 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"typescript.tsdk": "node_modules/typescript/lib"
}

728
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

10
package.json
View File

@ -16,10 +16,11 @@
"@sveltejs/adapter-auto": "next",
"@sveltejs/adapter-node": "^1.0.0-next.78",
"@sveltejs/kit": "next",
"@types/serviceworker": "^0.0.48",
"@typescript-eslint/eslint-plugin": "^5.27.0",
"@typescript-eslint/parser": "^5.27.0",
"autoprefixer": "^10.4.7",
"eslint": "^8.16.0",
"eslint": "^8.19.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-svelte3": "^4.0.0",
"postcss": "^8.4.14",
@ -30,7 +31,10 @@
"svelte-preprocess": "^4.10.7",
"tailwindcss": "^3.1.4",
"tslib": "^2.3.1",
"typescript": "^4.7.2"
"typescript": "^4.7.4"
},
"type": "module"
"type": "module",
"dependencies": {
"svelte-language-server": "^0.14.29"
}
}

4
postcss.config.cjs
View File

@ -3,4 +3,8 @@ module.exports = {
tailwindcss: {},
autoprefixer: {},
},
plugins: [
require('tailwindcss'),
require('autoprefixer'),
]
}

1
src/app.html
View File

@ -4,6 +4,7 @@
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="manifest" href="/manifest.json">
%sveltekit.head%
</head>
<body>

8
src/components/homepage/content.svelte
View File

@ -3,11 +3,11 @@
<h1
class="font-roboto_slab text-center text-2xl lg:text-6xl xl:text-7xl w-auto md:w-max mt-10 lg:mt-32 mx-auto font-bold h1-shadow"
>
Welcome to my website
</h1>
>Welcome to my website</h1>
<!-->
<br class="hidden lg:block" />
<p class="font-roboto_slab text-center lg:text-2xl text-md">The modern web meets 2000</p>
</!-->
<p class="font-roboto_slab text-center lg:text-2xl text-md lg:mt-5">The modern web meets 2000</p>
<hr class="border-black" />
<br />
<div class="md:text-center lg:px-40">

14
src/components/misc/header.svelte
View File

@ -4,20 +4,20 @@
</script>
<div class="grid grid-cols-7 grid-rows-1 sm:grid-rows-1 gap-y-2 mt-2 sm:mt-4 sm:pl-4 align-middle h-24 md:h-16">
<div class="lg:col-start-2 col-span-7 md:col-span-4 lg:col-span-3 flex flex-row">
<div class="h-full">
<div class="lg:col-start-2 col-span-7 md:col-span-4 lg:col-span-3 flex flex-row items-start">
<div class="h-full sm:aspect-square">
<img
class="hidden sm:block h-full my-auto"
class="hidden sm:block h-full my-auto aspect-square"
src="https://dutchellie.nl/DutchEllie/proper-website-2/raw/branch/main/web/static/images/icon.png"
alt="Icon"
/>
<div class="block sm:hidden ml-2 mt-4">
<div class="block sm:hidden ml-2 mt-4 w-fit">
<Hamburger />
</div>
</div>
<div class="w-full sm:w-auto sm:pl-5 sm:my-auto text-center mx-auto sm:mx-0 pr-9 sm:pr-0">
<h1 class="text-2xl md:text-3xl h-min font-medium">Internetica Galactica 2</h1>
<p class="h-min text-xs">Surviving the rewriting</p>
<div class="w-full sm:pl-5 sm:my-auto text-center sm:text-left sm:mx-0 pr-9 sm:pr-0">
<h1 class="text-2xl md:text-3xl font-medium">Internetica Galactica 2</h1>
<p class="text-xs">Surviving the rewriting</p>
</div>
</div>
<div class="hidden md:col-start-5 col-start-1 col-end-7 sm:grid grid-cols-6">

9
src/routes/offline.svelte Normal file
View File

@ -0,0 +1,9 @@
<script>
export const prerender = true;
</script>
<div class="text-center mt-10">
<h1 class="text-7xl">This page is not available offline</h1>
<br />
<a class="underline hover:underline-offset-2" href="/">Click here to go back</a>
</div>

83
src/service-worker.ts Normal file
View File

@ -0,0 +1,83 @@
/* eslint-disable no-var */
import { build, files, version } from '$service-worker';
const worker = (self as unknown) as ServiceWorkerGlobalScope;
const FILES = `cache${version}`;
// build is an array of all files generated by the bundler
// files is an array of all files in the static dir
const to_cache = build.concat(files);
const staticAssets = new Set(to_cache);
worker.addEventListener("install", (event) => {
event.waitUntil(
caches
.open(FILES)
.then((cache) => cache.addAll(to_cache))
.then(() => {
worker.skipWaiting();
})
);
});
worker.addEventListener("activate", (event) => {
event.waitUntil(
caches.keys()
.then(async (keys) => {
// Delete old caches
for (const key of keys) {
if (key !== FILES) await caches.delete(key);
}
console.log("old caches deleted")
worker.clients.claim();
})
.then(() => console.log("Activated"))
)
})
// Fetch the asset from the network and store it in the cache
// Falls back to the cache if the user is offline
async function fetchAndCache(request: Request) {
const cache = await caches.open(`offline${version}`);
try {
const response = await fetch(request);
cache.put(request, response.clone());
return response;
} catch (err) { // if the user is offline, the request will fail
const response = await cache.match(request);
if (response) return response;
// if not in cache, throw error anyway
throw err;
}
}
worker.addEventListener("fetch", (event) => {
if (event.request.method !== "GET") return;
console.log("fetch event intercepted")
// Firefox has not yet fixed this, so it needs to be excluded from this caching behavior
// https://web.dev/sw-range-requests/
// https://wpt.fyi/results/fetch/range/sw.https.window.html?label=master&label=experimental&aligned
if (navigator.userAgent.includes("Firefox/") && event.request.headers.has("range")) return;
const url = new URL(event.request.url);
// Don't try to cache protocols other than http/https
const isHttp = url.protocol.startsWith("http");
const isStaticAsset = url.host === self.location.host && staticAssets.has(url.pathname);
const skipBecauseUncached = event.request.cache === 'only-if-cached' && !isStaticAsset;
if (isHttp && !skipBecauseUncached) {
event.respondWith(
(async () => {
const cachedAsset = isStaticAsset && (await caches.match(event.request));
return cachedAsset || fetchAndCache(event.request);
})()
)
}
})

0
src/stores/currentMusic.js → src/stores/currentMusic.ts
View File

0
src/stores/musicStore.js → src/stores/musicStore.ts
View File

BIN
static/favicon.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 28 KiB

17
static/manifest.json Normal file
View File

@ -0,0 +1,17 @@
{
"short_name": "Internetica Galactica 2",
"name": "Internetica Galactica 2",
"start_url": "/",
"icons": [
{
"src": "/favicon.png",
"type": "image/png",
"sizes": "512x512"
}
],
"background_color": "#FFAFCC",
"display": "standalone",
"scope": "/",
"theme_color": "#FFAFCC",
"description": "The modern web meets 2000"
}

6
svelte.config.js
View File

@ -1,14 +1,12 @@
import adapter from '@sveltejs/adapter-node';
import preprocess from 'svelte-preprocess';
import sveltePreprocess from 'svelte-preprocess';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://github.com/sveltejs/svelte-preprocess
// for more information about preprocessors
preprocess: [
preprocess({
postcss: true,
}),
sveltePreprocess({postcss: true})
],
kit: {
adapter: adapter(),

2
tsconfig.json
View File

@ -8,6 +8,6 @@
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true
"strict": true,
}
}