..
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85 | const welcomeSection = document.getElementById("welcome");
const loginSelectorSection = document.getElementById("loginSelector");
const localAccounts = localStorage.getItem("accounts");
const loginButton = document.getElementById("loginButton");
const currentLoggedInUser = sessionStorage.getItem("currentLoggedInUser");
if (localAccounts && !currentLoggedInUser) {
welcomeSection.style.display = "none";
loginSelectorSection.style.display = "block";
}
if (currentLoggedInUser) {
welcomeSection.style.display = "none";
loginSelectorSection.style.display = "none";
DELoader();
}
async function sha512(str) {
const buf = await crypto.subtle.digest(
"SHA-512",
new TextEncoder("utf-8").encode(str)
);
return Array.prototype.map
.call(new Uint8Array(buf), (x) => ("00" + x.toString(16)).slice(-2))
.join("");
}
loginButton.addEventListener("click", () => {
const fullName = document.getElementById("loginFullName").value;
const password = document.getElementById("loginPassword").value;
const loginError = document.getElementById("loginError");
if (!fullName || !password) {
loginError.innerHTML = "Please enter your credentials.";
} else {
const parsedAccounts = JSON.parse(localStorage.getItem("accounts"));
const accountIndex = parsedAccounts.findIndex(
(account) => account.fullName === fullName
);
if (accountIndex > -1) {
const account = parsedAccounts[accountIndex];
sha512(password).then((hashedPassword) => {
if (hashedPassword === account.password) {
loginSelectorSection.style.display = "none";
sessionStorage.setItem("currentLoggedInUser", fullName);
DELoader();
} else {
loginError.innerHTML = "The password entered is incorrect.";
}
});
} else {
loginError.innerHTML = "This user account does not exist.";
}
}
});
function DELoader() {
const loadingDesktopExperienceElement = document.getElementById(
"loadingDesktopExperience"
);
loadingDesktopExperienceElement.style.display = "block";
const meterLoaderElement = document.getElementById("meter-loader");
let width = 0;
function loadMeter() {
// if (width < 100) {
// if (100 - width < 10) {
// width = 100;
// } else {
// width += Math.round(Math.random() * 10);
// }
// meterLoaderElement.style.width = width + "%";
// } else {
loadingDesktopExperienceElement.style.display = "none";
document.getElementById('desktop').style.display = "block";
// }
}
(function loop() {
var rand = Math.round(Math.random() * 500);
setTimeout(function () {
loadMeter();
loop();
}, rand);
})();
}
|
|