added update notifier

This commit is contained in:
2025-12-02 21:05:45 +01:00
parent fb3d1a447e
commit 01376362af
11 changed files with 314 additions and 0 deletions

View File

@@ -6,6 +6,7 @@
<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>
@@ -128,6 +129,20 @@
</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/anime/anime.js"></script>
</body>
</html>

View File

@@ -7,6 +7,7 @@
<title>WaifuBoard Book</title>
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<link rel="stylesheet" href="/views/css/books/book.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
</head>
<body>
@@ -111,6 +112,19 @@
</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/books/book.js"></script>
</body>
</html>

View File

@@ -6,6 +6,7 @@
<title>WaifuBoard Books</title>
<link rel="stylesheet" href="/views/css/books/books.css">
<script src="../src/scripts/books/books.js" defer></script>
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
</head>
<body>
@@ -81,5 +82,18 @@
</section>
</main>
<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>
</body>
</html>

View File

@@ -0,0 +1,85 @@
#updateToast {
position: fixed;
bottom: 20px;
right: 30px;
z-index: 5000;
opacity: 0;
transform: translateY(100px);
pointer-events: none;
transition: opacity 0.4s ease-out, transform 0.4s ease-out;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
padding: 0.8rem 1.25rem;
border-radius: var(--radius-md);
max-width: 300px;
background: rgba(18, 18, 21, 0.8);
backdrop-filter: blur(8px);
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.6);
color: var(--text-primary);
font-size: 0.9rem;
}
#updateToast.hidden {
opacity: 0;
transform: translateY(100px);
pointer-events: none;
}
#updateToast.update-available {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
#updateToast p {
margin: 0;
font-weight: 500;
width: 100%;
padding-bottom: 0.3rem;
}
#latestVersionDisplay {
font-weight: 700;
font-size: 0.9rem;
padding: 0.2rem 0.6rem;
border-radius: 6px;
background: var(--accent);
color: var(--bg-base);
display: inline-block;
margin-left: 0.5rem;
box-shadow: 0 0 12px var(--accent-glow);
transition: transform 0.2s;
}
#downloadButton {
width: 100%;
padding: 0.6rem 1rem;
border-radius: 999px;
font-weight: 700;
font-size: 0.9rem;
cursor: pointer;
text-decoration: none;
text-align: center;
background: var(--accent);
color: white;
border: none;
box-shadow: 0 4px 10px var(--accent-glow);
transition: transform 0.2s, background 0.2s;
}
#downloadButton:hover {
transform: translateY(-2px);
background: #7c4dff;
box-shadow: 0 6px 15px var(--accent-glow);
}

View File

@@ -9,6 +9,7 @@
<link rel="stylesheet" href="/views/css/gallery/image.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
</head>
<body>
@@ -52,6 +53,19 @@
</section>
</main>
<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/gallery/image.js"></script>
</body>
</html>

View File

@@ -7,6 +7,7 @@
<link rel="stylesheet" href="/views/css/anime/home.css">
<link rel="stylesheet" href="/views/css/gallery/gallery.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js" async></script>
@@ -67,6 +68,19 @@
</section>
</main>
<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/gallery/gallery.js"></script>
</body>
</html>

View File

@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WaifuBoard</title>
<link rel="stylesheet" href="/views/css/anime/home.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
</head>
<body>
@@ -104,6 +105,19 @@
</section>
</main>
<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/anime/animes.js"></script>
</body>
</html>

View File

@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Reader</title>
<link rel="stylesheet" href="/views/css/books/reader.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet">
</head>
@@ -177,6 +178,18 @@
</div>
</main>
<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/books/reader.js"></script>
</body>
</html>

View File

@@ -9,6 +9,7 @@
<link rel="icon" href="/public/assets/waifuboards.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/views/css/schedule/schedule.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
</head>
<body>
@@ -81,6 +82,19 @@
<span id="loadingText">Syncing Schedule...</span>
</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/schedule/schedule.js"></script>
</body>
</html>

View File

@@ -6,6 +6,7 @@
<base href="/">
<title>WaifuBoard Watch</title>
<link rel="stylesheet" href="/views/css/anime/watch.css">
<link rel="stylesheet" href="/views/css/updateNotifier.css">
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<link rel="stylesheet" href="https://cdn.plyr.io/3.7.8/plyr.css" />
<script src="https://cdn.plyr.io/3.7.8/plyr.js"></script>
@@ -168,5 +169,18 @@
});
</script>
<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>
</body>
</html>