KomSuite/KomPage
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects 1 Releases 10 Wiki Activity

feat: add ability to display info even if title in komga, fix requests, fix not all results showing up, fixes #11 fixes #10 fixes #8

Browse Source
This commit is contained in:
WorldTeacher
2025-05-05 12:03:53 +02:00
parent 8081d419cc
commit 65b929a1ca
3 changed files with 55 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/templates/index.html
View File

@@ -37,7 +37,13 @@
<input type="checkbox" id="toggleNSFW" />
Show NSFW content
</label>
<label style="margin-left: 1em;">
<input type="checkbox" id="toggleNovels" checked />
Show Novels
</label>
</div>
</div>
{% if results %}
@@ -45,7 +51,7 @@
<div class="results">
{% for result in results %}
<div class="card {% if result.in_komga %}komga{% endif %}">
<div class="card {{ result.type | lower }} {% if result.in_komga %}komga{% endif %}">
<div class="image-container {{ 'nsfw' if result.isAdult else '' }}">
<img src="{{ result.image }}" alt="Cover">
@@ -56,7 +62,7 @@
<p>{{ result.title }}</p>
<div class="actions">
<button onclick="showInfo({{ result | tojson | safe }})" , class="info">Info</button>
<button onclick="showInfo({{ result | tojson | safe }})" class="info">Info</button>
<!-- if entry has in_komga == true, do not show the request button, else show it -->
{% if not result.in_komga %}
<button onclick="sendRequest('{{ result.id }}')" class="request">Request</button>
@@ -86,6 +92,10 @@
</div>
</div>
<div id="loading" style="display: none; text-align: center; margin-top: 1em;">
<p>Loading...</p>
</div>
<script>
function sendRequest(item) {
fetch("/request", {
@@ -113,13 +123,14 @@
}
document.addEventListener("DOMContentLoaded", () => {
const checkbox = document.getElementById("toggleNSFW");
const nsfwCheckbox = document.getElementById("toggleNSFW");
const novelsCheckbox = document.getElementById("toggleNovels");
const body = document.body;
body.classList.add("nsfw-disabled");
checkbox.addEventListener("change", () => {
const enabled = checkbox.checked;
nsfwCheckbox.addEventListener("change", () => {
const enabled = nsfwCheckbox.checked;
body.classList.toggle("nsfw-disabled", !enabled);
body.classList.toggle("nsfw-enabled", enabled);
@@ -129,6 +140,13 @@
});
});
novelsCheckbox.addEventListener("change", () => {
const enabled = novelsCheckbox.checked;
document.querySelectorAll('.card.novel').forEach(card => {
card.style.display = enabled ? '' : 'none';
});
});
fetchOptions("/api/genres", "genre");
fetchOptions("/api/tags", "tag");
});
@@ -228,14 +246,23 @@
tags: selectedTags
};
const loadingElement = document.getElementById("loading");
loadingElement.style.display = "block"; // Show loading animation
fetch("/search", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify(query)
})
.then(res => res.json())
.then(data => displayResults(data))
.catch(err => console.error("Search failed", err));
.then(data => {
displayResults(data);
loadingElement.style.display = "none"; // Hide loading animation
})
.catch(err => {
console.error("Search failed", err);
loadingElement.style.display = "none"; // Hide loading animation
});
}
function displayResults(data) {
@@ -245,6 +272,7 @@
data.forEach(result => {
const card = document.createElement('div');
card.className = `card ${result.in_komga ? 'komga' : ''}`;
card.className += ` ${result.type.toLowerCase()}`;
const imageContainer = document.createElement('div');
imageContainer.className = `image-container ${result.isAdult ? 'nsfw' : ''}`;
@@ -275,6 +303,11 @@
requestButton.textContent = 'Request';
requestButton.onclick = () => sendRequest(result.id);
// Disable request button if the result is in Komga
if (result.in_komga) {
requestButton.disabled = true;
}
actions.appendChild(infoButton);
actions.appendChild(requestButton);