website/js/customElements/pwgen.js
2022-03-25 10:38:01 +01:00

120 lines
No EOL
3.7 KiB
JavaScript

class PasswordGenerator extends HTMLElement {
constructor() {
super();
const outValue = document.createElement("input");
outValue.type = "text";
this.appendChild(outValue);
const lineBreak = document.createElement("br");
this.appendChild(lineBreak);
const pwlen = document.createElement("input");
pwlen.type = "range";
pwlen.min = "8";
pwlen.max = "128";
pwlen.value = "32";
this.appendChild(pwlen);
const pwlenSpan = document.createElement("span");
pwlenSpan.innerText = "32";
this.appendChild(pwlenSpan);
const lineBreak2 = document.createElement("br");
this.appendChild(lineBreak2);
const includeNum = document.createElement("input");
includeNum.type = "checkbox";
includeNum.checked = true;
this.appendChild(includeNum);
const includeNumText = document.createTextNode(" Zahlen");
this.appendChild(includeNumText);
const lineBreak3 = document.createElement("br");
this.appendChild(lineBreak3);
const includeBigChar = document.createElement("input");
includeBigChar.type = "checkbox";
includeBigChar.checked = true;
this.appendChild(includeBigChar);
const bigCharText = document.createTextNode(" Großbuchstaben");
this.appendChild(bigCharText);
const lineBreak4 = document.createElement("br");
this.appendChild(lineBreak4);
const includeSmallChar = document.createElement("input");
includeSmallChar.type = "checkbox";
includeSmallChar.checked = true;
this.appendChild(includeSmallChar);
const includeSmallCharText = document.createTextNode(" Kleinbuchstaben");
this.appendChild(includeSmallCharText);
const lineBreak5 = document.createElement("br");
this.appendChild(lineBreak5);
const includeSpecialChar = document.createElement("input");
includeSpecialChar.type = "checkbox";
includeSpecialChar.checked = true;
this.appendChild(includeSpecialChar);
const inclideSpecialCharText = document.createTextNode(" Sonderzeichen");
this.appendChild(inclideSpecialCharText);
const lineBreak6 = document.createElement("br");
this.appendChild(lineBreak6);
const button = document.createElement("button");
button.innerText = "Generieren";
this.appendChild(button);
pwlen.oninput = () => {
pwlenSpan.innerText = pwlen.value;
button.click();
}
includeNum.onchange = () => {
button.click();
}
includeBigChar.onchange = () => {
button.click();
}
includeSmallChar.onchange = () => {
button.click();
}
includeSpecialChar.onchange = () => {
button.click();
}
button.onclick = () => {
let possibleChar = "";
let password = "";
if(includeNum.checked) {
possibleChar += "1234567890";
}
if(includeBigChar.checked) {
possibleChar += "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
}
if(includeSmallChar.checked) {
possibleChar += "abcdefghijklmnopqrstuvwxyz";
}
if(includeSpecialChar.checked) {
possibleChar += ",;.:-_#'+*?=)(/&%$§\"!°{[]}<>|~"
}
for(let i = 0; i < pwlen.value; i++) {
password += possibleChar[Math.floor(Math.random() * possibleChar.length)];
}
outValue.value = password;
}
button.click();
}
}
customElements.define("jl-pwgen", PasswordGenerator)