A simple password manager created in HTML, CSS, and pure JavaScript.
- Create and save a password database
- Load an existing database
- View, add, and export passwords
- Click on the "Create Database" button to create a new password database
- Click on the "Load Database" button to load an existing database in JSON format
- Use the "Add" button to add new passwords to the database
- Use the "Export" button to export the password database in encrypted JSON format
function renderPasswords() {
var contentContainer = $("#content-container");
contentContainer.html("");
$.each(passwords, function(index, password) {
var passwordEntry = $("<div>").addClass("password-entry");
var passwordBox = $("<div>").addClass("password-box");
var nameInput = $("<input>").attr({
type: "text",
value: password.name,
readonly: true,
});
var passwordInput = $("<input>").attr({
type: "password",
value: password.password,
readonly: true,
});
var copyButton = $("<button>").text("Copy");
copyButton.click(function() {
copyToClipboard(password.password);
});
passwordBox.append(nameInput, passwordInput, copyButton);
passwordEntry.append(passwordBox);
contentContainer.append(passwordEntry);
});
// Add and export buttons
}
The renderPasswords
function iterates through the passwords
array and dynamically creates HTML elements to display each password entry. It creates input fields for the password name and password itself, along with a "Copy" button that allows users to copy the password to the clipboard.
function encrypt(content, password) {
var encryptedContent = CryptoJS.AES.encrypt(content, password).toString();
return encryptedContent;
}
The encrypt
function uses the CryptoJS library to encrypt content using the AES encryption algorithm with a given password. It then returns the encrypted content as a string.
function decrypt(content, password) {
try {
var decryptedContent = CryptoJS.AES.decrypt(content, password).toString(CryptoJS.enc.Utf8);
return decryptedContent;
} catch (error) {
return null;
}
}
The decrypt
function decrypts the encrypted content using the provided password. It catches any errors that may occur during the decryption process and returns null
if decryption fails.
For any questions or suggestions, please contact me at carlos.henrique.de.paula.oliveira@outlook.com.br.