mirror of
https://github.com/ION606/ion-stop-enc.git
synced 2026-05-14 20:06:54 +00:00
158 lines
4.6 KiB
HTML
158 lines
4.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Encrypt/Decrypt File Form</title>
|
|
<style>
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
margin: 20px;
|
|
}
|
|
|
|
form,
|
|
#displform {
|
|
max-width: 400px;
|
|
margin: auto;
|
|
}
|
|
|
|
label {
|
|
display: block;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
input[type="text"],
|
|
input[type="password"],
|
|
input[type="file"] {
|
|
width: 100%;
|
|
padding: 8px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.password-container {
|
|
position: relative;
|
|
}
|
|
|
|
.view-password {
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
cursor: pointer;
|
|
}
|
|
|
|
button {
|
|
display: block;
|
|
width: 100%;
|
|
padding: 10px;
|
|
margin-top: 20px;
|
|
background-color: #4CAF50;
|
|
color: white;
|
|
border: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
button:hover {
|
|
background-color: #45a049;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
document.getElementById('encryptDecryptForm').addEventListener('submit', function (e) {
|
|
e.preventDefault();
|
|
sendToServer();
|
|
});
|
|
})
|
|
|
|
function togglePassword() {
|
|
const passwordInput = document.getElementById('passwordInput');
|
|
const type = (passwordInput.getAttribute('type') === 'password') ? 'text' : 'password';
|
|
passwordInput.setAttribute('type', type);
|
|
document.querySelector('.view-password').innerText = (type === 'text') ? '🔒' : '👁️';
|
|
}
|
|
|
|
async function sendToServer() {
|
|
const form = document.getElementById('encryptDecryptForm');
|
|
const formData = new FormData(form);
|
|
const isEncrypt = document.getElementById('encryptToggle').checked;
|
|
const endpoint = isEncrypt ? '/encrypt' : '/decrypt';
|
|
|
|
fetch(endpoint, {
|
|
method: 'POST',
|
|
body: formData,
|
|
})
|
|
.then(async response => {
|
|
const blob = await response.blob();
|
|
const url = window.URL.createObjectURL(blob);
|
|
const a = document.createElement('a');
|
|
a.style.display = 'none';
|
|
a.href = url;
|
|
a.download = response.headers.get('content-disposition').split('filename=')[1].split(';')[0]
|
|
document.body.appendChild(a);
|
|
a.click();
|
|
window.URL.revokeObjectURL(url);
|
|
|
|
})
|
|
.catch((error) => {
|
|
console.error(error);
|
|
alert("ERROR!");
|
|
});
|
|
}
|
|
|
|
async function getSaltAndIv() {
|
|
const response = await fetch('/getsaltandiv', { method: 'POST' });
|
|
const siv = await response.json();
|
|
const el = document.querySelector('#salivdisp');
|
|
el.innerHTML = `<code>IV: ${siv.iv}</code><br><code>Salt: ${siv.salt}</code>`;
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div style="text-align: center; margin-bottom: 50px;">
|
|
<h1 style="margin-bottom: 10px;">A Simple File/Text Encryptor</h1>
|
|
<h2 style="margin-top: 5px;">Created by ION606</h2>
|
|
</div>
|
|
|
|
<form id="encryptDecryptForm">
|
|
<hr>
|
|
<label for="fileInput">File</label>
|
|
<input type="file" id="fileInput" name="file">
|
|
|
|
<h3>OR</h3>
|
|
|
|
<label for="textInput">Text</label>
|
|
<input type="text" id="textInput" name="text">
|
|
|
|
<br><br>
|
|
<hr>
|
|
|
|
<label for="passwordInput">Password</label>
|
|
<div class="password-container">
|
|
<input type="password" id="passwordInput" name="password" required>
|
|
<span class="view-password" onclick="togglePassword()">👁️</span>
|
|
</div>
|
|
|
|
<label for="encryptToggle">
|
|
<input type="checkbox" id="encryptToggle" name="encryptToggle" checked> Encrypt
|
|
</label>
|
|
|
|
<button type="submit">Submit</button>
|
|
</form>
|
|
|
|
<div id="displform">
|
|
<button style="background-color: red; margin-bottom: 10px;" onclick="getSaltAndIv()">Get Example
|
|
Salt/IV</button>
|
|
<div id="salivdisp">
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<noscript>
|
|
<h1>PLEASE ENABLE JAVASCRIPT!!!</h1>
|
|
</noscript>
|
|
</body>
|
|
|
|
</html> |