Conservancy/reimbursinator
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #16 from danieldupriest/LogoutScript

Browse source 
Add logout script to dashboard.html and fix formatting
This commit is contained in:
sliang17 2019-01-17 17:06:05 -08:00 committed by GitHub
commit ebc886db0d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 70 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
front/static/dashboard.html
View file

@ -1,6 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, width=device-width" /> <meta name="viewport" content="initial-scale=1, width=device-width" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"/> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous"/>
@ -8,10 +8,12 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<title>Reimbursinator</title> <title>Reimbursinator</title>
<link rel="shortcut icon" href="/favicon.ico" /> <link rel="shortcut icon" href="/favicon.ico" />
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<div class="jumbotron"><h1>Reimbursinator Report</h1></div> <div class="jumbotron">
<h1>Reimbursinator Report</h1>
</div>
<nav class="navbar"> <nav class="navbar">
<ul class="nav nav-tabs mr-auto"> <ul class="nav nav-tabs mr-auto">
<li class="nav-item"> <li class="nav-item">
@ -29,10 +31,11 @@
</ul> </ul>
<ul class="nav justify-content-end"> <ul class="nav justify-content-end">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="#">Logout</a> <a id="logoutLink" class="nav-link" href="#">Logout</a>
</li> </li>
</ul> </ul>
</nav> </nav>
</div> </div>
</body> <script src="logout.js"></script>
</body>
</html> </html>

33
front/static/logout.js Normal file
View file

@ -0,0 +1,33 @@
function postToLogoutEndpoint(event) {
event.preventDefault();
const token = localStorage.getItem("token");
const url = "https://reqres.in/api/logout" // mock api service
const xhr = new XMLHttpRequest();
xhr.open("POST", url, true);
xhr.setRequestHeader("Authorization", `Token ${token}`);
xhr.onreadystatechange = function() {
if (this.readyState === 4) {
if (this.status === 200) {
console.log("LOGOUT SUCCESS!");
console.log(`Server response:\n${this.response}`);
localStorage.removeItem("token");
window.location.replace("index.html");
} else {
console.log("LOGOUT FAILURE!");
console.log(`Server status: ${this.status}`);
console.log(`Server response:\n${this.response}`);
}
}
};
xhr.onerror = function() {
alert("Error connecting to authentication server!");
};
xhr.send();
}
const logoutLink = document.querySelector("#logoutLink");
logoutLink.addEventListener("click", postToLogoutEndpoint);