svk/vault-unwrap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Добавлена работа с файлами. Добавлен показ изображений и загрузка файлов. Изменен дизайн

Browse Source
This commit is contained in:
Калинин Сергей Валерьевич
2025-07-21 13:10:19 +03:00
parent 10c9635894
commit c4ded33507
4 changed files with 528 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

239
html-template/index.html
View File

@@ -1,39 +1,206 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Data Unwrap Form</title>
</head>
<body>
<table>
<tr><td>
<!-- <a href={{.URL}}/unwrap>Расшифровать</a> |
<a href={{.URL}}/genpassword>Сгенерировать пароль</a>-->
<tr><td><p></p></td></tr>
<tr><td>
<form method="post">
<table>
<tr><td>
Введите текст или токен:
</td></tr>
<tr><td>
<textarea id="wrapped_token" name="input_token" cols=50 rows=10 maxlength="{{ .MAXTEXTLENGTH }}">{{ .TEXT }}</textarea>
</td></tr>
<tr><td align=right>
<!-- Время жизни токена {{.TOKENTTL}} сек.-->
<button type="submit" formaction="{{.URL}}/wrap">Зашифровать</button>
<button type="submit" formaction="{{.URL}}/unwrap">Расшифровать</button>
<tr><td><hr></td></tr>
</td></tr>
<tr><td align=right>
Длина пароля (от 15 до {{ .MAXTEXTLENGTH }})
<input type="text" name="passlength"/ size=4 pattern="[0-9]{2,4}">
<button type="submit" formaction="{{.URL}}/genpassword">Сгенерировать пароль</button>
</td></tr>
</form>
</td></tr>
<tr><td></td></tr>
</table>
</body>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Data Wrap/Unwrap Form</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #f9f9f9;
display: flex;
flex-direction: column;
min-height: 100vh;
box-sizing: border-box; /* Добавлено */
}
.content {
flex: 1;
padding-bottom: 20px; /* Добавлено */
}
.form-container {
background: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
margin-bottom: 15px; /* Уменьшено */
}
h1 {
color: #333;
text-align: center;
margin-bottom: 25px; /* Уменьшено */
font-size: 1.8em; /* Добавлено */
}
textarea {
width: 100%;
max-width: 100%;
min-height: 120px; /* Уменьшено */
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-family: monospace;
resize: vertical;
box-sizing: border-box; /* Добавлено */
}
input[type="file"] {
margin: 8px 0; /* Уменьшено */
width: 100%; /* Добавлено */
}
input[type="number"] {
width: 60px;
padding: 5px;
border: 1px solid #ddd;
border-radius: 4px;
}
button {
padding: 8px 16px;
background: #4CAF50;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
margin: 4px; /* Уменьшено */
transition: background 0.3s;
}
button:hover {
background: #45a049;
}
hr {
border: 0;
height: 1px;
background: #ddd;
margin: 15px 0; /* Уменьшено */
}
.form-title {
font-weight: bold;
margin-bottom: 8px; /* Уменьшено */
color: #555;
font-size: 0.95em; /* Добавлено */
}
.button-group {
text-align: right;
margin-top: 8px; /* Уменьшено */
}
footer {
text-align: center;
padding: 12px 0;
color: #777;
font-size: 0.85em; /* Уменьшено */
border-top: 1px solid #eee;
background: white;
margin-top: auto; /* Важно для прижатия */
position: sticky;
bottom: 0;
}
.footer-links {
margin-top: 6px; /* Уменьшено */
}
.footer-links a {
color: #4CAF50;
text-decoration: none;
margin: 0 6px; /* Уменьшено */
font-size: 0.85em; /* Уменьшено */
}
.footer-links a:hover {
text-decoration: underline;
}
@media (max-width: 600px) {
body {
padding: 15px;
}
.form-container {
padding: 15px;
}
h1 {
font-size: 1.5em;
margin-bottom: 20px;
}
button {
padding: 6px 12px;
font-size: 0.9em;
}
.btn-link {
background: #9C27B0;
}
.btn-link:hover {
background: #7B1FA2;
}
}
</style>
</head>
<body>
<div class="content">
<!-- <h1>Сервис передачи секретов</h1> -->
<div class="form-container">
<div class="form-title">Введите текст или токен:</div>
<form method="post" action="{{.URL}}/wrap">
<textarea id="tokenTextarea" name="input_token" maxlength="{{.MAXTEXTLENGTH}}" placeholder="Введите текст или токен...">{{.TEXT}}</textarea>
<div class="button-group">
<button type="submit">Зашифровать</button>
<button type="submit" formaction="{{.URL}}/unwrap">Расшифровать</button>
<button type="button" class="btn-copy" onclick="copyToken()">Скопировать</button>
</div>
</form>
</div>
<div class="form-container">
<div class="form-title">Выберите файл (до 100кб):</div>
<form method="post" action="{{.URL}}/wrapfile" enctype="multipart/form-data">
<input type="file" name="file" id="file" required>
<div class="button-group">
<button type="submit">Зашифровать файл</button>
</div>
</form>
</div>
<div class="form-container">
<div class="form-title">Генерация пароля:</div>
<form method="post" action="{{.URL}}/genpassword">
<div style="display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;">
<div style="margin-bottom: 8px;">
Длина пароля (от 15 до {{.MAXTEXTLENGTH}}):
<input type="number" name="passlength" min="15" max="{{.MAXTEXTLENGTH}}" value="32">
</div>
<button type="submit" style="margin-left: auto;">Сгенерировать пароль</button>
</div>
</form>
</div>
</div>
<footer>
<div>© <script>document.write(new Date().getFullYear())</script> SVK</div>
</footer>
<script>
function copyToken() {
const textarea = document.getElementById('tokenTextarea');
const fullText = textarea.value;
const token = fullText.split('\n')[0].trim();
copyToClipboard(token, '.btn-copy');
}
function copyToClipboard(text, buttonSelector) {
const tempInput = document.createElement('input');
tempInput.value = text;
document.body.appendChild(tempInput);
tempInput.select();
document.execCommand('copy');
document.body.removeChild(tempInput);
const copyBtn = document.querySelector(buttonSelector);
const originalText = copyBtn.textContent;
copyBtn.textContent = 'Скопировано!';
setTimeout(() => {
copyBtn.textContent = originalText;
}, 2000);
}
</script>
</body>
</html>