A framework-agnostic, universal document renderer with optional chunked loading polyrender.wisp.place/
at main 44 lines 1.2 kB view raw
1import { PolyRender } from '@polyrender/core' 2import '../../../packages/core/src/styles.css' 3import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.min.mjs?url' 4 5const viewerEl = document.getElementById('viewer')! 6const fileInput = document.getElementById('file-input') as HTMLInputElement 7 8let viewer: PolyRender | null = null 9 10fileInput.addEventListener('change', () => { 11 const file = fileInput.files?.[0] 12 if (!file) return 13 14 // Destroy previous viewer if one exists 15 if (viewer) { 16 viewer.destroy() 17 viewer = null 18 } 19 20 // Create a new PolyRender instance with the selected file 21 viewer = new PolyRender(viewerEl, { 22 source: { 23 type: 'file', 24 data: file, 25 filename: file.name, 26 }, 27 theme: 'dark', 28 toolbar: true, 29 pdf: { 30 workerSrc: pdfjsWorker, 31 }, 32 // Comic book archives (.cbz, .cbr, .cb7, .cbt) 33 comic: { 34 jxlFallback: true, // JPEG XL decoding via @jsquash/jxl 35 tiffSupport: true, // TIFF decoding via utif 36 }, 37 onReady: (info) => { 38 console.log(`Loaded "${file.name}" — ${info.pageCount} page(s), format: ${info.format}`) 39 }, 40 onError: (err) => { 41 console.error('PolyRender error:', err) 42 }, 43 }) 44})