69 lines
1.3 KiB
Svelte
69 lines
1.3 KiB
Svelte
<script lang="ts">
|
|
import { onMount } from "svelte";
|
|
import getComponentForShare from "./contentType";
|
|
const slug = window.location.pathname.split("/").pop();
|
|
|
|
let component = null;
|
|
let contentType: string;
|
|
let filename: string;
|
|
|
|
onMount(async () => {
|
|
const regex = /filename="(.*)"/gm;
|
|
const res = await fetch(`/s/${slug}`,{method:"HEAD"});
|
|
|
|
contentType = res.headers.get("Content-Type");
|
|
|
|
let match;
|
|
while ((match = regex.exec(res.headers.get("Content-Disposition"))) !== null) {
|
|
// This is necessary to avoid infinite loops with zero-width matches
|
|
if (match.index === regex.lastIndex) {
|
|
regex.lastIndex++;
|
|
}
|
|
filename = match[1];
|
|
}
|
|
|
|
document.title = filename;
|
|
|
|
component = getComponentForShare(contentType,filename);
|
|
});
|
|
</script>
|
|
|
|
<div class="dl">
|
|
<a href="/s/{slug}">Download</a>
|
|
</div>
|
|
<main>
|
|
{#if component === null}
|
|
Loading data...
|
|
{:else}
|
|
{#await component}
|
|
Loading data...
|
|
{:then v }
|
|
<svelte:component this={v.default} slug={slug} contentType={contentType} filename={filename} />
|
|
{/await}
|
|
{/if}
|
|
</main>
|
|
|
|
<style>
|
|
|
|
main {
|
|
display: flex;
|
|
justify-content: center;
|
|
padding-top: 5rem;
|
|
}
|
|
|
|
.dl {
|
|
top: 0;
|
|
right: 0;
|
|
position: absolute;
|
|
padding-top: 1rem;
|
|
padding-right: 1rem;
|
|
color: var(--color-secondary);
|
|
}
|
|
|
|
.dl a {
|
|
color: var(--color-secondary);
|
|
text-decoration: none;
|
|
}
|
|
|
|
</style>
|