elisabetta/cryptoseals
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

trying to fix the interface
All checks were successful
Deploy / trigger (push) Successful in 40s
Details

Browse Source
This commit is contained in:
elisabetta
2026-03-28 11:18:42 +01:00
parent 0e370eb457
commit d371b504f5
6 changed files with 90 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
backend/src/main/resources/get/cesare.html
View File

@@ -1,20 +1,24 @@
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<title>CryptoSeals - Cesare</title>
<link rel="stylesheet" href="style.css">
<script src="cesare.js" defer></script>
</head>
<body>
<nav class="navbar">
<a href="index.html" class="nav-brand">
<img src="logo.png" alt="🦭" onerror="this.style.display='none'; this.nextElementSibling.style.display='inline';">
<span style="display:none;">🦭</span> CryptoSeals
<img src="seal1.png" alt="🦭"onerror="this.style.display='none'; this.nextElementSibling.style.display='inline';">
<span style="display:none;"><img src="seal1.png" alt="🦭"></span> CryptoSeals
</a>
<ul class="nav-links">
<li><a href="rsa.html">Algoritmo RSA</a></li>
<li><a href="cesare.html" style="color: #3498db;">Cesare</a></li> <li><a href="vigenere.html">Vigenère</a></li>
<li><a href="cesare.html">Cesare</a></li>
<li><a href="vigenere.html">Vigenère</a></li>
<li><a href="storia.html">La Storia</a></li>
<li><a href="team.html">Il Team</a></li>
</ul>
@@ -22,56 +26,26 @@
<div class="container">
<h1>Cifrario di Cesare</h1>
<p class="descrizione">Sposta le lettere dell'alfabeto di un numero fisso di posizioni. Semplice, storico, ma efficace per messaggi veloci.</p>
<p class="descrizione">Sposta le lettere dell'alfabeto di un numero fisso di posizioni. Semplice, storico, ma
efficace per messaggi veloci.</p>
<div class="crypto-box">
<label>Chiave (Numero di spostamento):</label>
<input type="number" id="chiaveCesare" value="3" placeholder="Es. 3" style="width: 100%; padding: 12px; margin-top: 5px; margin-bottom: 15px; border-radius: 5px; border: 1px solid #ccc;">
<input type="number" id="key" value="3" placeholder="Es. 3"
style="width: 100%; padding: 12px; margin-top: 5px; margin-bottom: 15px; border-radius: 5px; border: 1px solid #ccc;">
<label>Testo in chiaro:</label>
<textarea id="testoInput" placeholder="Scrivi qui il messaggio da cifrare..."></textarea>
<button onclick="cifraCesare()">🔒 Cifra con Cesare</button>
<textarea id="plaintext" placeholder="Scrivi qui il messaggio da cifrare..."></textarea>
<button onclick="encrypt()">🔒 Cifra con Cesare</button>
<label style="display:block; margin-top: 25px;">Testo Cifrato:</label>
<textarea id="testoOutput" placeholder="Il risultato cifrato apparirà qui..."></textarea>
<button class="btn-green" onclick="decifraCesare()">🔓 Decifra in chiaro</button>
<textarea id="ciphertext" placeholder="Il risultato cifrato apparirà qui..."></textarea>
<button class="btn-green" onclick="decrypt()">🔓 Decifra in chiaro</button>
<label style="display:block; margin-top: 25px;">Risultato decifrato:</label>
<textarea id="testoDecifrato" readonly placeholder="Il messaggio originale tornerà qui..."></textarea>
</div>
</div>
<script>
async function cifraCesare() {
const input = document.getElementById("testoInput").value;
const chiave = document.getElementById("chiaveCesare").value;
if(!input) return alert("Inserisci del testo!");
try {
const risposta = await fetch("/seal/cesare/encrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
// Invia il testo e la CHIAVE (convertita in numero) al server
body: JSON.stringify({ testo: input, chiave: parseInt(chiave) })
});
document.getElementById("testoOutput").value = await risposta.text();
} catch (e) { alert("Errore di connessione con le API di Cesare!"); }
}
async function decifraCesare() {
const inputCifrato = document.getElementById("testoOutput").value;
const chiave = document.getElementById("chiaveCesare").value;
if(!inputCifrato) return alert("Nessun testo da decifrare!");
try {
const risposta = await fetch("/seal/cesare/decrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ testo: inputCifrato, chiave: parseInt(chiave) })
});
document.getElementById("testoDecifrato").value = await risposta.text();
} catch (e) { alert("Errore di connessione!"); }
}
</script>
</body>
</html>

30
backend/src/main/resources/get/cesare.js Normal file
View File

