updated web
Prepare Build and Testing executable binary / Prepare-Build-Testing-With-Make (push) Successful in 10s
Prepare Build and Testing executable binary / Prepare-Build-Testing-With-CMake (push) Successful in 15s
Prepare Build and Testing executable binary / Prepare-Build-Testing-With-Meson (push) Successful in 12s

This commit is contained in:
wt
2025-08-30 12:24:57 +07:00
parent b0758c5499
commit 4c4f92e43b
5 changed files with 357 additions and 242 deletions
+1 -2
View File
@@ -28,7 +28,6 @@
background-color: gray;
backdrop-filter: blur(5px);
border-radius: 10px;
/* box-shadow: -5px -5px 30px 30px gray; */
}
.loginformheader {
@@ -51,7 +50,7 @@
display: flex;
}
.loginforminputbodyflex>button {
.loginforminputbodyflex > button {
margin: 10px;
}
+23 -9
View File
@@ -1,19 +1,33 @@
.message {
width: 100%;
* {
transition: 0.3s;
}
.notificationsection {
width: max-content;
height: 100vh;
position: fixed;
top: 10px;
right: 0;
pointer-events: none;
z-index: 16;
}
.notification {
width: max-content;
height: 0;
overflow: hidden;
pointer-events: none;
z-index: 10;
border-radius: 10px;
position: fixed;
top: 0;
left: 0;
transition: 0.3s;
right: 0;
cursor: pointer;
opacity: 0.8;
margin: 10px;
padding: 0 10px;
}
.messagetextbox {
.notificationtextbox {
width: 100%;
height: 100%;
display: grid;
@@ -22,19 +36,19 @@
pointer-events: none;
}
.messagetext {
.notificationtext {
width: 100%;
text-align: center;
pointer-events: none;
}
.message.active.error {
.notification.active.error {
pointer-events: all;
height: 10%;
background-color: rgb(233, 70, 70);
}
.message.active.success {
.notification.active.success {
pointer-events: all;
height: 10%;
background-color: rgb(76, 209, 76);
+218 -142
View File
@@ -1,155 +1,231 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/css/loginform.css">
<link rel="stylesheet" href="/css/message.css">
<link rel="stylesheet" href="/css/bootstrap.min.css">
<title>admin</title>
</head>
<body>
<div class="navbar navbar-expand-lg bg-body-tertiary gap-3 p-2">
<button class="btn btn-danger" id="exitbutton">Exit</button>
<button class="btn btn-warning" id="adduserbutton">Adduser</button>
<h1 class="usernameheader"></h1>
<div class="form-check">
<input type="checkbox" id="themecheckbox" class="form-check-input">
<label for="themecheckbox" class="form-check-label">Dark theme</label>
</div>
</div>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/css/loginform.css" />
<link rel="stylesheet" href="/css/message.css" />
<link rel="stylesheet" href="/css/bootstrap.min.css" />
<title>admin</title>
</head>
<body>
<div class="navbar navbar-expand-lg bg-body-tertiary gap-3 p-2">
<button class="btn btn-danger" id="exitbutton">Exit</button>
<button class="btn btn-warning" id="adduserbutton">Adduser</button>
<h1 class="usernameheader"></h1>
<div class="form-check">
<input
type="checkbox"
id="themecheckbox"
class="form-check-input"
/>
<label for="themecheckbox" class="form-check-label"
>Dark theme</label
>
</div>
</div>
<div class="form loginform" id="loginform">
<form class="formbody loginformbody" id="loginformbody">
<h1 class="loginformheader">Login</h1>
<div class="form-floating mb-3">
<input type="text" required id="loginforminputusername" class="form-control" placeholder="John">
<label for="loginforminputusername">Username</label>
<div class="form loginform" id="loginform">
<form class="formbody loginformbody" id="loginformbody">
<h1 class="loginformheader">Login</h1>
<div class="form-floating mb-3">
<input
type="text"
required
id="loginforminputusername"
class="form-control"
placeholder="John"
/>
<label for="loginforminputusername">Username</label>
</div>
<div class="form-floating mb-3">
<input
type="password"
required
id="loginforminputpassword"
class="form-control"
placeholder="***"
/>
<label for="loginforminputpassword">Password</label>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">login</button>
</div>
</form>
</div>
<div class="form-floating mb-3">
<input type="password" required id="loginforminputpassword" class="form-control" placeholder="***">
<label for="loginforminputpassword">Password</label>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">login</button>
</div>
</form>
</div>
<div class="form adduserform">
<form class="formbody adduserformbody">
<h1 class="loginformheader">Add User</h1>
<div class="form-floating mb-3">
<input type="text" required id="adduserformusername" class="form-control">
<label for="adduserformusername">Username</label>
<div class="form adduserform">
<form class="formbody adduserformbody">
<h1 class="loginformheader">Add User</h1>
<div class="form-floating mb-3">
<input
type="text"
required
id="adduserformusername"
class="form-control"
/>
<label for="adduserformusername">Username</label>
</div>
<div class="form-floating mb-3">
<input
type="text"
required
id="adduserformemail"
class="form-control"
/>
<label for="adduserformemail">Email</label>
</div>
<div class="form-floating mb-3">
<input
type="password"
required
id="adduserformpassword"
class="form-control"
/>
<label for="adduserformpassword">Password</label>
</div>
<div class="form-floating mb-3">
<input
type="text"
required
id="adduserformgroup"
class="form-control"
/>
<label for="adduserformgroup">Group</label>
</div>
<div class="form-check">
<input
type="checkbox"
id="adduserformissuperuser"
class="form-check-input"
/>
<label for="adduserformissuperuser" class="form-check-label"
>Is Superuser</label
>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Add</button>
<button id="canceladduser" class="btn btn-primary">
Cancel
</button>
</div>
</form>
</div>
<div class="form-floating mb-3">
<input type="text" required id="adduserformemail" class="form-control">
<label for="adduserformemail">Email</label>
</div>
<div class="form-floating mb-3">
<input type="password" required id="adduserformpassword" class="form-control">
<label for="adduserformpassword">Password</label>
</div>
<div class="form-floating mb-3">
<input type="text" required id="adduserformgroup" class="form-control">
<label for="adduserformgroup">Group</label>
</div>
<div class="form-check">
<input type="checkbox" id="adduserformissuperuser" class="form-check-input">
<label for="adduserformissuperuser" class="form-check-label">Is Superuser</label>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Add</button>
<button id="canceladduser" class="btn btn-primary">Cancel</button>
</div>
</form>
</div>
<div class="form changeuserform">
<form class="formbody changeuserformbody">
<h1 class="loginformheader">Change User Data</h1>
<div class="form-floating mb-3">
<input type="text" required id="changeuserformusername" class="form-control" placeholder="Username">
<label for="changeuserformusername">Username</label>
<div class="form changeuserform">
<form class="formbody changeuserformbody">
<h1 class="loginformheader">Change User Data</h1>
<div class="form-floating mb-3">
<input
type="text"
required
id="changeuserformusername"
class="form-control"
placeholder="Username"
/>
<label for="changeuserformusername">Username</label>
</div>
<div class="form-floating mb-3">
<input
type="text"
id="changeuserformemail"
class="form-control"
placeholder="***"
/>
<label for="changeuserformemail">email</label>
</div>
<div class="form-floating mb-3">
<input
type="text"
required
id="changeuserformgroup"
class="form-control"
/>
<label for="changeuserformgroup">Group</label>
</div>
<div class="form-check">
<input
type="checkbox"
id="changeuserformissuperuser"
class="form-check-input"
/>
<label
for="changeuserformissuperuser"
class="form-check-label"
>Is Superuser</label
>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Change</button>
<button id="cancelchangeuser" class="btn btn-primary">
Cancel
</button>
</div>
</form>
</div>
<div class="form-floating mb-3">
<input type="text" id="changeuserformemail" class="form-control" placeholder="***">
<label for="changeuserformemail">email</label>
</div>
<div class="form-floating mb-3">
<input type="text" required id="changeuserformgroup" class="form-control">
<label for="changeuserformgroup">Group</label>
</div>
<div class="form-check">
<input type="checkbox" id="changeuserformissuperuser" class="form-check-input">
<label for="changeuserformissuperuser" class="form-check-label">Is Superuser</label>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Change</button>
<button id="cancelchangeuser" class="btn btn-primary">Cancel</button>
</div>
</form>
</div>
<div class="form confirmform">
<div class="formbody confirmformbody">
<h1>Are you sure?</h1>
<div class="d-grid gap-2">
<button id="yes" class="btn btn-primary">Confirm</button>
<button id="no" class="btn btn-primary">Cancel</button>
<div class="form confirmform">
<div class="formbody confirmformbody">
<h1>Are you sure?</h1>
<div class="d-grid gap-2">
<button id="yes" class="btn btn-primary">Confirm</button>
<button id="no" class="btn btn-primary">Cancel</button>
</div>
</div>
</div>
</div>
</div>
<div class="form changepasswordform">
<form class="formbody changepasswordformbody">
<h1 class="loginformheader">Change Password</h1>
<div class="form-floating mb-3">
<input type="text" required id="changepasswordnewpassword" class="form-control" placeholder="***">
<label for="changepasswordnewpassword">New password</label>
<div class="form changepasswordform">
<form class="formbody changepasswordformbody">
<h1 class="loginformheader">Change Password</h1>
<div class="form-floating mb-3">
<input
type="text"
required
id="changepasswordnewpassword"
class="form-control"
placeholder="***"
/>
<label for="changepasswordnewpassword">New password</label>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Change</button>
<button class="btn btn-primary" id="cancelchangepassword">
Cancel
</button>
</div>
</form>
</div>
<div class="d-grid gap-2">
<button class="btn btn-primary">Change</button>
<button class="btn btn-primary" id="cancelchangepassword">Cancel</button>
<div class="notificationsection"></div>
<div class="table">
<table class="table">
<thead class="alluserstablehead">
<tr>
<th>id</th>
<th>username</th>
<th>email</th>
<th>group</th>
<th>is_superuser</th>
<th>delete</th>
<th>change password</th>
<th>change user data</th>
</tr>
</thead>
<tbody id="alluserstablebody"></tbody>
</table>
</div>
</form>
</div>
<div class="message">
<div class="messagetextbox">
<h3 class="messagetext"></h3>
</div>
</div>
<div class="table">
<table class="table">
<thead class="alluserstablehead">
<tr>
<th>id</th>
<th>username</th>
<th>email</th>
<th>group</th>
<th>is_superuser</th>
<th>delete</th>
<th>change password</th>
<th>change user data</th>
</tr>
</thead>
<tbody id="alluserstablebody"></tbody>
</table>
</div>
<script src="/js/security.js"></script>
<script src="/js/message.js"></script>
<script src="/js/routes.js"></script>
<script src="/js/window.js"></script>
<script src="/js/theme.js"></script>
<script src="/js/login.js"></script>
<script src="/js/get_all_users.js"></script>
<script src="/js/add_user.js"></script>
<script src="/js/del_user.js"></script>
<script src="/js/change_password.js"></script>
<script src="/js/change_user.js"></script>
<script src="/js/bootstrap.min.js"></script>
</body>
<script src="/js/security.js"></script>
<script src="/js/message.js"></script>
<script src="/js/routes.js"></script>
<script src="/js/window.js"></script>
<script src="/js/theme.js"></script>
<script src="/js/login.js"></script>
<script src="/js/get_all_users.js"></script>
<script src="/js/add_user.js"></script>
<script src="/js/del_user.js"></script>
<script src="/js/change_password.js"></script>
<script src="/js/change_user.js"></script>
<script src="/js/bootstrap.min.js"></script>
</body>
</html>
+84 -74
View File
@@ -1,83 +1,93 @@
const loginform = document.querySelector('#loginform')
const loginformbody = document.querySelector('#loginformbody')
const loginforminputusername = document.querySelector('#loginforminputusername')
const loginforminputpassword = document.querySelector('#loginforminputpassword')
const exitbutton = document.querySelector('#exitbutton')
const usernameheader = document.querySelector('.usernameheader')
const loginform = document.querySelector("#loginform");
const loginformbody = document.querySelector("#loginformbody");
const loginforminputusername = document.querySelector(
"#loginforminputusername",
);
const loginforminputpassword = document.querySelector(
"#loginforminputpassword",
);
const exitbutton = document.querySelector("#exitbutton");
const usernameheader = document.querySelector(".usernameheader");
if (localStorage.getItem("token") === null) {
loginform.classList.add("active")
loginform.classList.add("active");
}
loginformbody.addEventListener('submit', (e) => {
e.preventDefault()
hashPassword(loginforminputpassword.value).then(hashedpassword => {
login(loginforminputusername.value, hashedpassword)
})
})
loginformbody.addEventListener("submit", (e) => {
e.preventDefault();
hashPassword(loginforminputpassword.value).then((hashedpassword) => {
login(loginforminputusername.value, hashedpassword);
});
});
const login = async (username, password) => {
const response = await fetch(routes.login(), {
method: 'POST',
headers: {
Accept: 'application/json',
// 'Access-Control-Allow-Origin': '*',
'Content-Type': 'application/json',
},
// mode: 'no-cors',
body: `{"username":"${username}","password":"${password}"}`
}).then(data => data.json()).then(jsondata => jsondata).catch((error) => {
if (error.message === "Unexpected end of JSON input") {
notification(`Ошибка на сервере: Создайте файл users.json и запишите в него первого пользователя`, "error")
} else {
notification(`Ошибка на сервере: ${error}`, "error")
}
})
if (response.error) {
loginforminputusername.classList.add('is-invalid')
loginforminputpassword.classList.add('is-invalid')
notification("Неправильный логин или пароль", "error")
}
if (response.token) {
notification("Успешно", "success")
loginform.classList.remove("active")
localStorage.setItem("token", response.token)
await get_user_data()
loginforminputusername.value = ""
loginforminputpassword.value = ""
loginforminputusername.classList.remove('is-invalid')
loginforminputpassword.classList.remove('is-invalid')
}
}
const response = await fetch(routes.login(), {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
},
body: `{"username":"${username}","password":"${password}"}`,
})
.then((data) => data.json())
.then((jsondata) => jsondata)
.catch((error) => {
if (error.message === "Unexpected end of JSON input") {
notification(
`Ошибка на сервере: Создайте файл users.json и запишите в него первого пользователя`,
"error",
);
} else {
notification(`Ошибка на сервере: ${error}`, "error");
}
});
if (response.error) {
loginforminputusername.classList.add("is-invalid");
loginforminputpassword.classList.add("is-invalid");
notification("Неправильный логин или пароль", "error");
}
if (response.token) {
notification("Успешно", "success");
loginform.classList.remove("active");
localStorage.setItem("token", response.token);
await get_user_data();
loginforminputusername.value = "";
loginforminputpassword.value = "";
loginforminputusername.classList.remove("is-invalid");
loginforminputpassword.classList.remove("is-invalid");
}
};
const get_user_data = async () => {
const response = await fetch(routes.user(), {
method: "POST",
body: `{"token":"${localStorage.getItem("token")}"}`
}).then(data => data.json()).then(jsondata => jsondata).catch((error) => {
notification(`Ошибка на сервере: ${error}`, "error")
})
if (response.is_superuser) {
await get_all_users()
usernameheader.innerHTML = response.username
} else {
document.querySelector('#alluserstablebody').innerHTML = ""
loginform.classList.add("active")
notification("Вы не можете войти потому что не являетесь администратором", "error")
localStorage.clear()
}
if (response.id) {
localStorage.setItem("userdata", JSON.stringify(response))
}
}
const response = await fetch(routes.user(), {
method: "POST",
body: `{"token":"${localStorage.getItem("token")}"}`,
})
.then((data) => data.json())
.then((jsondata) => jsondata)
.catch((error) => {
notification(`Ошибка на сервере: ${error}`, "error");
});
if (response.is_superuser) {
await get_all_users();
usernameheader.innerHTML = response.username;
} else {
document.querySelector("#alluserstablebody").innerHTML = "";
loginform.classList.add("active");
notification(
"Вы не можете войти потому что не являетесь администратором",
"error",
);
localStorage.clear();
}
if (response.id) {
localStorage.setItem("userdata", JSON.stringify(response));
}
};
message.addEventListener('click', () => {
message.classList.remove("active")
})
exitbutton.addEventListener('click', () => {
localStorage.removeItem('token')
localStorage.removeItem('userdata')
loginform.classList.add('active')
notification('Вы вышли', "success")
})
exitbutton.addEventListener("click", () => {
localStorage.removeItem("token");
localStorage.removeItem("userdata");
loginform.classList.add("active");
notification("Вы вышли", "success");
});
+31 -15
View File
@@ -1,18 +1,34 @@
const message = document.querySelector('.message')
const messagetext = document.querySelector('.messagetext')
const notificationsection = document.querySelector(".notificationsection");
const notification = (text, type) => {
if (type === "error") {
message.classList.remove('success')
message.classList.add('error')
} else {
message.classList.remove('error')
message.classList.add('success')
}
messagetext.innerHTML = text
message.classList.add('active')
const notificationbox = document.createElement("div");
const notificationtextbox = document.createElement("div");
const notificationtext = document.createElement("h3");
notificationtext.classList.add("notificationtext");
notificationtextbox.append(notificationtext);
notificationtextbox.classList.add("notificationtextbox");
notificationtextbox.classList.add("card-header");
notificationbox.append(notificationtextbox);
notificationbox.classList.add("notification");
notificationbox.addEventListener("click", () => {
notificationbox.classList.remove("active");
});
notificationsection.append(notificationbox);
if (type === "error") {
notificationbox.classList.remove("success");
notificationbox.classList.add("error");
} else {
notificationbox.classList.remove("error");
notificationbox.classList.add("success");
}
notificationtext.innerHTML = text;
setTimeout(() => {
notificationbox.classList.add("active");
}, 300);
setTimeout(() => {
notificationbox.classList.remove("active");
setTimeout(() => {
message.classList.remove('active')
}, 2000)
}
notificationsection.removeChild(notificationbox);
}, 200);
}, 3000);
};