113 lines
3.0 KiB
JavaScript
113 lines
3.0 KiB
JavaScript
const url = "https://task-api.fstropii.com";
|
|
const localhostUrl = "http://localhost:8000";
|
|
const signInBtn = document.getElementById("sign-in-submit-btn");
|
|
const tooltip = document.getElementById('tooltip');
|
|
|
|
signInBtn.addEventListener("click", function(e) {
|
|
e.preventDefault();
|
|
const username = document.querySelector('.sign-in-username-input').value;
|
|
const password = document.querySelector('.sign-in-password-input').value;
|
|
|
|
// validate the username and password. will return a promise
|
|
const signedInPromise = signIn(username, password);
|
|
signedInPromise.then((res) => res.json()).then((json) => validateUser(json))
|
|
});
|
|
|
|
const setTooltip = (type, message) => {
|
|
tooltip.classList.add(type);
|
|
tooltip.classList.add('visible');
|
|
tooltip.innerText = message
|
|
tooltip.style.display = "block";
|
|
}
|
|
|
|
const removeTooltip = () => {
|
|
tooltip.classList.remove('visible');
|
|
tooltip.style.display = "none";
|
|
}
|
|
|
|
const signIn = async (username, password) => {
|
|
const res = fetch(`${url}/user/login`, {
|
|
method: "POST",
|
|
body: JSON.stringify({
|
|
username: username,
|
|
password: password
|
|
}),
|
|
headers: {
|
|
"Content-type": "application/json"
|
|
}
|
|
});
|
|
|
|
return res;
|
|
};
|
|
|
|
const validateUser = async (parsedJson) => {
|
|
if (parsedJson.detail == "Login successful") {
|
|
setTooltip("success", "Login successful");
|
|
|
|
// get user token. will return a promise
|
|
const tokenPromise = getUserToken();
|
|
tokenPromise.then((res) => res.json()).then((json => {
|
|
const token = json.access_token;
|
|
const type = json.token_type;
|
|
const expiresInDays = json.expires_days;
|
|
|
|
// save a cookie
|
|
const cookieText = `token=${token},type=${type},expires_days=${expiresInDays}`;
|
|
setCookie(token, type, expiresInDays);
|
|
}));
|
|
} else if (parsedJson.detail == "Invalid password") {
|
|
setTooltip("error", "Invalid password");
|
|
} else if (parsedJson.detail == "User not found") {
|
|
setTooltip("error", "User not found");
|
|
}
|
|
}
|
|
|
|
const getUserToken = async () => {
|
|
const form = document.getElementById("sign-in-form");
|
|
const formData = new FormData(form);
|
|
|
|
const res = fetch(`${url}/token`, {
|
|
method: "POST",
|
|
body: formData,
|
|
});
|
|
|
|
return res;
|
|
}
|
|
|
|
const setCookie = (token, type, expires_days) => {
|
|
const d = new Date();
|
|
d.setTime(d.getTime() + (expires_days*24*60*60*1000))
|
|
let expires = `expires=${d.toUTCString()}`;
|
|
document.cookie = `token=${token},type=${type},${expires}`;
|
|
}
|
|
|
|
const getCookie = (returnType) => {
|
|
let decodedCookie = decodeURIComponent(document.cookie);
|
|
if (decodedCookie == "") {
|
|
return;
|
|
}
|
|
|
|
let ca = decodedCookie.split(',');
|
|
|
|
const token = ca[0].split("token=")[1];
|
|
const type = ca[1].split("type=")[1];
|
|
const expiresDay = ca[2].split("expires=")[1];
|
|
const expiresDate = ca[3]
|
|
const expires = `${expiresDay}${expiresDate}`
|
|
|
|
if (returnType == "token") {
|
|
return token;
|
|
} else if (returnType == "type") {
|
|
return type
|
|
} else if (returnType == "expires") {
|
|
return expires;
|
|
}
|
|
|
|
return null;
|
|
}
|
|
|
|
const token = getCookie("token");
|
|
|
|
if (token != undefined) {
|
|
window.location.href = '/';
|
|
} |