bin/server/templates/index.stpl
2024-01-25 22:36:52 +01:00

57 lines
2.4 KiB
Text

<html>
<head>
<title>pfzetto bin</title>
<link rel="icon" type="image/svg" href="https://pfzetto.de/pfzetto.svg"/>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<% include!("./style.stpl"); %>
</head>
<body>
<canvas id="matrix"></canvas>
<main id="main">
<h1>pfzetto bin</h1>
<p>
An empty bin was created for you. The first HTTP POST or PUT request can upload data.
All following requests can only read the uploaded data.
</p>
<p>To change the default expiration date, you can use the <code>?ttl=<seconds_to_live></code> parameter.</p>
<p>Set the <code>Content-Type</code> header of the file you upload to make viewing easier.
<p>After uploading data, you can access it by accessing <a href="<%= bin_url %>"><%= bin_url %></a> with an optional file extension that suits the data that you uploaded.</p>
<h1>web upload</h1>
<label class="file">
<input type="file" id="file" aria-label="File browser">
<span class="file-custom"></span>
</label>
<button type="button" onclick="upload()">Upload</button>
<h1>upload an image</h1>
<pre>
$ curl -H "Content-Type: image/png" -T my-image.png <%= bin_url %>`
</pre>
<h1>create and upload tar</h1>
<pre>
$ tar -cz . | curl -T - -H "Content-Type: application/gzip" <%= bin_url %>
</pre>
</main>
<a class="watermark" href="https://pfzetto.de"><img src="https://pfzetto.de/pfzetto.svg" alt="pfzetto Logo"></a>
<% include!("./background.stpl"); %>
<script>
function upload() {
const input = document.getElementById("file");
const body = document.getElementById("main");
body.innerHtml = "uploading file. please keep this page open.";
fetch(window.location.pathname, {
method: 'POST',
headers: {
"Content-Type": input.files[0].type
},
body: input.files[0]
})
.then((response) => response.text())
.then((response) => {body.innerText = response;});
}
</script>
</body>
</html>