dattatron/kanji-kracker-deluxe

1// Initialize the app2document.addEventListener('DOMContentLoaded', () => {3    // Set up any event listeners or initial state here4    5    // Example: Toggle vertical/horizontal reading mode6    const toggleReadingMode = () => {7        const readerContent = document.querySelector('.reader-content');8        if (readerContent) {9            readerContent.classList.toggle('tategaki');10        }11    };12});13// Book upload handler with EPUB.js integration14async function handleBookUpload(event) {15    const file = event.target.files[0];16    if (!file) return;17 18    if (file.type === 'application/epub+zip' || file.name.endsWith('.epub')) {19        try {20            // Load EPUB.js library dynamically if not already loaded21            if (!window.ePub) {22                await loadScript('https://cdnjs.cloudflare.com/ajax/libs/epub.js/0.3.93/epub.min.js');23            }24 25            // Create a URL for the file26            const url = URL.createObjectURL(file);27            28            // Initialize EPUB.js Book29            const book = ePub(url);30            31            // Display the book32            book.renderTo("reader-view", {33                width: "100%",34                height: "100%"35            });36 37            // Display book metadata38            const metadata = await book.loaded.metadata;39            console.log('Book loaded:', metadata.title);40            41            // Add to library42            addBookToLibrary({43                title: metadata.title,44                cover: await getBookCover(book),45                id: Date.now().toString()46            });47 48        } catch (error) {49            console.error('Error loading EPUB:', error);50            alert('Error loading EPUB file. Please try another file.');51        }52    } else {53        alert('Please upload a valid EPUB file.');54    }55}56 57async function getBookCover(book) {58    try {59        const coverUrl = await book.archive.createUrl(book.coverPath(), { base64: true });60        return coverUrl || 'http://static.photos/books/320x240/1';61    } catch {62        return 'http://static.photos/books/320x240/1';63    }64}65 66function addBookToLibrary(book) {67    const library = JSON.parse(localStorage.getItem('epubLibrary') || '[]');68    if (!library.some(b => b.id === book.id)) {69        library.push(book);70        localStorage.setItem('epubLibrary', JSON.stringify(library));71        updateLibraryUI();72    }73}74 75function updateLibraryUI() {76    const library = JSON.parse(localStorage.getItem('epubLibrary') || '[]');77    const libraryContainer = document.querySelector('.library-container');78    79    if (libraryContainer) {80        libraryContainer.innerHTML = library.map(book => `81            <div class="flex items-center gap-4 p-3 hover:bg-gray-50 rounded-lg cursor-pointer" data-book-id="${book.id}">82                <img src="${book.cover}" class="w-16 h-24 object-cover rounded-md" alt="${book.title}">83                <div>84                    <h3 class="font-medium text-gray-800">${book.title || 'Untitled'}</h3>85                    <p class="text-sm text-gray-500">EPUB Book</p>86                </div>87            </div>88        `).join('');89    }90}91 92function loadScript(src) {93    return new Promise((resolve, reject) => {94        const script = document.createElement('script');95        script.src = src;96        script.onload = resolve;97        script.onerror = reject;98        document.head.appendChild(script);99    });100}101 102// Initialize library on load103document.addEventListener('DOMContentLoaded', () => {104    updateLibraryUI();105    106    // Set up file input107    const fileInput = document.createElement('input');108    fileInput.type = 'file';109    fileInput.accept = '.epub';110    fileInput.style.display = 'none';111    fileInput.addEventListener('change', handleBookUpload);112    document.body.appendChild(fileInput);113 114    // Trigger file input when Add Book button is clicked115    document.querySelector('.add-book-btn')?.addEventListener('click', () => {116        fileInput.click();117    });118});119