Files
fnx_web/res/template/home.html
2021-09-03 17:41:32 +02:00

439 lines
15 KiB
HTML

{{define "home"}}
<!DOCTYPE html>
<html lang="en">
<head>
{{template "meta_tags" "Free file sharing service"}}
{{template "user_style" .}}
<style>
.header_image{
width: 100%;
max-width: 800px;
margin: 0 auto 50px auto;
}
.feat_table {
display: flex;
flex-direction: column;
}
.feat_table > div {
display: flex;
flex-direction: row;
}
.feat_table > div > div:first-child {
flex: 0 0 20%;
max-width: 20%;
}
.feat_table > div > div {
flex: 1 1 0;
margin: 0.25em;
padding: 0.5em;
text-align: center;
word-wrap: break-word;
hyphens: auto;
}
.feat_table > div > .feat_label {
border-top-left-radius: 0.5em;
border-bottom-left-radius: 0.5em;
background-color: var(--layer_1_color);
}
.feat_table > div > .feat_normal {
background-color: var(--layer_3_color);
box-shadow: 1px 1px 3px -1px var(--shadow_color);
text-shadow: 1px 1px 3px var(--shadow_color);
}
.feat_table > div > .feat_pro {
background-color: var(--layer_4_color);
box-shadow: 1px 1px 3px 0 var(--shadow_color);
text-shadow: 1px 1px 6px var(--shadow_color);
}
.feat_table > div > .feat_highlight {
border: 1px solid var(--highlight_color)
}
.text_highlight {
color: var(--highlight_color);
text-shadow: 0 0 4px var(--shadow_color);
font-size: 1.1em;
font-weight: bold;
}
.feat_table > div > .cell_background {
background-position: center;
background-size: cover;
text-align: left;
font-size: 1.2em;
padding: 0.2em;
}
.feat_table > div > div.round_tl { border-top-left-radius: 0.5em; }
.feat_table > div > div.round_tr { border-top-right-radius: 0.5em; }
.feat_table > div > div.round_br { border-bottom-right-radius: 0.5em; }
.feat_table > div > div.round_bl { border-bottom-left-radius: 0.5em; }
{{ template `modal.css` }}
</style>
<script>
window.api_endpoint = '{{.APIEndpoint}}';
window.user_subscription = {{.User.Subscription}};
</script>
<link rel='stylesheet' href='/res/svelte/home_page.css?v9'>
<script defer src='/res/svelte/home_page.js?v9'></script>
</head>
<body>
{{template "page_top" .}}
<picture>
<source media="(max-width: 800px)" srcset="/res/img/header_orbitron.png">
<img class="header_image" src="/res/img/header_orbitron_wide.png" alt="Header image">
</picture>
<br/>
<!-- Svelte element -->
<div id="uploader" class="page_content" style="padding-top: 0; margin-bottom: 50px;"></div>
<h1>What is pixeldrain?</h1>
<div class="page_content"><div class="limit_width">
<p>
Pixeldrain is a file sharing website built for speed and ease of
use. You can upload files you want to share online to our
servers and we will hold on to them for at least a month. During
this time anyone with the link will be able to download your
files. Pixeldrain is built to be as fast as possible, so you
don't have to do any unnecessary waiting when downloading files.
</p>
<p>
Files can be uploaded by clicking the big green upload
button, or by dragging them onto this page from your file
manager.
</p>
<p>
If you uploaded multiple files at once you can also create a
list, which is a collection of files with one single link. Like
a photo album, a music record or a video compilation. Click the
'Create list with uploaded files' button after your uploads are
complete. The files will be saved in the order you uploaded
them.
</p>
<h2 id="pro">Getting more out of pixeldrain</h2>
<p>
By purchasing a subscription you support pixeldrain on its
mission to make content sharing easier, safer and faster for
everyone.
</p>
<div class="feat_table">
<div>
<div></div>
<div class="feat_normal round_tl">Free</div>
<div class="feat_pro feat_highlight round_tr">Pro</div>
</div>
<div>
<div class="feat_label">Size limit per file</div>
<div class="feat_normal">5 GB per file</div>
<div class="feat_pro">
<span class="text_highlight">15 GB</span> per file
</div>
</div>
<div>
<div class="feat_label">
<a href="javascript:void(0);" onclick="return explainFileExpiry();">File expiry</a>
</div>
<div class="feat_normal">
30 days after the last time it is viewed
</div>
<div class="feat_pro">
<span class="text_highlight">90 days</span> after the last time it is viewed
</div>
</div>
<div>
<div class="feat_label">
Adver&shy;tise&shy;ments
</div>
<div class="feat_normal">
Pop-up or a banner ad on the file viewer page
</div>
<div class="feat_pro">
<span class="text_highlight">No ads</span> on files
you share. No ads when viewing files uploaded by
other users
</div>
</div>
<div>
<div class="feat_label">Privacy</div>
<div class="feat_normal">
No trackers, but advertisers can see your IP address
and browser fingerprint
</div>
<div class="feat_pro">
<span class="text_highlight">Completely
private</span>. No third party scripts and no
logging
</div>
</div>
<div>
<div class="feat_label">
<a href="javascript:void(0);" onclick="return explainDirectLinking();">Direct linking</a>
</div>
<div class="feat_normal">
Rate limiting mode will be enabled when a file has 3
times more downloads than views
</div>
<div class="feat_pro">
<span class="text_highlight">1 terabyte</span> of
direct downloads per 30 days. Never have to enter a
CAPTCHA while logged in
<br/>
<button class="round" onclick="return explainDirectLinking()">
<i class="icon">info</i>
More information
</button>
</div>
</div>
<div>
<div class="feat_label">
Online file previews
</div>
<div class="feat_pro">
View image, video, audio, PDF and text files directly in your web browser
</div>
</div>
<div>
<div></div>
<div class="feat_normal round_bl">Free</div>
<div class="feat_pro feat_highlight round_br">
{{if eq .User.Subscription.ID "patreon_1"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
Only
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291427" class="button button_highlight round">
€ 2 per month
</a>
or
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291427&cadence=12" class="button button_highlight round">
€ 20 per year!
</a>
<br/>
(Excluding tax)
<br/>
Subscription managed by Patreon
{{end}}
</div>
</div>
</div>
<br/>
<div style="text-align: center;">
Do you need even more time and space? Check out our other plans
</div>
<br/>
<div class="feat_table">
<div>
<div class="feat_label">Resolve</div>
<div class="feat_normal">
<span class="text_highlight">20 GB</span> file size<br/>
<span class="text_highlight">2 TB</span> direct link bandwidth<br/>
<span class="text_highlight">120 days</span> file expiry
</div>
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_5_small.png');">
{{if eq .User.Subscription.ID "patreon_5"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5736701" class="button button_highlight round">€ 4</a>
{{end}}
</div>
</div>
<div>
<div class="feat_label">Persistence</div>
<div class="feat_normal">
<span class="text_highlight">20 GB</span> file size<br/>
<span class="text_highlight">4 TB</span> direct link bandwidth<br/>
<span class="text_highlight">240 days</span> file expiry
</div>
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_2_small.png');">
{{if eq .User.Subscription.ID "patreon_2"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291482" class="button button_highlight round">€ 8</a>
{{end}}
</div>
</div>
<div>
<div class="feat_label">Tenacity</div>
<div class="feat_normal">
<span class="text_highlight">20 GB</span> file size<br/>
<span class="text_highlight">8 TB</span> direct link bandwidth<br/>
<span class="text_highlight">480 days</span> file expiry
</div>
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_3_small.png');">
{{if eq .User.Subscription.ID "patreon_3"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291516" class="button button_highlight round">€ 16</a>
{{end}}
</div>
</div>
<div>
<div class="feat_label">Eternity</div>
<div class="feat_normal">
<span class="text_highlight">20 GB</span> file size<br/>
<span class="text_highlight">16 TB</span> direct link bandwidth<br/>
<span class="text_highlight">Files never expre</span>
</div>
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_4_small.png');">
{{if eq .User.Subscription.ID "patreon_4"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=5291528" class="button button_highlight round">€ 32</a>
{{end}}
</div>
</div>
<div>
<div class="feat_label">Infinity</div>
<div class="feat_normal">
<span class="text_highlight">20 GB</span> file size<br/>
<span class="text_highlight">32 TB</span> direct link bandwidth<br/>
<span class="text_highlight">Files never expre</span>
</div>
<div class="feat_pro round_tr round_br cell_background" style="background-image: url('/res/img/benefit_6_small.png');">
{{if eq .User.Subscription.ID "patreon_6"}}
You have this plan<br/>
Thank you for supporting pixeldrain!
{{else}}
<a href="https://www.patreon.com/join/pixeldrain/checkout?rid=6573749" class="button button_highlight round">€ 64</a>
{{end}}
</div>
</div>
</div>
<!--
<br/>
<h2>Premium</h2>
<div class="highlight_dark">
Pixeldrain Premium is still in development and not generally
available yet. Stay tuned.
</div>
<p>
Premium is more catered toward content delivery. This plan
enables the Buckets feature which provides a more structured way
to manage your files on pixeldrain. Buckets allow direct linking
to files without running into rate limiting.
</p>
<p>
When you choose for Premium you will also get all the benefits
of the Pro subscription. A base rate of €2 per month will be
billed regardless of your usage.
</p>
-->
</div></div>
<template id="tpl_file_expiry">
<p>
Files on pixeldrain have to expire eventually. If we didn't do
this the website would keep growing forever and we would run out
of money pretty quickly.
</p>
<p>
Unlike most other sharing sites pixeldrain uses a postponing
system for expiring files. When a file is freshly uploaded it
gets 30 days by default (90 days if you have the pro plan).
After these 30 days we will check when the file was last viewed.
Files which are regularly viewed could still bring new users to
the platform, it would be rude to show these people a File Not
Found page. So if the file was viewed in the last 30 days we
will simply postpone the next check a month. If the file was not
viewed however it will immediately be removed.
</p>
<p>
Views are only counted when someone visits the download page in
a web browser. This makes sure that users can see that the file
comes from pixeldrain.
</p>
<p>
This way we can minimize dead links, and you won't have to tell
your friends to 'hurry and download this before it expires'.
</p>
</template>
<template id="tpl_direct_linking">
<p>
Paying for bandwidth is the most expensive part of running
pixeldrain. Because of this we have to limit what can be
downloaded and by who.
</p>
<p>
Normally when you view a file it's on pixeldrain's file viewer.
The file viewer is the page with the download button, the name
of the file and a frame where you can view the file if it's an
image, video, audio, PDF or text file.
</p>
<h3>Rate limiting</h3>
<p>
It's also possible to link directly to a file instead of the
download page. This circumvents our advertisers and branding and
thus we lose money when people do this. That's why I added 'rate
limiting mode' to files. This mode is enabled when a file has
been downloaded three times more than it has been viewed through
the file viewer. When rate limiting mode is activated a file
cannot be downloaded through the API, the request needs to come
from the file viewer page. On the file viewer you will see a
CAPTCHA to fill in when you click the download button.
</p>
<h3>Direct downloading with a Pro subscription</h3>
<p>
When you have a Pro subscription you will get a monthly
bandwidth cap for all the files on your account combined. Normal
downloads through the file viewer will not be subtracted from
the cap, so nothing changes if you keep using the site like
normal. If people download your files directly from the API (by
replacing the /u/ part in the link with /api/file/) the
bandwidth usage will be subtracted from the bandwidth cap on
your account. If the bandwidth cap is exceeded rate limiting
mode will be enabled for all the files on your account with
three times more downloads than views.
</p>
<p>
The bandwidth cap on your account is a 30 day rolling window.
This means that bandwidth usage will expire 30 days after it was
used. Your counter will not reset at the start of the next
month.
</p>
<p>
When a list of files is downloaded with the 'DL all files'
button each file in the resulting zip file will be counted
separately.
</p>
</template>
{{template "page_bottom" .}}
<script>
'use strict';
{{template "Modal.js"}}
function explainFileExpiry() {
let m = new Modal(
document.body, null, "File Expiry Postponing", "600px", "auto"
)
m.cloneTemplate("tpl_file_expiry")
m.open()
return false
}
function explainDirectLinking() {
let m = new Modal(
document.body, null, "Direct Linking Bandwidth", "800px", "auto"
)
m.cloneTemplate("tpl_direct_linking")
m.open()
return false
}
if (window.location.hash === "#direct_linking") {
explainDirectLinking()
}
</script>
{{template "analytics"}}
</body>
</html>
{{end}}