ItsSkaiya/WaifuBoard
3
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 8 Wiki Activity

support for multiple users

Browse Source
This commit is contained in:
lenafx
2025-12-06 01:21:19 +01:00
parent 4e2875579c
commit 2df7625657
20 changed files with 2313 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

174
views/users.html Normal file
View File

@@ -0,0 +1,174 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>WaifuBoard - Users</title>
<link rel="stylesheet" href="/views/css/anime/home.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<link rel="stylesheet" href="/views/css/titlebar.css">
<link rel="stylesheet" href="/views/css/users.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<script src="/src/scripts/titlebar.js"></script>
</head>
<body>
<div id="titlebar"> <div class="title-left">
<img class="app-icon" src="/public/assets/waifuboards.ico" alt=""/>
<span class="app-title">WaifuBoard</span>
</div>
<div class="title-right">
<button class="min">—</button>
<button class="max">🗖</button>
<button class="close">✕</button>
</div>
</div>
<div class="page-wrapper">
<div class="background-gradient"></div>
<div class="content-container">
<div class="header-section">
<h1 class="page-title">Who's exploring?</h1>
<p class="page-subtitle">Select your profile to continue</p>
</div>
<div class="users-grid" id="usersGrid">
</div>
<button class="btn-add-user" id="btnAddUser">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="12" y1="5" x2="12" y2="19"></line>
<line x1="5" y1="12" x2="19" y2="12"></line>
</svg>
Add User
</button>
</div>
</div>
<div class="modal" id="modalCreateUser">
<div class="modal-overlay"></div>
<div class="modal-content">
<div class="modal-header">
<h2>Create New User</h2>
<button class="modal-close" id="closeCreateModal">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<form id="createUserForm">
<div class="form-group">
<label for="username">Username</label>
<input type="text" id="username" name="username" required maxlength="20" placeholder="Enter your name">
</div>
<div class="form-group">
<label>Profile Picture</label>
<div class="avatar-upload-area" id="avatarUploadArea">
<div class="avatar-preview" id="avatarPreview">
<svg class="avatar-preview-placeholder" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
<circle cx="12" cy="7" r="4"></circle>
</svg>
</div>
<p class="avatar-upload-text">Click to upload or drag and drop</p>
<p class="avatar-upload-hint">PNG, JPG up to 5MB</p>
</div>
<input type="file" id="avatarInput" accept="image/*">
</div>
<div class="modal-actions">
<button type="button" class="btn-secondary" id="cancelCreate">Cancel</button>
<button type="submit" class="btn-primary">Create User</button>
</div>
</form>
</div>
</div>
<div class="modal" id="modalUserActions">
<div class="modal-overlay"></div>
<div class="modal-content" style="max-width: 400px;">
<div class="modal-header">
<h2 id="actionsModalTitle">Manage Profile</h2>
<button class="modal-close" id="closeActionsModal">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<div id="actionsModalContent">
</div>
</div>
</div>
<div class="modal" id="modalEditUser">
<div class="modal-overlay"></div>
<div class="modal-content">
<div class="modal-header">
<h2>Edit Profile</h2>
<button class="modal-close" id="closeEditModal">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<form id="editUserForm">
<div class="form-group">
<label for="editUsername">Username</label>
<input type="text" id="editUsername" name="username" required maxlength="20" placeholder="Enter your new name">
</div>
<div class="form-group">
<label>Profile Picture</label>
<div class="avatar-upload-area" id="editAvatarUploadArea">
<div class="avatar-preview" id="editAvatarPreview">
<svg class="avatar-preview-placeholder" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
<circle cx="12" cy="7" r="4"></circle>
</svg>
</div>
<p class="avatar-upload-text">Click to upload or drag and drop</p>
<p class="avatar-upload-hint">PNG, JPG up to 5MB</p>
</div>
<input type="file" id="editAvatarInput" accept="image/*">
</div>
<div class="modal-actions">
<button type="button" class="btn-secondary" id="cancelEdit">Cancel</button>
<button type="submit" class="btn-primary">Save Changes</button>
</div>
</form>
</div>
</div>
<div class="modal" id="modalAniList">
<div class="modal-overlay"></div>
<div class="modal-content">
<div class="modal-header">
<h2>AniList Integration</h2>
<button class="modal-close" id="closeAniListModal">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
</button>
</div>
<div id="aniListContent">
</div>
</div>
</div>
<div id="userToastContainer"></div>
<div id="updateToast" class="hidden">
<p>Update available: <span id="latestVersionDisplay">v1.x</span></p>
<a
id="downloadButton"
href="https://git.waifuboard.app/ItsSkaiya/WaifuBoard/releases"
target="_blank"
>
Click To Download
</a>
</div>
<script src="/src/scripts/updateNotifier.js"></script>
<script src="/src/scripts/users.js"></script>
</body>
</html>