var generateBtn = document.querySelector("#generate");
// put our characters into seperate arrays
const uppercaseLetters = ['A', 'B', 'C', 'D', "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "X", "Y", 'Z']
const lowercaseLetters = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"]
const numeric = ["0", "1", "3", "4", "5", "6", "7", "8", "9"]
const specialCharacters = ["+", "-", "&&", "||", "!", "(", ")", "{", "}", "[", "]", "^",
"~", "*", "?", ":",
]
//create an empty password array and empty generatedPassword string
let passwordArry = [];
let generatedPassword = '';
//create variables for included types
//write a function to generate the password
function writePassword() {
//prompt to the user how many characters they want
let passwordLength = window.prompt(`How many characters? enter between 8 & 128`);
//if user doesnt enter a password or the input is nan
while (!passwordLength || isNaN(passwordLength)) {
window.alert(`this field cannot be empty & has to be an integer`);
passwordLength = window.prompt(`How many characters? enter between 8 & 128`);
}
//if password length is les than 8 or more than 128, reprompt
if (passwordLength < 8 || passwordLength > 128) {
window.alert(`Password must be between 8 & 128 characters`);
passwordLength = window.prompt(`How many characters? enter between 8 & 128`);
}
let includeUppercase;
let includeLowercase;
let includeNumeric;
let includeSpecialCharacter
//alert the user to input on every prompt
while (!includeNumeric && !includeSpecialCharacter && !includeLowercase && !includeUppercase) {
alert("check all")
includeNumeric = prompt("Should include numeric character, enter yes or no").toLowerCase()
includeSpecialCharacter = prompt("Should include special character,enter yes or no").toLowerCase()
includeLowercase = prompt("Should include lowercase character,enter yes or no").toLowerCase()
includeUppercase = prompt("Should include uppercase character,enter yes or no").toLowerCase()
}
//if user selects to include any of these characters by entering yes then we will put those characters into an array, if the users enter anything else then the program will do nothing and go to the next prompt
if (includeNumeric === "yes") {
passwordArry = passwordArry.concat(numeric)
}
if (includeLowercase === "yes") {
passwordArry = passwordArry.concat(lowercaseLetters)
}
if (includeUppercase === "yes") {
passwordArry = passwordArry.concat(uppercaseLetters)
}
if (includeSpecialCharacter === "yes") {
passwordArry = passwordArry.concat(specialCharacters)
}
// now that we have added the types to the password array, we now loop through the array to grab random characters
// generates a random password from the entered password length
for (let i = 0; i < passwordLength; i++) {
//create a variable to hold the random number , we multiply the random number by the length of the whole password array
const randomLength = Math.floor(Math.random() * passwordArry.length)
//the random length is a number and we use that number for the index of the password array
generatedPassword = generatedPassword + passwordArry[randomLength];
let passwordText = document.querySelector("#password");
passwordText.value = generatedPassword;
}
}
generateBtn.addEventListener('click', writePassword);
<div class="wrapper">
<header>
<h1>Password Generator</h1>
</header>
<div class="card">
<div class="card-header">
<h2>Generate a Password</h2>
</div>
<div class="card-body">
<textarea readonly id="password" placeholder="Your Secure Password" aria-label="Generated Password"></textarea>
</div>
<div class="dojo">
</div>
<div class="card-footer">
<button id="generate" class="btn">Generate Password</button>
</div>
</div>
</div>
I tried to set passwordText.value to and empty string at he beginning of the write password function but that would not work because passwordText.value is not defined until the end of the function. I also tried to create a function called PlayAgain to run the writePassword function again if the user chooses to and set the text value to an empty string but that didnt work either
Aucun commentaire:
Enregistrer un commentaire