Skip to content

Commit 5d3df9d

Browse files
mytherapy-codingmytherapy-coding
committed
feat: rebuild and polish full script.js with working password and user ID generators, words-mode, persistence, and reset functionality
1 parent 0804d09 commit 5d3df9d

3 files changed

Lines changed: 442 additions & 657 deletions

File tree

‎index.html‎

Lines changed: 117 additions & 155 deletions
Original file line numberDiff line numberDiff line change
@@ -10,183 +10,145 @@
1010
<body>
1111
<div class="container">
1212

13-
<!-- Top credit -->
14-
<span class="top-credit">Made by Alena • 2026</span>
15-
16-
<!-- Title -->
17-
<h1>Password & User ID Generator</h1>
18-
19-
<!-- Settings restored notice -->
20-
<p id="restoreNotice" style="color:#0ea5e9; font-size:14px; margin-bottom:10px;"></p>
21-
22-
<!-- Tabs -->
2313
<div class="tabs">
24-
<button class="tab active" data-tab="passwordTab">Password</button>
25-
<button class="tab" data-tab="userIdTab">User ID</button>
14+
<div class="tab active" data-tab="passwordTab">Password</div>
15+
<div class="tab" data-tab="userIdTab">User ID</div>
2616
</div>
2717

28-
<!-- PASSWORD GENERATOR TAB -->
18+
<!-- PASSWORD TAB -->
2919
<div id="passwordTab" class="tab-content active">
20+
<h2>Password Generator</h2>
3021

31-
<label>
32-
Password length:
33-
<input type="number" id="length" min="4" max="64" value="16" />
22+
<label>Password Length:
23+
<input type="number" id="length" min="4" max="64" value="12" />
3424
</label>
3525
<div id="lengthError" class="error"></div>
3626

37-
<div class="checkboxes">
38-
<label><input type="checkbox" id="lowercase" checked /> Lowercase</label>
39-
<label><input type="checkbox" id="uppercase" checked /> Uppercase</label>
40-
<label><input type="checkbox" id="digits" checked /> Numbers</label>
41-
<label><input type="checkbox" id="symbols" /> Symbols</label>
42-
</div>
27+
<label><input type="checkbox" id="lowercase" checked /> Lowercase</label>
28+
<label><input type="checkbox" id="uppercase" checked /> Uppercase</label>
29+
<label><input type="checkbox" id="digits" checked /> Digits</label>
30+
<label><input type="checkbox" id="symbols" /> Symbols</label>
4331

44-
<label>
45-
Custom symbols:
32+
<label>Custom Symbols:
4633
<input type="text" id="customSymbols" placeholder="!@#$%^&*" />
4734
</label>
4835
<div id="symbolError" class="error"></div>
4936

50-
<label>
51-
<input type="checkbox" id="icloudPreset" />
52-
iCloud-style preset
53-
</label>
37+
<label><input type="checkbox" id="icloudPreset" /> iCloud‑style preset</label>
5438
<div id="presetInfo" class="info"></div>
5539

56-
<!-- Password output -->
57-
<div class="password-row">
58-
<input type="text" id="password" readonly />
59-
<button id="copy">Copy</button>
60-
</div>
61-
<div id="copyError" class="error"></div>
62-
63-
<!-- Strength -->
64-
<div id="strengthLabel"></div>
65-
<div id="strengthBar"></div>
66-
67-
<!-- Buttons -->
6840
<button id="generate">Generate</button>
6941
<button id="clear">Clear</button>
7042

71-
<!-- Reset settings -->
72-
<button id="resetPasswordSettings" style="margin-top:12px; background:#64748b;">
73-
Reset Settings
74-
</button>
75-
</div>
76-
77-
<!-- USER ID GENERATOR TAB -->
78-
<!-- USER ID GENERATOR TAB -->
79-
<div id="userIdTab" class="tab-content">
80-
81-
<div class="userid-section">
82-
<h2>User ID Generator</h2>
83-
84-
<!-- Mode selector -->
85-
<label>
86-
Mode:
87-
<select id="uidMode">
88-
<option value="cvc">CVC (pronounceable)</option>
89-
<option value="words">Words (adjective + noun)</option>
90-
</select>
91-
</label>
92-
93-
<!-- CVC MODE CONTROLS -->
94-
<div id="uidCvcControls">
95-
<label>
96-
Syllables:
97-
<select id="uidSyllables">
98-
<option value="2">2</option>
99-
<option value="3">3</option>
100-
</select>
101-
</label>
102-
103-
<label>
104-
<input type="checkbox" id="uidAddDigits" checked />
105-
Add digits
106-
</label>
107-
108-
<label>
109-
Digit count:
110-
<select id="uidDigitsCount">
111-
<option value="2">2</option>
112-
<option value="3">3</option>
113-
</select>
114-
</label>
115-
116-
<label>
117-
<input type="checkbox" id="uidAddSuffix" checked />
118-
Add suffix
119-
</label>
43+
<input type="text" id="password" readonly />
44+
<button id="copy">Copy</button>
45+
<div id="copyError" class="error"></div>
12046

121-
<label>
122-
Suffix:
123-
<input type="text" id="uidSuffix" value="dev" />
124-
</label>
47+
<div id="strengthLabel"></div>
48+
<div id="strengthBar"></div>
12549

