2017-11-10 12:39:55 +01:00
|
|
|
{{define "home"}}
|
|
|
|
|
<!DOCTYPE html>
|
2020-01-17 20:32:21 +01:00
|
|
|
<html lang="en">
|
2017-11-10 12:39:55 +01:00
|
|
|
<head>
|
2018-06-25 23:05:18 +02:00
|
|
|
{{template "meta_tags" "Free file sharing service"}}
|
2019-02-18 13:37:41 +01:00
|
|
|
{{template "user_style" .}}
|
2020-01-14 17:10:03 +01:00
|
|
|
<style>
|
|
|
|
|
.instruction_highlight {
|
|
|
|
|
border-top: 1px solid var(--layer_2_color_border);
|
|
|
|
|
border-bottom: 1px solid var(--layer_2_color_border);
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
margin: 10px 0;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
}
|
|
|
|
|
.big_number {
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
text-align: center;
|
|
|
|
|
display: block;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
background-color: var(--highlight_color);
|
|
|
|
|
color: var(--highlight_text_color);
|
|
|
|
|
border-radius: 30px;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
width: 34px;
|
|
|
|
|
height: 34px;
|
|
|
|
|
float: left;
|
|
|
|
|
}
|
|
|
|
|
.instruction_text {
|
|
|
|
|
margin: 5px;
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
display: block;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
}
|
|
|
|
|
.social_button {
|
|
|
|
|
margin: 5px;
|
|
|
|
|
}
|
|
|
|
|
.social_button > img, .social_button > svg {
|
|
|
|
|
width: 40px;
|
|
|
|
|
height: 40px;
|
|
|
|
|
margin: 5px 15px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
2017-11-10 12:39:55 +01:00
|
|
|
</head>
|
|
|
|
|
<body>
|
2019-09-16 23:50:57 +02:00
|
|
|
{{template "page_top" .}}
|
|
|
|
|
|
2019-09-18 22:23:12 +02:00
|
|
|
<img id="header_image" class="header_image" src="/res/img/header_2019.png" alt="Header image"/>
|
2019-09-16 23:50:57 +02:00
|
|
|
<br/>
|
2019-09-17 23:38:40 +02:00
|
|
|
<div class="page_content">
|
2020-01-14 17:10:03 +01:00
|
|
|
<h1>How to share files with pixeldrain</h1>
|
|
|
|
|
<div id="instruction_1" class="instruction_highlight"><div class="limit_width">
|
|
|
|
|
<span class="big_number">1</span><span class="instruction_text">Select files to upload</span>
|
|
|
|
|
You can also drop files anywhere on this page from your file
|
|
|
|
|
manager
|
|
|
|
|
</div></div>
|
2019-09-17 23:38:40 +02:00
|
|
|
<input id="file_input_field" type="file" name="file" multiple="multiple"/>
|
2020-04-14 16:00:24 +02:00
|
|
|
<button id="upload_file_button" class="big_button button_highlight">
|
|
|
|
|
<i class="icon">cloud_upload</i>
|
|
|
|
|
<u>U</u>pload Files</button>
|
|
|
|
|
<button id="upload_text_button" class="big_button button_highlight">
|
|
|
|
|
<i class="icon">text_fields</i>
|
|
|
|
|
Upload <u>T</u>ext</button>
|
2019-09-17 23:38:40 +02:00
|
|
|
<br/>
|
2017-11-10 12:39:55 +01:00
|
|
|
<p>
|
2020-01-17 20:32:21 +01:00
|
|
|
By uploading files to pixeldrain you accept that a cookie will
|
2020-01-14 17:10:03 +01:00
|
|
|
be placed in your web browser. More information on the
|
|
|
|
|
<a href="/about">about</a> page
|
2019-06-04 10:13:19 +02:00
|
|
|
<p>
|
2020-01-27 16:56:16 +01:00
|
|
|
<div id="instruction_2" class="instruction_highlight">
|
2020-01-14 17:10:03 +01:00
|
|
|
<div class="limit_width">
|
|
|
|
|
<span class="big_number">2</span><span class="instruction_text">Wait for the files to finish uploading</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2019-09-17 23:38:40 +02:00
|
|
|
<div id="uploads_queue"></div>
|
2020-01-14 17:10:03 +01:00
|
|
|
|
2020-01-27 16:56:16 +01:00
|
|
|
<div id="instruction_3" class="instruction_highlight">
|
2020-01-14 17:10:03 +01:00
|
|
|
<div class="limit_width"><span class="big_number">3</span><span class="instruction_text">Share the files</span></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="instruction_3_after" style="display: none">
|
|
|
|
|
<div id="navigator_share_button" style="display: inline-block">
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_social_share" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `share.svg` .}}<br/>Share
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_copy_link" class="social_button" style="display: inline-block">
|
2020-01-14 17:22:24 +01:00
|
|
|
{{template `copy.svg` .}}<br/><span><u>C</u>opy link</span>
|
2020-01-14 17:10:03 +01:00
|
|
|
</button>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_open_link" class="social_button" style="display: inline-block">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `open_in_new.svg` .}}<br/><span>Open link</span>
|
|
|
|
|
</button>
|
|
|
|
|
<div id="social_buttons" style="display: inline-block">
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_social_email" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `email.svg` .}}<br/>E-Mail
|
|
|
|
|
</button>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_social_twitter" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `twitter.svg` .}}<br/>Twitter
|
|
|
|
|
</button>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_social_facebook" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `facebook.svg` .}}<br/>Facebook
|
|
|
|
|
</button>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btn_social_reddit" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `reddit.svg` .}}<br/>Reddit
|
|
|
|
|
</button>
|
2020-01-20 12:43:43 +01:00
|
|
|
<button id="btc_social_tumblr" class="social_button">
|
2020-01-14 17:10:03 +01:00
|
|
|
{{template `tumblr.svg` .}}<br/>Tumblr
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
<br/>
|
2020-04-14 16:00:24 +02:00
|
|
|
<button id="btn_create_list"><i class="icon small">list</i> Create list with uploaded files</button>
|
|
|
|
|
<button id="btn_copy_links"><i class="icon small">content_copy</i> Copy all links to clipboard</button>
|
|
|
|
|
<button id="btn_copy_markdown"><i class="icon small">content_copy</i> Copy markdown to clipboard</button>
|
|
|
|
|
<button id="btn_copy_bbcode"><i class="icon small">content_copy</i> Copy BBCode to clipboard</button>
|
2020-01-14 17:10:03 +01:00
|
|
|
<br/>
|
|
|
|
|
<div id="created_lists"></div>
|
|
|
|
|
</div>
|
2019-02-12 21:51:01 +01:00
|
|
|
|
2019-09-17 23:38:40 +02:00
|
|
|
<br/>
|
|
|
|
|
<div class="limit_width">
|
2020-01-13 21:50:53 +01:00
|
|
|
<h2>What is pixeldrain?</h2>
|
2019-09-17 23:38:40 +02:00
|
|
|
<p>
|
|
|
|
|
Pixeldrain is a file sharing website built for speed and
|
|
|
|
|
ease of use. Pixeldrain does not cost any money, though
|
|
|
|
|
donations are appreciated. For donation methods see the
|
|
|
|
|
<a href="/about">about</a> page.
|
|
|
|
|
</p>
|
|
|
|
|
<h2>How to use pixeldrain</h2>
|
|
|
|
|
<p>
|
|
|
|
|
Files can be uploaded by clicking the big green upload
|
|
|
|
|
button, or by dragging them onto this page from your file
|
|
|
|
|
manager. You can not upload directories at this time, only
|
|
|
|
|
files. The maximum file size you can upload is 10 GB.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
You can also create lists, which are a collection of files.
|
|
|
|
|
Like a photo album, a music record or a video compilation.
|
|
|
|
|
To do this you need to upload a bunch of files at once. The
|
|
|
|
|
files will be saved in the order you upload them in. When
|
|
|
|
|
all files have finished uploading you click the "Create list
|
|
|
|
|
with uploaded files" button and you will be asked to enter a
|
|
|
|
|
name for your list. After picking a name the list will be
|
|
|
|
|
created and opened in a new window. If your browser blocks
|
|
|
|
|
the window you can also find a link to the list at the
|
|
|
|
|
bottom of your uploaded files.
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
For more information see the <a href="/about">about</a>
|
|
|
|
|
page.
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
2017-11-10 12:39:55 +01:00
|
|
|
</div>
|
|
|
|
|
|
2020-01-31 19:16:20 +01:00
|
|
|
{{template "page_bottom" .}}
|
2019-09-16 23:50:57 +02:00
|
|
|
|
2020-01-17 20:32:21 +01:00
|
|
|
<script>
|
2020-01-27 16:56:16 +01:00
|
|
|
'use strict';
|
|
|
|
|
let apiEndpoint = '{{.APIEndpoint}}';
|
|
|
|
|
{{template "util.js"}}
|
|
|
|
|
{{template "UploadManager.js"}}
|
|
|
|
|
{{template "homepage.js"}}
|
2019-12-23 23:56:57 +01:00
|
|
|
</script>
|
|
|
|
|
|
2017-11-10 12:39:55 +01:00
|
|
|
{{template "analytics"}}
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
|
|
|
|
{{end}}
|
