Skip to content

Commit ea8ea3e

Browse files
daironreijnadaironreijna
committed
doc created for psuedocoding, initial prompt and confirm added to script.js, readme & licence updated
1 parent 568cab6 commit ea8ea3e

File tree

4 files changed

+160
-139
lines changed

4 files changed

+160
-139
lines changed

‎LICENSE

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ Copyright (c) 2023 Dairon Reijna
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
66

7-
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
7+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
88

99
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

‎README.md

+31
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,37 @@ I aim to develop websites that are built mobile first, with accessibility in pri
9999

100100
## Resources
101101

102+
[Pawel Krawczyk (n.d.) Password Special Characters. The OWASP® Foundation](https://owasp.org/www-community/password-special-characters)
103+
104+
[MDN Web Docs on array instance methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array#Instance_methods)
105+
106+
[MDN Web Docs on string instance methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String#Instance_methods)
107+
108+
[Joel Olawanle (n.d.) Guide to JavaScript's filter() Method ]( https://stackabuse.com/guide-to-javascripts-filter-method/)
109+
110+
[w3schools (n.d.) JavaScript Hoisting](https://www.w3schools.com/js/js_hoisting.asp)
111+
112+
[W3Schools (n.d.) JavaScript Object Methods](https://www.w3schools.com/js/js_object_methods.asp)
113+
114+
[W3Schools (n.d.) JavaScript For .. In - Loop](https://www.w3schools.com/js/js_loop_forin.asp)
115+
116+
[Stack Overflow (n.d.) How to iterate over a JavaScript object?](https://stackoverflow.com/questions/14379274/how-to-iterate-over-a-javascript-object)
117+
118+
[Stack Overflow (n.d.) Why is using "for...in" for array iteration a bad idea?](https://stackoverflow.com/questions/500504/why-is-using-for-in-for-array-iteration-a-bad-idea)
119+
120+
[MDN Web_docs (n.d.) The for...in statement](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in)
121+
122+
[Shahed Nasser (2022) How to Use the for Loop in JavaScript](https://www.sitepoint.com/javascript-for-loop/)
123+
124+
[Jessica Wilkins ( 2021) Learn JavaScript – Free JS Courses for Beginners. freeCodeCamp](https://www.freecodecamp.org/news/learn-javascript-free-js-courses-for-beginners/ "#JAVASCRIPT")
125+
126+
[W3schools (n.d.) JavaScript Functions](https://www.w3schools.com/js/js_functions.asp)
127+
128+
[W3schools (n.d.) JavaScript Scope](https://www.w3schools.com/js/js_scope.asp)
129+
130+
[W3schools (n.d.) Object Methods](https://www.w3schools.com/js/js_object_methods.asp)
131+
132+
[MDN Wed Docs (n.d.) Window: prompt() method](https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt)
102133

103134
## License
104135

‎assets/Psuedocode Excercise 24 Aug 23.txt

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
# User view
2+
============================================================
3+
4+
User will visit website and will see a container/card with a heading, a prompt, and a button to generate a password.
5+
The user will click the generate a password button.
6+
7+
How long due you want the password to be?
8+
9+
Do you want capital letters in the password?
10+
Do you want numbers to be generated in the password?
11+
12+
Would you like special characters in the password?
13+
14+
Alert - The user will receive an output from the webpage with a password that has been generated.
15+
16+
(Important to take the time to consider how the website will work from three perspectives. For this section, the output from this round would be a wireframe of the website to be built, with relevant elements incorporated)
17+
18+
# What developer has to do
19+
============================================
20+
21+
Make button clickable.
22+
23+
A prompt that will request for password length.
24+
Check to make sure appropriate number (value and type) has been entered by user.
25+
26+
second 'confirm' to request - if characters should include capitalisation.
27+
if true then yes added within generated password.
28+
if false then none added
29+
30+
3rd 'confirm' to request - if user wants characters to include numbers.
31+
if true then yes added within generated password.
32+
if false then none added
33+
34+
4th and last 'confirm' to ask user if they would like special characters within the generated password.
35+
if true then yes added within generated password.
36+
if false then none added
37+
38+
An alert provides the user with the generated password.
39+
40+
(Options are prompt - alert or confirm.)
41+
42+
43+
# Tools to accomplish above tasks.
44+
=========================================
45+
46+
1. generate password button should call a function
47+
2. Prompt to request password length
48+
3. Confirm for user to decide inclusion of capital letters
49+
Add to potential characters that can be choosed from.
50+
4. Confirm for user to decide inclusion of numbers
51+
Add to potential characters that can be choosed from.
52+
5. Confirm for user to decide inclusion of special characters
53+
Add to potential characters that can be choosed from.
54+
6. Ensure that Code validates each user input.
55+
56+
7. Alert to user
57+
58+
8. create an array that will allow the relevant function/code to call from, and pull potentialCharacters for the generatedPassword.
59+
so atleast I need one array
60+
9. using a for loop to iterate over the new array, in order to generate the new password.
61+
62+
Code will need something to randomly choose from the choices available.
63+
64+
Return math.ceil(Math.random() * userInput)
65+
66+
And use this to iterate over the array.index to get the characters you need.
67+
68+
69+

‎assets/script/script.js

+59-138
Original file line numberDiff line numberDiff line change
@@ -1,176 +1,95 @@
1-
// User view
2-
/*
3-
User will visit website and will see a container/card with a heading, a prompt, and a button to generate a password.
4-
The user will click the generate a password button.
1+
// start with clearing the console.
2+
// =======================================================================================
3+
console.clear()
54

6-
How long due you want the password to be?
75

8-
Do you want capital letters in the password?
9-
Do you want numbers to be generated in the password?
10-
11-
Would you like special characters in the password?
12-
13-
Alert - The user will receive an output from the webpage with a password that has been generated.
14-
15-
(the output from this round would be a wireframe of the website to be built, with relevant elements incorporated)
16-
17-
18-
// What developer has to do
19-
// ============================================
6+
// Array of special characters to be included in password
7+
// =======================================================================================
8+
const specialCharacters = [
9+
'@', '%', '+', '\\', '/', "'", '!', '#', '$', '^',
10+
'?', ':', ',', ')', '(', '}', '{', ']', '[', '~',
11+
'-', '_', '.'
12+
];
2013

21-
Make button clickable.
14+
// Array of numeric characters to be included in password
15+
// =======================================================================================
16+
const numericCharacters = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
2217

23-
A prompt that will request for password length.
24-
Check to make sure appropriate number (value and type) has been entered by user.
18+
// Array of lowercase characters to be included in password
19+
// =======================================================================================
20+
const lowerCasedCharacters = [
21+
'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l',
22+
'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x',
23+
'y', 'z'
24+
];
2525

26-
second 'confirm' to request - if characters should include capitalisation.
27-
if true then yes added within generated password.
28-
if false then none added
26+
// Array of uppercase characters to be included in password
27+
// =======================================================================================
28+
let upperCasedCharacters = [
29+
'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L',
30+
'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X',
31+
'Y', 'Z'
32+
];
2933

30-
3rd 'confirm' to request - if user wants characters to include numbers.
31-
if true then yes added within generated password.
32-
if false then none added
34+
// Setup of variable containers
3335

34-
4th and last 'confirm' to ask user if they would like special characters within the generated password.
35-
if true then yes added within generated password.
36-
if false then none added
36+
const passwordMinimumLength = 13; // passwords will always be 13 if user inputs a wrong character.
37+
let passwordLengthUserInput;
38+
let passwordCapitalLetters;
39+
let passwordNumbers;
40+
let passwordSpecialCharacters;
3741

38-
An alert provides the user with the generated password.
42+
// Function to prompt user for password options
43+
// =======================================================================================
3944

40-
(Options are prompt - alert or confirm.)
45+
passwordLength = prompt(`Let's set the password length \n\n Choose a number between 8 and 128 \n `);
4146

47+
console.log(passwordLength);
4248

43-
// tools to accomplish above tasks.
44-
// =========================================
45-
1. generate password button should call a function
46-
2. Prompt to request password length
47-
3. Confirm for user to decide inclusion of capital letters
48-
Add to potential characters that can be choosed from.
49-
4. Confirm for user to decide inclusion of numbers
50-
Add to potential characters that can be choosed from.
51-
5. Confirm for user to decide inclusion of special characters
52-
Add to potential characters that can be choosed from.
53-
6. Alert to user
49+
passwordCapitalLetters = confirm(`Now, please indicate if you want capital letters to be included: \n 'OK' = Yes, select 'Cancel' for No
50+
`);
5451

55-
7. create an array that will allow the relevant function/code to call from, and pull potentialCharacters for the generatedPassword.
56-
so atleast I need one array
57-
8. using a for loop to iterate over the new array, in order to generate the new password.
52+
console.log(passwordCapitalLetters);
5853

59-
Return math.ceil(Math.random() * userInput)
54+
passwordNumbers = confirm(`Now, please indicate if you want numbers to be included: \n 'OK' = Yes, select 'Cancel' for No
55+
`);
6056

61-
And use this to iterate over the array.index to get the characters you need.
57+
console.log(passwordNumbers)
6258

63-
*/
59+
passwordSpecialCharacters = confirm(`Now, please indicate if you want special characters to be included: \n 'OK' = Yes, select 'Cancel' for No
60+
`);
6461

65-
// Array of special characters to be included in password
66-
var specialCharacters = [
67-
'@',
68-
'%',
69-
'+',
70-
'\\',
71-
'/',
72-
"'",
73-
'!',
74-
'#',
75-
'$',
76-
'^',
77-
'?',
78-
':',
79-
',',
80-
')',
81-
'(',
82-
'}',
83-
'{',
84-
']',
85-
'[',
86-
'~',
87-
'-',
88-
'_',
89-
'.'
90-
];
62+
console.log(passwordSpecialCharacters)
9163

92-
// Array of numeric characters to be included in password
93-
var numericCharacters = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
94-
95-
// Array of lowercase characters to be included in password
96-
var lowerCasedCharacters = [
97-
'a',
98-
'b',
99-
'c',
100-
'd',
101-
'e',
102-
'f',
103-
'g',
104-
'h',
105-
'i',
106-
'j',
107-
'k',
108-
'l',
109-
'm',
110-
'n',
111-
'o',
112-
'p',
113-
'q',
114-
'r',
115-
's',
116-
't',
117-
'u',
118-
'v',
119-
'w',
120-
'x',
121-
'y',
122-
'z'
123-
];
124-
125-
// Array of uppercase characters to be included in password
126-
var upperCasedCharacters = [
127-
'A',
128-
'B',
129-
'C',
130-
'D',
131-
'E',
132-
'F',
133-
'G',
134-
'H',
135-
'I',
136-
'J',
137-
'K',
138-
'L',
139-
'M',
140-
'N',
141-
'O',
142-
'P',
143-
'Q',
144-
'R',
145-
'S',
146-
'T',
147-
'U',
148-
'V',
149-
'W',
150-
'X',
151-
'Y',
152-
'Z'
153-
];
154-
155-
// Function to prompt user for password options
15664
function getPasswordOptions() {
15765

15866
}
15967

16068
// Function for getting a random element from an array
69+
// =======================================================================================
70+
71+
16172
function getRandom(arr) {
16273

16374
}
16475

16576
// Function to generate password with user input
77+
// =======================================================================================
78+
79+
alert(`Your password has been generated \n \n ${generatePassword}`) // not sure this is correct.
80+
16681
function generatePassword() {
16782

16883
}
16984

17085
// Get references to the #generate element
86+
// =======================================================================================
87+
17188
var generateBtn = document.querySelector('#generate');
17289

17390
// Write password to the #password input
91+
// =======================================================================================
92+
17493
function writePassword() {
17594
var password = generatePassword();
17695
var passwordText = document.querySelector('#password');
@@ -179,4 +98,6 @@ function writePassword() {
17998
}
18099

181100
// Add event listener to generate button
101+
// =======================================================================================
102+
182103
generateBtn.addEventListener('click', writePassword);

0 commit comments

Comments
 (0)