@@ -0,0 +1,30 @@
async function encrypt() {
const plaintext = document.getElementById("plaintext").value;
const key = document.getElementById("key").value;
if(!plaintext) return alert("Inserisci del testo!");
try {
const risposta = await fetch("/seal/cesare/encrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
// Invia il testo e la chiave (convertita in numero) al server
body: JSON.stringify({ plaintext: plaintext, key: parseInt(key) })
});
document.getElementById("ciphertext").value = await risposta.text();
} catch (e) { alert("Errore di connessione con le API di Cesare!"); }
}
async function decrypt() {
const ciphertext = document.getElementById("ciphertext").value;
const key = document.getElementById("key").value;
if(!ciphertext) return alert("Nessun testo da decifrare!");
try {
const res = await fetch("/seal/cesare/decrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ testo: ciphertext, chiave: parseInt(key) })
});
// TODO: SISTEMARE IL SISTEMA DI DECIFRATURA !!
document.getElementById("testoDecifrato").value = await res.text();
} catch (e) { alert("Errore di connessione!"); }
}

12
backend/src/main/resources/get/index.html
View File

@@ -6,12 +6,13 @@
<title>CryptoSeals - Home</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="style.css">
<script src="index.js" defer></script>
</head>
<body>
<nav class="navbar">
<a href="index.html" class="nav-brand">
<img src="seal1.png" height="50" alt="🦭" onerror="this.src='https://cdn-icons-png.flaticon.com/512/3063/3063126.png';">
<img src="seal1.png" height="50" alt="🦭">
CryptoSeals
</a>
<div class="menu-toggle" onclick="toggleMenu()">
@@ -45,14 +46,5 @@
© <span id="year"></span> CryptoSeals Team
</div>
</footer>
<script>
// Gestione Menu Mobile
function toggleMenu() {
document.getElementById("nav-links").classList.toggle("active");
}
// Anno dinamico Footer
document.getElementById("year").innerText = new Date().getFullYear();
</script>
</body>
</html>

6
backend/src/main/resources/get/index.js Normal file
View File

@@ -0,0 +1,6 @@
// Gestione Menu Mobile
function toggleMenu() {
document.getElementById("nav-links").classList.toggle("active");
}
// Anno dinamico Footer
document.getElementById("year").innerText = new Date().getFullYear();

37
backend/src/main/resources/get/rsa.html
View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8">
<title>CryptoSeals - RSA</title>
<link rel="stylesheet" href="style.css">
<script src="rsa.js" defer></script>
</head>
<body>
@@ -56,41 +57,5 @@
</div>
</div>
</div>
<script>
async function encrypt() {
const plaintext = document.getElementById("plaintext").value;
const size = document.getElementById("keysize").value;
if(!plaintext) return alert("Per favore, inserisci del testo da cifrare.");
document.getElementById("ciphertext").value = "Le foche stanno cifrando... Attendere prego.";
try {
// NOTA: Controlla che la rotta nel tuo Java sia corretta (/seal/rsa/encrypt o /api/rsa/cifra)
const res = await fetch("/seal/rsa/encrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: plaintext, keysize: parseInt(size) })
});
document.getElementById("ciphertext").value = await res.text();
} catch (e) { alert("Impossibile connettersi al server Javalin."); }
}
async function decrypt() {
const input = document.getElementById("ciphertext").value;
if(!input) return alert("Non c'è nessun testo da decifrare.");
document.getElementById("decodedtext").value = "Decifratura in corso...";
try {
// NOTA: Controlla che la rotta nel tuo Java sia corretta (/seal/rsa/decrypt o /api/rsa/decifra)
const res = await fetch("http://localhost:8080/seal/rsa/decrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: input })
});
document.getElementById("decodedtext").value = await res.text();
} catch (e) { alert("Impossibile connettersi al server."); }
}
</script>
</body>
</html>

32
backend/src/main/resources/get/rsa.js Normal file
View File

@@ -0,0 +1,32 @@
async function encrypt() {
const plaintext = document.getElementById("plaintext").value;
const size = document.getElementById("keysize").value;
if (!plaintext) return alert("Per favore, inserisci del testo da cifrare.");
document.getElementById("ciphertext").value = "Le foche stanno cifrando... Attendere prego.";
try {
const res = await fetch("/seal/rsa/encrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: plaintext, keysize: parseInt(size) })
});
document.getElementById("ciphertext").value = await res.text();
} catch (e) { alert("Impossibile connettersi al server Javalin."); }
}
async function decrypt() {
const input = document.getElementById("ciphertext").value;
if (!input) return alert("Non c'è nessun testo da decifrare.");
document.getElementById("decodedtext").value = "Decifratura in corso...";
try {
// NOTA: Controlla che la rotta nel tuo Java sia corretta (/seal/rsa/decrypt o /api/rsa/decifra)
const res = await fetch("http://localhost:8080/seal/rsa/decrypt", {
method: "POST", headers: { "Content-Type": "application/json" },
body: JSON.stringify({ text: input })
});
document.getElementById("decodedtext").value = await res.text();
} catch (e) { alert("Impossibile connettersi al server."); }
}