Skip to content

Commit c122f97

Browse files
authored
Add files via upload
1 parent 1304094 commit c122f97

File tree

3 files changed

+175
-0
lines changed

3 files changed

+175
-0
lines changed

index.html

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>EasyPGP</title>
5+
<link rel="stylesheet" href="styles.css">
6+
</head>
7+
<body>
8+
<h1>EasyPGP</h1>
9+
<div id="buttons">
10+
<button id="generate-key" class="active">Generate Key</button>
11+
<button id="encrypt">Encrypt</button>
12+
<button id="decrypt">Decrypt</button>
13+
</div>
14+
<div id="output">
15+
<h2 id="title">Key pair generated successfully.</h2>
16+
<textarea id="input-text" placeholder="Type your message here"></textarea>
17+
<textarea id="output-text" placeholder="Result"></textarea>
18+
<textarea id="private-key" placeholder="Insert your private key here"></textarea>
19+
<textarea id="public-key" placeholder="Insert recipient's public key here"></textarea>
20+
<input type="password" id="passphrase" placeholder="Enter your passphrase">
21+
</div>
22+
<script src="https://unpkg.com/[email protected]/dist/openpgp.min.js"></script>
23+
<script src="main.js"></script>
24+
</body>
25+
</html>

main.js

+96
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
var generateKeyButton = document.getElementById('generate-key');
2+
var encryptButton = document.getElementById('encrypt');
3+
var decryptButton = document.getElementById('decrypt');
4+
var title = document.getElementById('title');
5+
var privateKeyTextArea = document.getElementById('private-key');
6+
var publicKeyTextArea = document.getElementById('public-key');
7+
var passphraseInput = document.getElementById('passphrase');
8+
9+
function setActiveButton(button) {
10+
generateKeyButton.classList.remove('active');
11+
encryptButton.classList.remove('active');
12+
decryptButton.classList.remove('active');
13+
button.classList.add('active');
14+
}
15+
16+
function setStatusMessage(message) {
17+
title.innerText = message;
18+
}
19+
20+
function handleEncryption() {
21+
var publicKey = publicKeyTextArea.value;
22+
var plaintext = document.getElementById('input-text').value;
23+
var passphrase = passphraseInput.value;
24+
25+
var pgpOptions = {
26+
message: openpgp.message.fromText(plaintext),
27+
publicKeys: openpgp.key.readArmored(publicKey).keys
28+
};
29+
30+
openpgp.encrypt(pgpOptions).then(function(ciphertext) {
31+
var encryptedText = ciphertext.data;
32+
document.getElementById('output-text').value = encryptedText;
33+
setStatusMessage("Message encrypted successfully.");
34+
}).catch(function(error) {
35+
console.log(error);
36+
setStatusMessage("Error encrypting message.");
37+
});
38+
}
39+
40+
function handleDecryption() {
41+
var privateKey = privateKeyTextArea.value;
42+
var passphrase = passphraseInput.value;
43+
var encryptedText = document.getElementById('output-text').value;
44+
45+
var pgpOptions = {
46+
message: openpgp.message.readArmored(encryptedText),
47+
privateKey: openpgp.key.readArmored(privateKey).keys[0],
48+
passphrase: passphrase
49+
};
50+
51+
openpgp.decrypt(pgpOptions).then(function(plaintext) {
52+
var decryptedText = plaintext.data;
53+
document.getElementById('input-text').value = decryptedText;
54+
setStatusMessage("Message decrypted successfully.");
55+
}).catch(function(error) {
56+
console.log(error);
57+
setStatusMessage("Error decrypting message.");
58+
});
59+
}
60+
61+
generateKeyButton.addEventListener('click', function() {
62+
setActiveButton(generateKeyButton);
63+
setStatusMessage("Generating key pair, please wait...");
64+
65+
var pgpOptions = {
66+
userIds: [{ name: 'Your Name', email: '[email protected]' }],
67+
rsaBits: 2048,
68+
passphrase: passphraseInput.value
69+
};
70+
71+
openpgp.generateKey(pgpOptions).then(function(key) {
72+
var privKey = key.privateKeyArmored;
73+
var pubKey = key.publicKeyArmored;
74+
75+
privateKeyTextArea.value = privKey;
76+
publicKeyTextArea.value = pubKey;
77+
document.getElementById('output-text').value = "";
78+
document.getElementById('input-text').value = "";
79+
setStatusMessage("Key pair generated successfully.");
80+
}).catch(function(error) {
81+
console.log(error);
82+
setStatusMessage("Error generating key pair.");
83+
});
84+
});
85+
86+
encryptButton.addEventListener('click', function() {
87+
setActiveButton(encryptButton);
88+
setStatusMessage("Encrypting message. Please wait...");
89+
handleEncryption();
90+
});
91+
92+
decryptButton.addEventListener('click', function() {
93+
setActiveButton(decryptButton);
94+
setStatusMessage("Decrypting message. Please wait...");
95+
handleDecryption();
96+
});

styles.css

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
body {
2+
font-family: Arial, sans-serif;
3+
background-color: #F7F9FA;
4+
}
5+
6+
h1, h2 {
7+
text-align: center;
8+
margin-top: 50px;
9+
}
10+
11+
#buttons {
12+
display: flex;
13+
justify-content: center;
14+
margin-top: 30px;
15+
}
16+
17+
button {
18+
padding: 10px 20px;
19+
font-size: 16px;
20+
margin: 10px;
21+
background-color: #3B86FF;
22+
color: #FFFFFF;
23+
border-radius: 5px;
24+
border: none;
25+
cursor: pointer;
26+
}
27+
28+
button.active {
29+
background-color: #2A69CC;
30+
}
31+
32+
#output {
33+
display: flex;
34+
flex-direction: column;
35+
align-items: center;
36+
margin-top: 30px;
37+
}
38+
39+
textarea {
40+
width: 400px;
41+
height: 120px;
42+
margin-bottom: 10px;
43+
border-radius: 5px;
44+
border: solid 1px #B9BEC5;
45+
padding: 10px;
46+
}
47+
48+
input[type="password"] {
49+
width: 400px;
50+
margin-bottom: 10px;
51+
border-radius: 5px;
52+
border: solid 1px #B9BEC5;
53+
padding: 10px;
54+
}

0 commit comments

Comments
 (0)