niklas/s3-share
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

added code splitting and basic opener

Browse Source
This commit is contained in:
Djeeberjr 2022-05-10 16:01:07 +02:00
parent af763d828a
commit 761701d2e9
6 changed files with 123 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/index.html
View File

@ -6,11 +6,9 @@
<title>Loading...</title> <title>Loading...</title>
<link rel='icon' type='image/png' href='/favicon.png'>
<link rel='stylesheet' href='/global.css'>
<link rel='stylesheet' href='/build/bundle.css'> <link rel='stylesheet' href='/build/bundle.css'>
<script defer src='/build/bundle.js'></script> <script defer type="module" src='/build/main.js'></script>
</head> </head>
<body> <body>

4
rollup.config.js
View File

@ -34,9 +34,9 @@ export default {
input: 'web/main.ts', input: 'web/main.ts',
output: { output: {
sourcemap: true, sourcemap: true,
format: 'iife', format: 'es',
name: 'app', name: 'app',
file: 'public/build/bundle.js' dir: "public/build"
}, },
plugins: [ plugins: [
svelte({ svelte({

31
web/App.svelte
View File

@ -1,27 +1,46 @@
<script lang="ts"> <script lang="ts">
import { onMount } from "svelte"; import { onMount } from "svelte";
import getComponentForShare from "./contentType";
const slug = window.location.pathname.split("/").pop(); const slug = window.location.pathname.split("/").pop();
let data: String = null let component = null;
onMount(async () => { onMount(async () => {
const regex = /filename="(.*)"/gm;
const res = await fetch(`/s/${slug}`); const res = await fetch(`/s/${slug}`);
document.title = slug;
});
const contentType: string = res.headers.get("Content-Type");
let filename: string;
let m;
while ((m = regex.exec(res.headers.get("Content-Disposition"))) !== null) {
// This is necessary to avoid infinite loops with zero-width matches
if (m.index === regex.lastIndex) {
regex.lastIndex++;
}
filename = m[1];
}
document.title = filename;
component = getComponentForShare(contentType,filename);
});
</script> </script>
<main> <main>
<div>{slug}</div> <div>{slug}</div>
<div> <div>
{#if data === null} {#if component === null}
Loading data... Loading data...
{:else} {:else}
{data} {#await component}
Loading data...
{:then v }
<svelte:component this={v.default} />
{/await}
{/if} {/if}
</div> </div>
</main> </main>
<style> <style>
</style> </style>

68
web/contentType.ts Normal file
View File

@ -0,0 +1,68 @@
export default function getComponentForShare(contentType: string, filename: string) {
if (contentType.startsWith("image/")) {
return import("./opener/Default.svelte");
}
if (contentType.startsWith("video/")) {
return import("./opener/Default.svelte");
}
if (contentType.startsWith("audio/")) {
return import("./opener/Default.svelte");
}
if (contentType.startsWith("application/pdf")) {
return import("./opener/Default.svelte");
}
if (contentType.startsWith("text/")) {
return import("./opener/Text.svelte");
}
switch (contentType) {
case "application/json":
case "application/ld+json":
case "application/xhtml+xml":
case "application/xml":
return import("./opener/Default.svelte");
case "application/ogg":
return import("./opener/Default.svelte");
}
const extension = filename.split(".").pop();
if (extension === undefined) {
return import("./opener/Default.svelte");
}
switch (extension) {
case "png":
case "jpg":
case "jpeg":
case "gif":
return import("./opener/Default.svelte");
case "mp4":
case "mov":
case "avi":
case "mkv":
case "wmv":
case "flv":
case "mpg":
case "mpeg":
return import("./opener/Default.svelte");
case "mp3":
case "wav":
case "ogg":
case "flac":
return import("./opener/Default.svelte");
case "pdf":
return import("./opener/Default.svelte");
case "txt":
case "md":
case "markdown":
return import("./opener/Default.svelte");
}
return import("./opener/Text.svelte");
}

10
web/opener/Default.svelte Normal file
View File

@ -0,0 +1,10 @@
<script lang="ts">
export let contentType: string;
export let filename: string;
export let slug: string;
export let response: Response;
</script>
<div>
Default opener
</div>

11
web/opener/Text.svelte Normal file
View File

@ -0,0 +1,11 @@
<script lang="ts">
export let contentType: string;
export let filename: string;
export let slug: string;
export let response: Response;
</script>
<div>
Text opener
</div>