kobayashi90
69 lines
2.2 KiB
JavaScript
69 lines
2.2 KiB
JavaScript
// Browse page functionality
|
|
const API_BASE_URL = '/api';
|
|
|
|
async function loadBrowseMangas() {
|
|
try {
|
|
const response = await fetch(`${API_BASE_URL}/mangas?page=1&limit=20`);
|
|
const data = await response.json();
|
|
|
|
const grid = document.getElementById('browseGrid');
|
|
grid.innerHTML = '';
|
|
|
|
if (data.data && data.data.length > 0) {
|
|
data.data.forEach(manga => {
|
|
const card = createMangaCard(manga);
|
|
grid.appendChild(card);
|
|
});
|
|
}
|
|
} catch (error) {
|
|
console.error('Error loading mangas:', error);
|
|
}
|
|
}
|
|
|
|
function createMangaCard(manga) {
|
|
const card = document.createElement('div');
|
|
card.className = 'manga-card';
|
|
card.innerHTML = `
|
|
<div class="manga-cover">
|
|
${manga.cover_image ? `<img src="${manga.cover_image}" alt="${manga.title}">` : '📚'}
|
|
</div>
|
|
<div class="manga-info">
|
|
<h4 class="manga-title">${manga.title}</h4>
|
|
<p class="manga-author">${manga.author || 'Unknown'}</p>
|
|
<div class="manga-rating">
|
|
<span class="stars">${generateStars(manga.rating)}</span>
|
|
<span class="count">${manga.rating.toFixed(1)}</span>
|
|
</div>
|
|
<p class="manga-status">${manga.status || 'ongoing'}</p>
|
|
</div>
|
|
`;
|
|
|
|
card.addEventListener('click', () => {
|
|
window.location.href = `/manga/${manga.id}`;
|
|
});
|
|
|
|
return card;
|
|
}
|
|
|
|
function generateStars(rating) {
|
|
const fullStars = Math.floor(rating);
|
|
const hasHalfStar = rating % 1 >= 0.5;
|
|
let stars = '★'.repeat(fullStars);
|
|
if (hasHalfStar && fullStars < 5) stars += '☆';
|
|
stars += '☆'.repeat(5 - fullStars - (hasHalfStar ? 1 : 0));
|
|
return stars;
|
|
}
|
|
|
|
// Filter and sort functionality
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
loadBrowseMangas();
|
|
|
|
const sortSelect = document.getElementById('sortSelect');
|
|
const checkboxes = document.querySelectorAll('input[type="checkbox"]');
|
|
|
|
sortSelect.addEventListener('change', loadBrowseMangas);
|
|
checkboxes.forEach(checkbox => {
|
|
checkbox.addEventListener('change', loadBrowseMangas);
|
|
});
|
|
});
|