DarkCat09/dc09bin
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Basic frontend

Browse source 
I'm sorry for the big commit

- Added yarte templating engine
- Wrote frontend: all HTML except file input area, basic CSS (themes soon), JS.
No client-side encryption yet. And no working API.
- Simple but handy build system in Makefile
(requires pacman -S entr / apt install entr)
This commit is contained in:
DarkCat09 2024-03-09 16:17:18 +04:00
parent 4b6b3f7da4
commit 96376f2fba
Signed by: DarkCat09
GPG key ID: 0A26CD5B3345D6E3
12 changed files with 805 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

3
templates/file.hbs Normal file
View file

@ -0,0 +1,3 @@
<div>
File
</div>

84
templates/index.hbs Normal file
View file

@ -0,0 +1,84 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>dc09bin</title>
<link rel="stylesheet" href="/static/style.css">
<script src="/static/script.js"></script>
</head>
<body>
<div id="file-tmpl-js" style="display:none" aria-hidden="true">
{{> file }}
</div>
<main>
<header>
<label for="htab-file" tabindex="0" role="tab">File</label>
<label for="htab-link" tabindex="0" role="tab">Link</label>
</header>
<input type="radio" name="tab" class="htab" id="htab-file" aria-hidden="true" checked>
<input type="radio" name="tab" class="htab" id="htab-link" aria-hidden="true">
<form action="/api/upload" method="post" id="tab-file" role="tabpanel">
{{> no-auto-submit }}
<div class="form-main">
{{> file }}
</div>
<div class="form-footer">
<div>
<span>Encryption:</span>
<label><input type="radio" name="enc" id="enc-off">Off</label>
<label><input type="radio" name="enc" id="enc-random" checked>Random key</label>
<label for="enc-pswd">
<input type="radio" name="enc" id="enc-pswd">
Custom password:
<input type="password" id="enc-pswd-input">
<button type="button" class="show-pswd" data-input="enc-pswd-input">Show</button>
</label>
</div>
<div>
<button type="button" id="add-file">Add file</button>
<button type="submit">Upload</button>
</div>
</div>
</form>
<form action="/api/shorten" method="post" id="tab-link" role="tabpanel">
{{> no-auto-submit }}
<div class="form-main">
{{> link }}
</div>
<div class="form-footer">
<div>
<span>Link ID:</span>
<label for="link-rand">
<input type="radio" name="linkid" id="link-rand" checked>
<div>
<span>Random</span>
</div>
</label>
<label>
<input type="radio" disabled style="opacity:0" aria-hidden="true">
<div>
<label>Length: <input type="number" name="link-rand-len" min="4" max="20" size="5" value="6"></label>
<label>Exclude symbols: <input type="text" size="5" value="lIO"></label>
</div>
</label>
<label for="link-custom">
<input type="radio" name="linkid" id="link-custom">
Custom:
<input type="text" name="link-custom-input" minlength="4" maxlength="30" pattern="^[A-Za-z0-9_-]+$">
</label>
<label for="link-pswd">
<input type="checkbox" id="link-pswd">
Password:
<input type="password" id="link-pswd-input">
<button type="button" class="show-pswd" data-input="link-pswd-input">Show</button>
</label>
</div>
<div>
<button type="submit">Shorten</button>
</div>
</div>
</form>
</main>
</body>
</html>

3
templates/link.hbs Normal file
View file

@ -0,0 +1,3 @@
<div class="link-input-wrapper">
<input type="text" name="long-link" placeholder="paste a long link">
</div>

2
templates/no-auto-submit.hbs Normal file
View file

@ -0,0 +1,2 @@
{{! huge thanks to https://stackoverflow.com/a/51507806 !}}
<button type="submit" disabled style="display:none" aria-hidden="true"></button>