working on user settings

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
2024-07-21 23:57:42 +02:00
parent 03a0ba139f
commit f078491344
13 changed files with 252 additions and 17 deletions

View File

@@ -2,3 +2,29 @@ var api = "/api";
var web = "/web";
const UNAUTHORIZED = 401;
function get(id){
return document.getElementById(id);
}
function disable(id){
get(id).setAttribute('disabled',true);
}
function enable(id){
get(id).removeAttribute('disabled');
}
function getValue(id){
return get(id).value;
}
function setText(id, text){
get(id).innerHTML = text;
}
function setValue(id,newVal){
document.getElementById(id).value = newVal;
}

View File

@@ -6,9 +6,7 @@
<script src="user.js"></script>
</head>
<body>
<nav>
<a id="clients" href="clients.html">Clients</a>
</nav>
<nav></nav>
<h1>Welcome!</h1>
</body>
</html>

View File

@@ -16,8 +16,8 @@ function doRedirect(){
function tryLogin(){
document.getElementById("error").innerHTML = "";
var username = document.getElementById('username').value;
var password = document.getElementById('password').value;
var username = getValue('username');
var password = getValue('password');
fetch(api+"/login",{
method: 'POST',
headers: {

View File

@@ -0,0 +1,5 @@
<a href="index.html">Dashboard</a>
<a href="clients.html" class="MANAGE_CLIENTS">Clients</a>
<a href="users.html" class="MANAGE_USERS">Users</a>
<a href="settings.html">Settings</a>
<a href="logout.html">Logout</a>

View File

@@ -0,0 +1,55 @@
<html>
<head>
<meta charset="utf-8">
<title>Light OIDC</title>
<script src="common.js"></script>
<script src="user.js"></script>
<script src="settings.js"></script>
</head>
<body>
<nav></nav>
<h1>Settings</h1>
<form>
<fieldset>
<legend>
Basic settings
</legend>
<table>
<tr>
<th>User name</th>
<td><input id="username" type="text"></td>
</tr>
<tr>
<th>Email</th>
<td><input id="email" type="email"></td>
</tr>
<tr>
<th>ID</th>
<td><input id="uuid" type="text" disabled="true"></td>
</tr>
</table>
<button id="updateBtn" type="button" onClick="update()">Update</button>
</fieldset>
<fieldset>
<legend>
Password
</legend>
<table>
<tr>
<th>Old password</th>
<td><input id="oldpass1" type="password"></td>
</tr>
<tr>
<th>Repeat Password</th>
<td><input id="oldpass2" type="password"></td>
</tr>
<tr>
<th>New Password</th>
<td><input id="newpass" type="password"></td>
</tr>
</table>
<button id="passBtn" type="button" onClick="updatePass()">Update</button>
</fieldset>
</form>
</body>
</html>

View File

@@ -0,0 +1,68 @@
function fillForm(){
if (user == null){
setTimeout(fillForm,100);
} else {
console.log(user);
setValue('username',user.username);
setValue('email',user.email);
setValue('uuid', user.uuid);
}
}
function handleResponse(response){
setText('updateBtn',response.ok ? 'saved.' : 'failed!');
setTimeout(function(){
setText('updateBtn','Update');
enable('updateBtn');
},10000);
}
function handlePasswordResponse(response){
setText('passBtn',response.ok ? 'saved.' : 'failed!');
setTimeout(function(){
setText('passBtn','Update');
enable('passBtn');
},10000);
}
function update(){
disable('updateBtn');
setText('updateBtn','sent…');
var newData = {
username : getValue('username'),
email : getValue('email'),
uuid : getValue('uuid')
}
fetch(api+'/update/user',{
method : 'POST',
headers : {
'Content-Type': 'application/json'
},
body : JSON.stringify(newData)
}).then(handleResponse)
}
function updatePass(){
disable('passBtn');
setText('passBtn','sent…');
var newData = {
oldpass : [getValue('oldpass1'),getValue('oldpass2')],
newpass : getValue('newpass'),
uuid : getValue('uuid')
}
fetch(api+'/update/password',{
method : 'POST',
headers : {
'Content-Type': 'application/json'
},
body : JSON.stringify(newData)
}).then(handlePasswordResponse);
setTimeout(function(){
setText('passBtn','Update');
enable('passBtn');
},10000);
}
setTimeout(fillForm,100);

View File

@@ -1,11 +1,27 @@
var user = null;
async function handleUser(response){
if (response.status == UNAUTHORIZED) {
window.location.href = 'login.html?return_to='+encodeURI(window.location.href);
return;
}
var user = await response.json();
// TODO: load navigation
if (response.ok){
user = await response.json();
fetch(web+"/navigation.html").then(handleNavigation);
}
}
async function handleNavigation(response){
if (response.ok){
var content = await response.text();
var nav = document.getElementsByTagName('nav')[0];
nav.innerHTML = content;
var links = nav.getElementsByTagName('a');
for (var index = 0; index < links.length; index++){
var link = links[index];
var clazz = link.hasAttribute('class') ? link.getAttribute("class") : null;
if (clazz != null && !user.permissions.includes(clazz)) nav.removeChild(link);
}
}
}
fetch(api+"/user",{method:'POST'}).then(handleUser);