126-
<label>
127-
Max length:
128-
<input type="number" id="uidMaxLength" min="6" max="24" value="15" />
129-
</label>
50+
<div id="restoreNotice"></div>
13051
</div>
13152

132-
<!-- WORDS MODE CONTROLS -->
133-
<div id="uidWordsControls" style="display:none;">
134-
<label>
135-
Words count:
136-
<select id="uidWordsCount">
137-
<option value="2">2 (adj + noun)</option>
138-
<option value="3">3 (adj + adj + noun)</option>
139-
</select>
140-
</label>
141-
142-
<label>
143-
Separator:
144-
<select id="uidWordsSeparator">
145-
<option value="_">_ (underscore)</option>
146-
<option value=".">. (dot)</option>
147-
<option value="-">- (dash)</option>
148-
<option value="none">none</option>
149-
</select>
150-
</label>
151-
152-
<label>
153-
<input type="checkbox" id="uidWordsAddDigits" />
154-
Add digits
155-
</label>
156-
157-
<label>
158-
Digits count:
159-
<select id="uidWordsDigitsCount">
160-
<option value="2">2</option>
161-
<option value="3">3</option>
162-
</select>
163-
</label>
164-
165-
<label>
166-
Max length:
167-
<input type="number" id="uidWordsMaxLength" min="8" max="30" value="20" />
168-
</label>
53+
<!-- USER ID TAB -->
54+
<div id="userIdTab" class="tab-content">
55+
56+
<div class="userid-section">
57+
<h2>User ID Generator</h2>
58+
59+
<!-- Mode selector -->
60+
<label>
61+
Mode:
62+
<select id="uidMode">
63+
<option value="cvc">CVC (pronounceable)</option>
64+
<option value="words">Words (adjective + noun)</option>
65+
</select>
66+
</label>
67+
68+
<!-- CVC MODE CONTROLS -->
69+
<div id="uidCvcControls">
70+
<label>Syllables:
71+
<select id="uidSyllables">
72+
<option value="2">2</option>
73+
<option value="3">3</option>
74+
</select>
75+
</label>
76+
77+
<label><input type="checkbox" id="uidAddDigits" checked /> Add digits</label>
78+
79+
<label>Digit count:
80+
<select id="uidDigitsCount">
81+
<option value="2">2</option>
82+
<option value="3">3</option>
83+
</select>
84+
</label>
85+
86+
<label><input type="checkbox" id="uidAddSuffix" checked /> Add suffix</label>
87+
88+
<label>Suffix:
89+
<input type="text" id="uidSuffix" value="dev" />
90+
</label>
91+
92+
<label>Max length:
93+
<input type="number" id="uidMaxLength" min="6" max="24" value="15" />
94+
</label>
95+
</div>
96+
97+
<!-- WORDS MODE CONTROLS -->
98+
<div id="uidWordsControls" style="display:none;">
99+
<label>Words count:
100+
<select id="uidWordsCount">
101+
<option value="2">2 (adj + noun)</option>
102+
<option value="3">3 (adj + adj + noun)</option>
103+
</select>
104+
</label>
105+
106+
<label>Separator:
107+
<select id="uidWordsSeparator">
108+
<option value="_">_</option>
109+
<option value=".">.</option>
110+
<option value="-">-</option>
111+
<option value="none">none</option>
112+
</select>
113+
</label>
114+
115+
<label><input type="checkbox" id="uidWordsAddDigits" /> Add digits</label>
116+
117+
<label>Digits count:
118+
<select id="uidWordsDigitsCount">
119+
<option value="2">2</option>
120+
<option value="3">3</option>
121+
</select>
122+
</label>
123+
124+
<label>Max length:
125+
<input type="number" id="uidWordsMaxLength" min="8" max="30" value="20" />
126+
</label>
127+
</div>
128+
129+
<!-- Shared -->
130+
<label>Generate count:
131+
<select id="uidCount">
132+
<option value="5">5</option>
133+
<option value="10" selected>10</option>
134+
<option value="20">20</option>
135+
</select>
136+
</label>
137+
138+
<div id="uidError" class="error"></div>
139+
140+
<button id="uidGenerateBtn">Generate User IDs</button>
141+
142+
<button id="resetUserIdSettings" style="margin-top:12px; background:#64748b;">
143+
Reset Settings
144+
</button>
145+
146+
<div id="uidResults"></div>
147+
</div>
169148
</div>
170149

171-
<!-- Shared controls -->
172-
<label>
173-
Generate count:
174-
<select id="uidCount">
175-
<option value="5">5</option>
176-
<option value="10" selected>10</option>
177-
<option value="20">20</option>
178-
</select>
179-
</label>
180-
181-
<div id="uidError" class="error"></div>
182-
183-
<button id="uidGenerateBtn">Generate User IDs</button>
184-
185-
<!-- Reset settings -->
186-
<button id="resetUserIdSettings" style="margin-top:12px; background:#64748b;">
187-
Reset Settings
188-
</button>
189-
190-
<div id="uidResults"></div>
191150
</div>
192-
</div>
151+
152+
<script src="script.js"></script>
153+
</body>
154+
</html>

0 commit comments

Comments
 (0)