Files
fnx_web/svelte/src/file_viewer/viewers/File.svelte

66 lines
1.5 KiB
Svelte

<script>
import { createEventDispatcher } from "svelte";
import { formatDuration } from "../../util/Formatting.svelte";
let dispatch = createEventDispatcher()
export let file = {
id: "",
size: 0,
name: "",
mime_type: "",
icon_href: "",
show_ads: false,
}
</script>
<div class="container">
<h1>You are viewing a file on pixeldrain</h1>
<img src={file.icon_href} alt="File icon" class="icon">
<div class="description">
Name: {file.name}<br/>
Type: {file.mime_type}<br/>
No preview is available for this file type. Download to view it locally.
<br/>
<button class="button_highlight" on:click={() => {dispatch("download")}}>
<i class="icon">save</i> Download
</button>
</div>
{#if file.show_ads && file.size > 5e8}
<br/>
<div class="description" style="max-width: 700px; text-align: center;">
<!-- If the file is larger than 500 MB-->
<hr/>
Your download speed is currently limited to 4 MiB/s. Downloading this
file for free will take at least
{formatDuration((file.size/4194304)*1000)}.
You can
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291427&cadence=12">
upgrade to Pro
</a>
to download at the fastest speed available.
</div>
{/if}
</div>
<style>
.icon {
display: inline-block;
vertical-align: top;
}
.description {
display: inline-block;
text-align: left;
padding-left: 8px;
vertical-align: middle;
max-width: 600px;
}
.container {
position: relative;
display: block;
height: 100%;
width: 100%;
text-align: center;
overflow: hidden;
}
</style>