WaifuBoard/docker/src/scripts/books/books.js

let trendingBooks = [];
let currentHeroIndex = 0;
let heroInterval;

document.addEventListener('DOMContentLoaded', () => {
    SearchManager.init('#search-input', '#search-results', 'book');
    ContinueWatchingManager.load('my-status-books', 'reading', 'MANGA');
    init();
});

window.addEventListener('scroll', () => {
    const nav = document.getElementById('navbar');
    if (window.scrollY > 50) nav.classList.add('scrolled');
    else nav.classList.remove('scrolled');
});

function scrollCarousel(id, direction) {
    const container = document.getElementById(id);
    if(container) {
        const scrollAmount = container.clientWidth * 0.75;
        container.scrollBy({ left: direction * scrollAmount, behavior: 'smooth' });
    }
}

async function init() {
    try {
        const res = await fetch('/api/books/trending');
        const data = await res.json();

        if (data.results && data.results.length > 0) {
            trendingBooks = data.results;
            updateHeroUI(trendingBooks[0]);
            renderList('trending', trendingBooks);
            startHeroCycle();
        }

        const resPop = await fetch('/api/books/popular');
        const dataPop = await resPop.json();
        if (dataPop.results) renderList('popular', dataPop.results);

    } catch (e) {
        console.error("Books Error:", e);
    }
}

function startHeroCycle() {
    if(heroInterval) clearInterval(heroInterval);
    heroInterval = setInterval(() => {
        if(trendingBooks.length > 0) {
            currentHeroIndex = (currentHeroIndex + 1) % trendingBooks.length;
            updateHeroUI(trendingBooks[currentHeroIndex]);
        }
    }, 8000);
}

async function updateHeroUI(book) {
    if(!book) return;
    book.entry_type =
        book.format === 'MANGA' ? 'MANGA' : 'NOVEL';
    const title = book.title.english || book.title.romaji;
    const desc = book.description || "No description available.";
    const poster = (book.coverImage && (book.coverImage.extraLarge || book.coverImage.large)) || '';
    const banner = book.bannerImage || poster;

    document.getElementById('hero-title').innerText = title;
    document.getElementById('hero-desc').innerHTML = desc;
    document.getElementById('hero-score').innerText = (book.averageScore || '?') + '% Score';
    document.getElementById('hero-year').innerText = (book.startDate && book.startDate.year) ? book.startDate.year : '????';
    document.getElementById('hero-type').innerText = book.format || 'MANGA';

    const heroPoster = document.getElementById('hero-poster');
    if(heroPoster) heroPoster.src = poster;

    const bg = document.getElementById('hero-bg-media');
    if(bg) bg.src = banner;

    const readBtn = document.getElementById('read-btn');
    if (readBtn) {
        readBtn.onclick = () => window.location.href = `/book/${book.id}`;
    }

    const addToListBtn = document.querySelector('.hero-buttons .btn-blur');
    if(addToListBtn) {
        ListModalManager.currentData = book;
        const entryType = ListModalManager.getEntryType(book);

        await ListModalManager.checkIfInList(book.id, 'anilist', entryType);
        ListModalManager.updateButton();

        addToListBtn.onclick = () => ListModalManager.open(book, 'anilist');
    }
}

function renderList(id, list) {
    const container = document.getElementById(id);
    container.innerHTML = '';

    list.forEach(book => {
        const title = book.title.english || book.title.romaji;
        const cover = book.coverImage ? book.coverImage.large : '';
        const score = book.averageScore || '--';
        const type = book.format || 'Book';

        const el = document.createElement('div');
        el.className = 'card';

        el.onclick = () => {
            window.location.href = `/book/${book.id}`;
        };
        el.innerHTML = `
            <div class="card-img-wrap"><img src="${cover}" loading="lazy"></div>
            <div class="card-content">
                <h3>${title}</h3>
                <p>${score}% • ${type}</p>
            </div>
        `;
        container.appendChild(el);
    });
}

function saveToList() {
    const bookId = ListModalManager.currentData ? ListModalManager.currentData.id : null;
    if (!bookId) return;
    ListModalManager.save(bookId, 'anilist');
}

function deleteFromList() {
    const bookId = ListModalManager.currentData ? ListModalManager.currentData.id : null;
    if (!bookId) return;
    ListModalManager.delete(bookId, 'anilist');
}

function closeAddToListModal() {
    ListModalManager.close();
}