149 lines
4.7 KiB
HTML
149 lines
4.7 KiB
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/anime/anime.css">
|
|
<link rel="stylesheet" href="/views/css/updateNotifier.css">
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<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>
|
|
|
|
|
|
<a href="/" 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">+ 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/anime/anime.js"></script>
|
|
</body>
|
|
</html> |