cachebusting and templating
This commit is contained in:
parent
b90220da22
commit
4f9d46cc28
8 changed files with 214 additions and 206 deletions
24
templates/404.html
Normal file
24
templates/404.html
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}Download not found - transbeam{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<script src="js/download-landing.js?{{ cachebuster }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div id="download" class="section">
|
||||
<h3>The download code you entered wasn't found. The download may have expired.</h3>
|
||||
<form id="download_form" action="download" method="get">
|
||||
<div>
|
||||
<label>
|
||||
<input type="text" id="download_code_input" name="code" placeholder="Download code"/>
|
||||
</label>
|
||||
</div>
|
||||
<input id="download_button" type="submit" value="Download"/>
|
||||
</form>
|
||||
</div>
|
||||
<div class="section">
|
||||
<a href="./"><h3>< Back</h3></a>
|
||||
</div>
|
||||
{% endblock %}
|
||||
27
templates/base.html
Normal file
27
templates/base.html
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<link rel="stylesheet" type="text/css" href="css/transbeam.css?{{ cachebuster }}"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/colors.css?{{ cachebuster }}"/>
|
||||
<link rel="apple-touch-icon" href="images/site-icons/transbeam-apple.png"/>
|
||||
<link rel="manifest" href="manifest.json"/>
|
||||
<title>{% block title %}transbeam{% endblock %}</title>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body {% block body_attrs %}{% endblock %}>
|
||||
<div id="header">
|
||||
<a href="./">
|
||||
<img src="images/site-icons/transbeam.svg" height="128">
|
||||
<h1>transbeam</h1>
|
||||
</a>
|
||||
</div>
|
||||
{% block body %}{% endblock %}
|
||||
<div id="footer">
|
||||
<h5>(c) 2022 xenofem, MIT licensed</h5>
|
||||
<h5><a target="_blank" href="https://git.xeno.science/xenofem/transbeam">source</a></h5>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,52 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/transbeam.css"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/colors.css"/>
|
||||
<link rel="apple-touch-icon" href="images/site-icons/transbeam-apple.png"/>
|
||||
<link rel="manifest" href="manifest.json"/>
|
||||
<script src="js/util.js"></script>
|
||||
<script type="text/javascript">
|
||||
const CODE = "{{ code }}";
|
||||
</script>
|
||||
<script src="js/download.js"></script>
|
||||
<title>{{ file.name }} - transbeam</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="header">
|
||||
<img src="images/site-icons/transbeam.svg" height="128">
|
||||
<h1>transbeam</h1>
|
||||
</div>
|
||||
<div id="download_toplevel" class="section">
|
||||
<div class="file_name">{{ file.name }}</div>
|
||||
<div class="file_size">{{ bytesize::to_string(file.size.clone(), false).replace(" ", "") }}</div>
|
||||
<div class="file_download"><a class="download_button" href="download?code={{ code }}&download=all"></a></div>
|
||||
</div>
|
||||
{% match file.contents %}
|
||||
{% when Some with (files) %}
|
||||
<div id="download_contents" class="section">
|
||||
<details>
|
||||
<summary>Show file list</summary>
|
||||
<table><tbody>
|
||||
{% let offsets = offsets.as_ref().unwrap() %}
|
||||
{% for f in files %}
|
||||
<tr class="{% if offsets.get(loop.index0.clone()).unwrap().clone() > available %}unavailable{% endif %}">
|
||||
<td class="file_size">{{ bytesize::to_string(f.size.clone(), false).replace(" ", "") }}</td>
|
||||
<td class="file_name">{{ f.name }}</td>
|
||||
<td class="file_download"><a class="download_button" href="download?code={{ code }}&download={{ loop.index0 }}"></a></td>
|
||||
<td class="file_unavailable"></td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody></table>
|
||||
</details>
|
||||
</div>
|
||||
{% else %}
|
||||
{% endmatch %}
|
||||
<div id="footer">
|
||||
<h5>(c) 2022 xenofem, MIT licensed</h5>
|
||||
<h5><a target="_blank" href="https://git.xeno.science/xenofem/transbeam">source</a></h5>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}{{ info.file.name }} - transbeam{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<script src="js/util.js?{{ cachebuster }}"></script>
|
||||
<script type="text/javascript">
|
||||
const CODE = "{{ info.code }}";
|
||||
</script>
|
||||
<script src="js/download.js?{{ cachebuster }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div id="download_toplevel" class="section">
|
||||
<div class="file_name">{{ info.file.name }}</div>
|
||||
<div class="file_size">{{ bytesize::to_string(info.file.size.clone(), false).replace(" ", "") }}</div>
|
||||
<div class="file_download"><a class="download_button" href="download?code={{ info.code }}&download=all"></a></div>
|
||||
</div>
|
||||
{% match info.file.contents %}
|
||||
{% when Some with (files) %}
|
||||
<div id="download_contents" class="section">
|
||||
<details>
|
||||
<summary>Show file list</summary>
|
||||
<table><tbody>
|
||||
{% let offsets = info.offsets.as_ref().unwrap() %}
|
||||
{% for f in files %}
|
||||
<tr class="{% if offsets.get(loop.index0.clone()).unwrap().clone() > info.available %}unavailable{% endif %}">
|
||||
<td class="file_size">{{ bytesize::to_string(f.size.clone(), false).replace(" ", "") }}</td>
|
||||
<td class="file_name">{{ f.name }}</td>
|
||||
<td class="file_download"><a class="download_button" href="download?code={{ info.code }}&download={{ loop.index0 }}"></a></td>
|
||||
<td class="file_unavailable"></td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody></table>
|
||||
</details>
|
||||
</div>
|
||||
{% else %}
|
||||
{% endmatch %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
87
templates/index.html
Normal file
87
templates/index.html
Normal file
|
|
@ -0,0 +1,87 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block head %}
|
||||
<link rel="stylesheet" type="text/css" href="css/states.css?{{ cachebuster }}"/>
|
||||
<script src="js/util.js?{{ cachebuster }}"></script>
|
||||
<script src="js/download-landing.js?{{ cachebuster }}"></script>
|
||||
<script src="js/upload.js?{{ cachebuster }}"></script>
|
||||
{% endblock %}
|
||||
|
||||
{% block body_attrs %}class="noscript landing"{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div id="download" class="section">
|
||||
<h3 class="section_heading">Download</h3>
|
||||
<form id="download_form" action="download" method="get">
|
||||
<div>
|
||||
<label>
|
||||
<input type="text" id="download_code_input" name="code" placeholder="Download code"/>
|
||||
</label>
|
||||
</div>
|
||||
<input id="download_button" type="submit" value="Download"/>
|
||||
</form>
|
||||
</div>
|
||||
<noscript>Javascript is required to upload files :(</noscript>
|
||||
<div id="uploads_closed_notice" class="section">
|
||||
<h4>Uploading is currently closed.</h4>
|
||||
</div>
|
||||
<div id="upload" class="section">
|
||||
<h3 class="section_heading">Upload</h3>
|
||||
<div id="message"></div>
|
||||
<div>
|
||||
<form id="upload_password_form">
|
||||
<div>
|
||||
<label>
|
||||
<input id="upload_password" type="password" placeholder="Password"/>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<input type="submit" id="submit_upload_password" value="Submit" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="upload_controls">
|
||||
<div id="upload_settings">
|
||||
<div>
|
||||
<button id="upload_button">Upload</button>
|
||||
</div>
|
||||
<div id="lifetime_container">
|
||||
<label>
|
||||
Keep files for:
|
||||
<select id="lifetime">
|
||||
<option value="1">1 day</option>
|
||||
<option value="7">1 week</option>
|
||||
<option value="14" selected>2 weeks</option>
|
||||
<option value="30">1 month</option>
|
||||
<option value="60">2 months</option>
|
||||
<option value="90">3 months</option>
|
||||
<option value="180">6 months</option>
|
||||
<option value="365">1 year</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div id="download_code_container">
|
||||
<div id="download_code_main">
|
||||
<div>Download code: <span id="download_code"></span></div><div class="copy_button"></div>
|
||||
</div>
|
||||
<div id="copied_message">Link copied!</div>
|
||||
</div>
|
||||
<div id="progress_container">
|
||||
<div id="progress">
|
||||
<div id="progress_percentage"></div>
|
||||
<div id="progress_size"></div>
|
||||
<div id="progress_rate"></div>
|
||||
<div id="progress_eta"></div>
|
||||
</div>
|
||||
<div id="progress_bar"></div>
|
||||
</div>
|
||||
<table id="file_list">
|
||||
</table>
|
||||
<label id="file_input_container">
|
||||
<input type="file" multiple id="file_input"/>
|
||||
<span class="fake_button" id="file_input_message">Select files to upload...</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Loading…
Add table
Add a link
Reference in a new issue