Added dashboard

This commit is contained in:
Tracker-Friendly 2024-04-02 18:31:06 +01:00
parent d6cdfa022b
commit de337283b5
8 changed files with 163 additions and 101 deletions

8
main
View File

@ -579,14 +579,14 @@ async def signup():
async def logout(): async def logout():
return await render_template("logout.html") return await render_template("logout.html")
@app.route("/homeserver")
async def homeserver():
return await render_template("homeserver.html")
@app.route("/app") @app.route("/app")
async def mainapp(): async def mainapp():
return await render_template("main.html") return await render_template("main.html")
@app.route("/dashboard")
async def dashboard():
return await render_template("dashboard.html")
@app.route("/.well-known/openid-configuration") @app.route("/.well-known/openid-configuration")
async def openid(): async def openid():
return await render_template("openid.json") return await render_template("openid.json")

61
static/css/dashboard.css Normal file
View File

@ -0,0 +1,61 @@
body {
font-family: Arial, sans-serif;
text-align: center;
overflow-wrap: anywhere;
}
.newoauth, .oauthlist, .oauthentry {
width: calc(100% - 17.5vh);
margin-top: 7vh;
margin-left: 7vh;
margin-right: 7vh;
padding: 15px 10px 30px;
border-style: solid;
border-image: none;
border-radius: 8px;
border-width: 1px;
font-size: 17px;
background-color: rgb(235, 255, 235);
}
.oauthentry {
display: flex;
flex-direction: column;
justify-content: center;
padding: 5px;
background-color: lightcyan;
}
.oauthentry button {
padding: 10px;
background-color: red;
color: white
}
.oauthentry button:hover {
background-color: black;
}
button {
border: 1px solid black;
padding: 3px;
border-radius: 5px;
background-color: lightcyan;
transition: all 0.3s ease 0s;
}
button:hover {
background-color: white;
}
h {
display: block;
margin-top: 20px;
font-size: 20px;
}
input {
padding: 3px;
border-radius: 5px;
border: black solid 1px;
}

79
static/js/dashboard.js Normal file
View File

@ -0,0 +1,79 @@
function attempt() {
if (document.getElementById("appidbox").value.match(/^[A-Za-z]+$/)) {
fetch("https://auth.hectabit.org/api/newauth", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
appId: document.getElementById("appidbox").value,
secretKey: localStorage.getItem("DONOTSHARE-secretkey")
})
})
.then(response => {
async function doStuff() {
let code = await response.json()
if (response.status == 200) {
document.getElementById("status").innerText = "Your key is: " + code["key"] + ". This will only be shown once!"
getauths();
} else if (response.status == 500) {
document.getElementById("status").innerText = "Whoops... Something went wrong. Please try again later. (Error Code 500)"
} else if (response.status == 401) {
document.getElementById("status").innerText = "AppID already taken. (Error Code 401)"
} else {
document.getElementById("status").innerText = "Unkown error encountered. (Error Code " + response.status + ")"
}
}
doStuff()
})
}
}
function getauths() {
fetch("https://auth.hectabit.org/api/listauth", {
method: "POST",
body: JSON.stringify({
secretKey: localStorage.getItem("DONOTSHARE-secretkey")
}),
headers: {
"Content-Type": "application/json; charset=UTF-8"
}
})
.then((response) => {
async function doStuff() {
let responseData = await response.json()
document.querySelectorAll(".oauthentry").forEach((el) => el.remove());
for (let i in responseData) {
let oauthElement = document.createElement("div")
let oauthText = document.createElement("p")
let oauthRemoveButton = document.createElement("button")
oauthText.innerText = "Client ID: " + responseData[i]["appId"]
oauthRemoveButton.innerText = "Delete Permanently"
oauthRemoveButton.addEventListener("click", (event) => {
if (window.confirm("Are you SURE you would like to delete this FOREVER?") == true) {
fetch("https://auth.hectabit.org/api/deleteauth", {
method: "POST",
body: JSON.stringify({
secretKey: localStorage.getItem("DONOTSHARE-secretkey"),
appId: responseData[i]["appId"]
}),
headers: {
"Content-Type": "application/json; charset=UTF-8"
}
})
oauthElement.remove()
}
});
oauthElement.append(oauthText)
oauthElement.append(oauthRemoveButton)
oauthElement.classList.add("oauthentry")
document.getElementById("oauthlist").append(oauthElement)
}
}
doStuff()
});
}
getauths()

