adminsopel/albumik_ynh
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Albumik v0.1.1 account settings and visual refresh

Browse Source
This commit is contained in:
adminsopel
2026-05-01 09:59:12 +02:00
parent 14445d4064
commit a10547b1dc
5 changed files with 735 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
web/app.js
View File

@@ -221,3 +221,94 @@ $('#rejectPhotoBtn').addEventListener('click', async()=>{
});
init();
function renderAccountView() {
const main = document.querySelector("#content") || document.querySelector("main") || document.querySelector(".main");
if (!main) return;
const user = state.user || {};
main.innerHTML = `
<div class="header">
<h1>Moje konto</h1>
<p>Zmień swoje hasło i sprawdź informacje o koncie.</p>
</div>
<div class="card account-card" style="padding:24px;margin-top:24px;">
<h2>Dane konta</h2>
<div class="list-row"><strong>Login</strong><span>${escapeHtml(user.username || '')}</span></div>
<div class="list-row"><strong>Nazwa</strong><span>${escapeHtml(user.display_name || '')}</span></div>
<div class="list-row"><strong>Rola</strong><span>${escapeHtml(user.role || '')}</span></div>
</div>
<div class="card account-card" style="padding:24px;margin-top:18px;">
<h2>Zmiana hasła</h2>
<form id="changePasswordForm">
<div class="field">
<label>Obecne hasło</label>
<input name="current_password" type="password" required />
</div>
<div class="field">
<label>Nowe hasło</label>
<input name="new_password" type="password" minlength="8" required />
</div>
<div class="field">
<label>Powtórz nowe hasło</label>
<input name="repeat_password" type="password" minlength="8" required />
</div>
<div class="form-error" id="changePasswordError"></div>
<button class="primary-btn" type="submit" style="margin-top:16px;">Zmień hasło</button>
</form>
</div>
`;
document.querySelector("#changePasswordForm")?.addEventListener("submit", async (e) => {
e.preventDefault();
const fd = new FormData(e.currentTarget);
const current_password = fd.get("current_password");
const new_password = fd.get("new_password");
const repeat_password = fd.get("repeat_password");
const err = document.querySelector("#changePasswordError");
if (new_password !== repeat_password) {
err.textContent = "Nowe hasła nie są takie same.";
return;
}
try {
const res = await api("/api/me/password", {
method: "POST",
body: JSON.stringify({ current_password, new_password })
});
if (!res.ok) {
err.textContent = res.error || "Nie udało się zmienić hasła.";
return;
}
err.style.color = "#16a34a";
err.textContent = "Hasło zostało zmienione.";
e.currentTarget.reset();
} catch (ex) {
err.textContent = "Błąd połączenia z serwerem.";
}
});
}
function escapeHtml(value) {
return String(value ?? "")
.replaceAll("&", "&amp;")
.replaceAll("<", "&lt;")
.replaceAll(">", "&gt;")
.replaceAll('"', "&quot;")
.replaceAll("'", "&#039;");
}
document.addEventListener("click", (e) => {
const btn = e.target.closest("[data-view='account']");
if (!btn) return;
e.preventDefault();
state.currentView = "account";
document.querySelectorAll(".nav-btn").forEach(b => b.classList.remove("active"));
btn.classList.add("active");
renderAccountView();
});

BIN
web/assets/albumik-logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 54 KiB

10
web/index.html
View File

@@ -4,12 +4,12 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Albumik</title>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="/styles.css?v=11" />
</head>
<body>
<div id="login" class="login-shell hidden">
<div class="login-card">
<div class="brand-badge">A</div>
<img class="login-logo-small" src="/assets/albumik-logo.png" alt="Albumik" />
<h1>Albumik</h1>
<p>Lekki prywatny album zdjęć na Twoim serwerze.</p>
<form id="loginForm">
@@ -21,6 +21,7 @@
<div id="loginError" class="error-line"></div>
</form>
</div>
</section>
</div>
<div id="app" class="app hidden">
@@ -39,7 +40,8 @@
<button class="nav-item" data-view="tags"><span>Tagi</span></button>
<button class="nav-item admin-only" data-view="users"><span>Użytkownicy</span></button>
<button class="nav-item admin-only" data-view="logs"><span>Dziennik</span></button>
</nav>
<button class="nav-btn" data-view="account">Moje konto</button>
</nav>
<div class="sidebar-footer">
<div id="currentUser" class="current-user"></div>
<button id="logoutBtn" class="ghost-btn">Wyloguj</button>
@@ -190,6 +192,6 @@
</div>
</dialog>
<script src="app.js"></script>
<script src="/app.js?v=11"></script>
</body>
</html>

642
web/styles.css
View File

File diff suppressed because one or more lines are too long