Docker server has responsiveness now
This commit is contained in:
@@ -1,224 +1,365 @@
|
||||
<!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="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
|
||||
<title>WaifuBoard</title>
|
||||
<link rel="stylesheet" href="/views/css/globals.css">
|
||||
<link rel="stylesheet" href="/views/css/components/anilist-modal.css">
|
||||
<link rel="stylesheet" href="/views/css/components/hero.css">
|
||||
<link rel="stylesheet" href="/views/css/anime/anime.css">
|
||||
<link rel="stylesheet" href="/views/css/components/updateNotifier.css">
|
||||
<script src="/src/scripts/titlebar.js"></script>
|
||||
<link rel="stylesheet" href="/views/css/components/titlebar.css">
|
||||
</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>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link
|
||||
rel="icon"
|
||||
href="/public/assets/waifuboards.ico"
|
||||
type="image/x-icon"
|
||||
/>
|
||||
<title>WaifuBoard</title>
|
||||
<link rel="stylesheet" href="/views/css/globals.css" />
|
||||
<link rel="stylesheet" href="/views/css/components/anilist-modal.css" />
|
||||
<link rel="stylesheet" href="/views/css/components/hero.css" />
|
||||
<link rel="stylesheet" href="/views/css/anime/anime.css" />
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="/views/css/components/updateNotifier.css"
|
||||
/>
|
||||
<script src="/src/scripts/titlebar.js"></script>
|
||||
<link rel="stylesheet" href="/views/css/components/titlebar.css" />
|
||||
</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="modal-overlay" id="desc-modal">
|
||||
<div class="modal-content">
|
||||
<button class="modal-close" onclick="closeModal()">✕</button>
|
||||
<h2 class="modal-title">Synopsis</h2>
|
||||
<div class="modal-text" id="full-description"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-overlay" id="desc-modal">
|
||||
<div class="modal-content">
|
||||
<button class="modal-close" onclick="closeModal()">✕</button>
|
||||
<h2 class="modal-title">Synopsis</h2>
|
||||
<div class="modal-text" id="full-description"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-overlay" id="add-list-modal">
|
||||
<div class="modal-content modal-list">
|
||||
<button class="modal-close" onclick="closeAddToListModal()">✕</button>
|
||||
<h2 class="modal-title" id="modal-title">Add to List</h2>
|
||||
<div class="modal-overlay" id="add-list-modal">
|
||||
<div class="modal-content modal-list">
|
||||
<button class="modal-close" onclick="closeAddToListModal()">
|
||||
✕
|
||||
</button>
|
||||
<h2 class="modal-title" id="modal-title">Add to List</h2>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="modal-fields-grid">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Status</label>
|
||||
<select id="entry-status" class="form-input">
|
||||
<option value="WATCHING">Watching</option>
|
||||
<option value="COMPLETED">Completed</option>
|
||||
<option value="PLANNING">Planning</option>
|
||||
<option value="PAUSED">Paused</option>
|
||||
<option value="DROPPED">Dropped</option>
|
||||
<option value="REPEATING">Rewatching</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Episodes Watched</label>
|
||||
<input type="number" id="entry-progress" class="form-input" min="0" placeholder="0">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Your Score (0-10)</label>
|
||||
<input type="number" id="entry-score" class="form-input" min="0" max="10" step="0.1" placeholder="Optional">
|
||||
</div>
|
||||
|
||||
<div class="form-group full-width">
|
||||
<div class="date-group">
|
||||
<div class="date-input-pair">
|
||||
<label for="entry-start-date">Start Date</label>
|
||||
<input type="date" id="entry-start-date" class="form-input">
|
||||
<div class="modal-body">
|
||||
<div class="modal-fields-grid">
|
||||
<div class="form-group">
|
||||
<label>Status</label>
|
||||
<select id="entry-status" class="form-input">
|
||||
<option value="WATCHING">Watching</option>
|
||||
<option value="COMPLETED">Completed</option>
|
||||
<option value="PLANNING">Planning</option>
|
||||
<option value="PAUSED">Paused</option>
|
||||
<option value="DROPPED">Dropped</option>
|
||||
<option value="REPEATING">Rewatching</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="date-input-pair">
|
||||
<label for="entry-end-date">End Date</label>
|
||||
<input type="date" id="entry-end-date" class="form-input">
|
||||
|
||||
<div class="form-group">
|
||||
<label>Episodes Watched</label>
|
||||
<input
|
||||
type="number"
|
||||
id="entry-progress"
|
||||
class="form-input"
|
||||
min="0"
|
||||
placeholder="0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>Your Score (0-10)</label>
|
||||
<input
|
||||
type="number"
|
||||
id="entry-score"
|
||||
class="form-input"
|
||||
min="0"
|
||||
max="10"
|
||||
step="0.1"
|
||||
placeholder="Optional"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group full-width">
|
||||
<div class="date-group">
|
||||
<div class="date-input-pair">
|
||||
<label for="entry-start-date"
|
||||
>Start Date</label
|
||||
>
|
||||
<input
|
||||
type="date"
|
||||
id="entry-start-date"
|
||||
class="form-input"
|
||||
/>
|
||||
</div>
|
||||
<div class="date-input-pair">
|
||||
<label for="entry-end-date">End Date</label>
|
||||
<input
|
||||
type="date"
|
||||
id="entry-end-date"
|
||||
class="form-input"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="entry-repeat-count"
|
||||
>Rewatch Count</label
|
||||
>
|
||||
<input
|
||||
type="number"
|
||||
id="entry-repeat-count"
|
||||
class="form-input"
|
||||
min="0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group notes-group">
|
||||
<label for="entry-notes">Notes</label>
|
||||
<textarea
|
||||
id="entry-notes"
|
||||
class="form-input notes-textarea"
|
||||
rows="4"
|
||||
placeholder="Personal notes..."
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group checkbox-group">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="entry-is-private"
|
||||
class="form-checkbox"
|
||||
/>
|
||||
<label for="entry-is-private"
|
||||
>Mark as Private</label
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="entry-repeat-count">Rewatch Count</label>
|
||||
<input type="number" id="entry-repeat-count" class="form-input" min="0">
|
||||
</div>
|
||||
|
||||
<div class="form-group notes-group">
|
||||
<label for="entry-notes">Notes</label>
|
||||
<textarea id="entry-notes" class="form-input notes-textarea" rows="4" placeholder="Personal notes..."></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group checkbox-group">
|
||||
<input type="checkbox" id="entry-is-private" class="form-checkbox">
|
||||
<label for="entry-is-private">Mark as Private</label>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-actions">
|
||||
<button class="btn-danger" id="modal-delete-btn" onclick="deleteFromList()">Remove</button>
|
||||
<button class="btn-secondary" onclick="closeAddToListModal()">Cancel</button>
|
||||
<button class="btn-primary" onclick="saveToList()">Save Changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="/anime" class="back-btn">
|
||||
<svg width="20" height="20" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24"><path d="M15 19l-7-7 7-7"/></svg>
|
||||
Back to Home
|
||||
</a>
|
||||
|
||||
<div class="hero-wrapper">
|
||||
<div class="video-background">
|
||||
<div id="player"></div>
|
||||
</div>
|
||||
<div class="hero-overlay"></div>
|
||||
</div>
|
||||
|
||||
<div class="content-container">
|
||||
<aside class="sidebar">
|
||||
<div class="poster-card">
|
||||
<img id="poster" src="" alt="">
|
||||
</div>
|
||||
|
||||
<div class="info-grid">
|
||||
<div class="info-item">
|
||||
<h4>Format</h4>
|
||||
<span id="format">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Episodes</h4>
|
||||
<span id="episodes">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Status</h4>
|
||||
<span id="status">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Season</h4>
|
||||
<span id="season">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Studio</h4>
|
||||
<span id="studio">--</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-grid">
|
||||
<div class="info-item">
|
||||
<h4>Main Characters</h4>
|
||||
<div class="character-list" id="char-list"></div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main class="main-content">
|
||||
<div class="anime-header">
|
||||
<h1 class="anime-title" id="title">Loading...</h1>
|
||||
|
||||
<div class="meta-row">
|
||||
<div class="pill extension-pill" id="extension-pill" style="display: none; background: #8b5cf6;"></div>
|
||||
<div class="pill score" id="score">--% Score</div>
|
||||
<div class="pill" id="year">----</div>
|
||||
<div class="pill" id="genres">Action</div>
|
||||
</div>
|
||||
|
||||
<div class="action-row">
|
||||
<button class="btn-watch" id="watch-btn">
|
||||
<svg width="24" height="24" fill="currentColor" viewBox="0 0 24 24"><path d="M8 5v14l11-7z"/></svg>
|
||||
Start Watching
|
||||
</button>
|
||||
<button class="btn-secondary" id="add-to-list-btn" onclick="openAddToListModal()">+ Add to List</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="description-box">
|
||||
<div id="description-preview"></div>
|
||||
<button id="read-more-btn" class="read-more-btn" style="display: none;" onclick="openModal()">
|
||||
Read More
|
||||
<svg width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M19 9l-7 7-7-7"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="episodes-section">
|
||||
<div class="episodes-header-row">
|
||||
<div class="section-title" style="margin:0; border:none; padding:0;">
|
||||
<h2 style="font-size: 1.8rem; border-left: 4px solid #8b5cf6; padding-left: 1rem;">Episodes</h2>
|
||||
</div>
|
||||
<div class="episode-search-wrapper">
|
||||
<input type="number" id="ep-search" class="episode-search-input" placeholder="Jump to Ep #" min="1">
|
||||
<div class="modal-actions">
|
||||
<button
|
||||
class="btn-danger"
|
||||
id="modal-delete-btn"
|
||||
onclick="deleteFromList()"
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
<button
|
||||
class="btn-secondary"
|
||||
onclick="closeAddToListModal()"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button class="btn-primary" onclick="saveToList()">
|
||||
Save Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="episodes-grid" id="episodes-grid"></div>
|
||||
|
||||
<div class="pagination-controls" id="pagination-controls">
|
||||
<button class="page-btn" id="prev-page" onclick="changePage(-1)">Previous</button>
|
||||
<span class="page-info" id="page-info">Page 1 of 1</span>
|
||||
<button class="page-btn" id="next-page" onclick="changePage(1)">Next</button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</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>
|
||||
<a href="/anime" class="back-btn">
|
||||
<svg
|
||||
width="20"
|
||||
height="20"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
Back to Home
|
||||
</a>
|
||||
|
||||
<script src="/src/scripts/updateNotifier.js"></script>
|
||||
<script src="/src/scripts/rpc-inapp.js"></script>
|
||||
<script src="/src/scripts/auth-guard.js"></script>
|
||||
<div class="hero-wrapper">
|
||||
<div class="video-background">
|
||||
<div id="player"></div>
|
||||
</div>
|
||||
<div class="hero-overlay"></div>
|
||||
</div>
|
||||
|
||||
<script src="/src/scripts/utils/auth-utils.js"></script>
|
||||
<script src="/src/scripts/utils/notification-utils.js"></script>
|
||||
<script src="/src/scripts/utils/url-utils.js"></script>
|
||||
<script src="/src/scripts/utils/pagination-manager.js"></script>
|
||||
<script src="/src/scripts/utils/media-metadata-utils.js"></script>
|
||||
<script src="/src/scripts/utils/youtube-player-utils.js"></script>
|
||||
<script src="/src/scripts/utils/list-modal-manager.js"></script>
|
||||
<script src="/src/scripts/anime/anime.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
<div class="content-container">
|
||||
<aside class="sidebar">
|
||||
<div class="poster-card">
|
||||
<img id="poster" src="" alt="" />
|
||||
</div>
|
||||
|
||||
<div class="info-grid">
|
||||
<div class="info-item">
|
||||
<h4>Format</h4>
|
||||
<span id="format">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Episodes</h4>
|
||||
<span id="episodes">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Status</h4>
|
||||
<span id="status">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Season</h4>
|
||||
<span id="season">--</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<h4>Studio</h4>
|
||||
<span id="studio">--</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-grid">
|
||||
<div class="info-item">
|
||||
<h4>Main Characters</h4>
|
||||
<div class="character-list" id="char-list"></div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main class="main-content">
|
||||
<div class="anime-header">
|
||||
<h1 class="anime-title" id="title">Loading...</h1>
|
||||
|
||||
<div class="meta-row">
|
||||
<div
|
||||
class="pill extension-pill"
|
||||
id="extension-pill"
|
||||
style="display: none; background: #8b5cf6"
|
||||
></div>
|
||||
<div class="pill score" id="score">--% Score</div>
|
||||
<div class="pill" id="year">----</div>
|
||||
<div class="pill" id="genres">Action</div>
|
||||
</div>
|
||||
|
||||
<div class="action-row">
|
||||
<button class="btn-watch" id="watch-btn">
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M8 5v14l11-7z" />
|
||||
</svg>
|
||||
Start Watching
|
||||
</button>
|
||||
<button
|
||||
class="btn-secondary"
|
||||
id="add-to-list-btn"
|
||||
onclick="openAddToListModal()"
|
||||
>
|
||||
+ Add to List
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="description-box">
|
||||
<div id="description-preview"></div>
|
||||
<button
|
||||
id="read-more-btn"
|
||||
class="read-more-btn"
|
||||
style="display: none"
|
||||
onclick="openModal()"
|
||||
>
|
||||
Read More
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="episodes-section">
|
||||
<div class="episodes-header-row">
|
||||
<div
|
||||
class="section-title"
|
||||
style="margin: 0; border: none; padding: 0"
|
||||
>
|
||||
<h2
|
||||
style="
|
||||
font-size: 1.8rem;
|
||||
border-left: 4px solid #8b5cf6;
|
||||
padding-left: 1rem;
|
||||
"
|
||||
>
|
||||
Episodes
|
||||
</h2>
|
||||
</div>
|
||||
<div class="episode-search-wrapper">
|
||||
<input
|
||||
type="number"
|
||||
id="ep-search"
|
||||
class="episode-search-input"
|
||||
placeholder="Jump to Ep #"
|
||||
min="1"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="episodes-grid" id="episodes-grid"></div>
|
||||
|
||||
<div class="pagination-controls" id="pagination-controls">
|
||||
<button
|
||||
class="page-btn"
|
||||
id="prev-page"
|
||||
onclick="changePage(-1)"
|
||||
>
|
||||
Previous
|
||||
</button>
|
||||
<span class="page-info" id="page-info"
|
||||
>Page 1 of 1</span
|
||||
>
|
||||
<button
|
||||
class="page-btn"
|
||||
id="next-page"
|
||||
onclick="changePage(1)"
|
||||
>
|
||||
Next
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</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/rpc-inapp.js"></script>
|
||||
<script src="/src/scripts/auth-guard.js"></script>
|
||||
|
||||
<script src="/src/scripts/utils/auth-utils.js"></script>
|
||||
<script src="/src/scripts/utils/notification-utils.js"></script>
|
||||
<script src="/src/scripts/utils/url-utils.js"></script>
|
||||
<script src="/src/scripts/utils/pagination-manager.js"></script>
|
||||
<script src="/src/scripts/utils/media-metadata-utils.js"></script>
|
||||
<script src="/src/scripts/utils/youtube-player-utils.js"></script>
|
||||
<script src="/src/scripts/utils/list-modal-manager.js"></script>
|
||||
<script src="/src/scripts/anime/anime.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user