View File

@ -1,54 +0,0 @@
let homeserverBox = document.getElementById("homeserverBox")
let statusBox = document.getElementById("statusBox")
let changeButton = document.getElementById("changeButton")
function showElements(yesorno) {
if (!yesorno) {
homeserverBox.classList.add("hidden")
changeButton.classList.add("hidden")
}
else {
homeserverBox.classList.remove("hidden")
changeButton.classList.remove("hidden")
}
}
changeButton.addEventListener("click", (event) => {
async function doStuff() {
let remote = homeserverBox.value
if (remote == "") {
statusBox.innerText = "A homeserver is required!"
return
}
showElements(false)
statusBox.innerText = "Connecting to homeserver..."
fetch(remote + "/api/version")
.then((response) => response)
.then((response) => {
async function doStuff() {
if (response.status == 200) {
localStorage.setItem("homeserverURL", remote)
if (document.referrer !== "") {
window.location.href = document.referrer;
}
else {
window.location.href = "../login";
}
}
else if (response.status == 404) {
statusBox.innerText = "Not a valid homeserver!"
}
else {
statusBox.innerText = "Something went wrong!"
showElements(true)
}
}
doStuff()
});
}
doStuff()
});

19
templates/dashboard.html Normal file
View File

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/static/css/dashboard.css" media="">
<script src="/static/js/dashboard.js"></script>
</head>
<body>
<div class="newoauth">
<h>Submit a new OAuth2 App</h>
<p id="status"></p>
<p>AppID:</p>
<input id="appidbox">
<button onclick="attempt()">Submit</button>
</div>
<div class="oauthlist" id="oauthlist">
<h>Your existing apps</h>
</div>
</body>
</html>

View File

@ -1,41 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<title>Change homeserver</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="../static/css/style.css">
<link rel="icon" href="./static/svg/favicon.svg">
<script src="../static/js/hash-wasm.js"></script>
<style>
body {
background-color: #d9d9d9;
background-image: url("/static/svg/grid.svg");
background-repeat: repeat;
background-size: 312px
}
.inoutdiv {
border-radius: 8px;
}
</style>
</head>
<body>
<p class="credit">Image by perga (@pergagreen on discord)</p>
<img src="/static/img/background.jpg" class="background">
<div class="inoutdiv">
<h2 class="w300">Homeserver</h2>
<p>Change your homeserver</p>
<p id="statusBox"></p>
<input type="text" value="https://" id="homeserverBox"><br>
<button id="changeButton">Change</button><br><br>
<p>Please put in the URL in standard format; https://, http://, etc.</p>
</div>
<script type="text/javascript" src="../static/js/homeserver.js"></script>
</body>
</html>

View File

@ -34,7 +34,6 @@
<br> <br>
<br> <br>
<p>Don't have an account? If so, <a href="#" id="signuprdirButton">Create one here!</a></p> <p>Don't have an account? If so, <a href="#" id="signuprdirButton">Create one here!</a></p>
<div style="display: flex;"><p id="homeserver">Your homeserver is loading... </p><div style="display: flex;flex-direction: column;justify-content: center;"><a href="/homeserver">Change</a></div></div>
<a href="#" id="privacyButton">Privacy &amp; Terms</a> <a href="#" id="privacyButton">Privacy &amp; Terms</a>
</div> </div>

View File

@ -32,7 +32,6 @@
<button id="signupButton">Signup</button><br><br> <button id="signupButton">Signup</button><br><br>
<p>Already have an account? If so, <a href="#" id="loginButton">Login</a> instead!</p> <p>Already have an account? If so, <a href="#" id="loginButton">Login</a> instead!</p>
<p>Please note that it's impossible to reset your password, do not forget it!</p> <p>Please note that it's impossible to reset your password, do not forget it!</p>
<div style="display: flex;"><p id="homeserver">Your homeserver is loading... </p><div style="display: flex;flex-direction: column;justify-content: center;"><a href="/homeserver">Change</a></div></div>
<a href="#" id="privacyButton">Privacy &amp; Terms</a> <a href="#" id="privacyButton">Privacy &amp; Terms</a>
</div> </div>
<script type="text/javascript" src="../static/js/signup.js"></script> <script type="text/javascript" src="../static/js/signup.js"></script>