bookreader
v5.0.0-83
Internet Archive BookReader digunakan untuk melihat buku-buku dari Internet Archive online dan juga dapat digunakan untuk melihat buku-buku lain.
Lihat contoh langsung:
Di halaman detail: https://archive.org/details/birdbookillustra00reedrich
Jendela penuh: https://archive.org/details/birdbookillustra00reedrich?view=theater
Url tersemat untuk iFrames: https://archive.org/embed/birdbookillustra00reedrich
Lihat direktori BookReaderDemo . Ini dapat diuji dengan membuat file sumber (pastikan Node.js diinstal):
npm jalankan pembangunan
dan memulai server web sederhana di direktori root:
npm run serve
Dan kemudian buka http://localhost:8000/BookReaderDemo/demo-simple.html .
Berikut adalah contoh singkatnya.
// Membuat opsi objekvar BookReader = {
data: [[ { lebar: 800, tinggi: 1200,uri: '//archive.org/download/BookReader/img/page001.jpg' },],[ { lebar: 800, tinggi: 1200,uri: '/ /archive.org/download/BookReader/img/page002.jpg' }, { lebar: 800, tinggi: 1200,uri: '//archive.org/download/BookReader/img/page003.jpg' },],[ { lebar: 800, tinggi: 1200,uri: '//archive.org/download/BookReader/img/page004.jpg' }, { lebar: 800, tinggi: 1200,uri: '//archive.org/download/BookReader/img/page005.jpg' },]
],
Judul buku: 'Presentasi Pembaca Buku Sederhana',
// thumbnail bersifat opsional, tetapi digunakan dalam dialog info
gambar kecil: '//archive.org/download/BookReader/img/page014.jpg',
// Metadata bersifat opsional, tetapi digunakan dalam dialog info
metadata: [{label: 'Title', value: 'Open Library BookReader Presentation'},{label: 'Author', value: 'Internet Archive'},{label: 'Demo Info', value: 'Demo ini menunjukkan caranya seseorang dapat menggunakan BookReader dengan kontennya sendiri.'},
],
ui: 'penuh', // sematkan, penuh (responsif)};var br = new BookReader(options);// Ayo!br.init();Mulai dari v5, BookReader memperkenalkan arsitektur hybrid yang menggabungkan kode inti yang ditulis dalam jQuery mendekati evolusinya sebagai komponen web. Saat kami bergerak menuju masa depan BookReader sebagai komponen web, kami mengambil pendekatan Berbasis Peristiwa untuk menghubungkan keduanya.
Mendekati:
Didorong oleh peristiwa
Perubahan UI
API kembali
Acara Inti src/BookReader/events.js
Cari API src/BookReader/events.js
Kode inti BookReader (BR) memancarkan peristiwa khusus, melaporkan tindakan yang diperlukan:
BookNavigator, pengontrol komponen web BR, mendengarkan dan bereaksi terhadap kejadian ini untuk mengisi panel menu samping
Kontrol BR dari luar dengan menggunakan metode publik
Saat kami terus memisahkan UI dari logika menggambar/menghitung, metode logis ini akan menjadi lebih mudah dikenali, dikembangkan sebagai metode publik, dan membuat pengujian unit untuk metode tersebut.
Saat BookNavigator bereaksi terhadap kejadian BR, BookNavigator dapat langsung mengontrol inti BR menggunakan fungsi publik.
Navigasi samping BookReader didukung oleh komponen web rasa LitElement.
Fungsi inti BookReader ada di jQuery. Ini termasuk:
menggambar & mengubah ukuran buku dan berbagai mode (1up, penyebaran 2 halaman, tampilan galeri)
navigasi horizontal
layanan API pencarian
plugin
Sekilas tentang cara menggunakan/memperluas fungsionalitas inti:
Properti
TODO (untuk saat ini lihat src/BookReader/options.js)
Plugin
plugin.autoplay.js - mode putar otomatis. Membalik halaman pada interval yang ditentukan.
plugin.chapters.js - merender penanda bab
plugin.search.js - tambahkan ui pencarian, dan panggilan balik
plugin.tts.js - tambahkan tts (baca dengan lantang) ui, perpustakaan suara, dan panggilan balik
plugin.url.js - secara otomatis memperbarui url browser
plugin.resume.js - menggunakan cookie untuk mengingat halaman saat ini
plugin.vendor-fullscreen.js - menggantikan mode layar penuh dengan layar penuh asli vendor
lihat direktori plugin untuk file plugin saat ini
Sistem plugin dasar digunakan. Lihat contohnya di direktori plugins. Ide umumnya adalah bahwa mereka adalah mixin yang menambah prototipe BookReader. Lihat direktori plugin untuk semua plugin yang disertakan, namun berikut beberapa contohnya:
BookReader dapat disematkan dalam <iframe> . Jika Anda menggunakan Plugin IFrame di dalam <iframe> , pembaca akan mengirimkan pemberitahuan tentang perubahan status pembaca melalui window.postMessage() . Jendela induk dapat mengirim pesannya sendiri (juga melalui window.postMessage() ) dan Plugin IFrame akan menangani pembaruan pembaca agar sesuai.
Pesan Perubahan Fragmen dikirim ke jendela induk ketika Pembaca Buku yang tertanam berpindah antar halaman/mode. Ketika <iframe> menerima pesan ini, ia berpindah ke halaman/mode yang ditentukan. "Fragmen" diformat sesuai dengan spesifikasi URL BookReader.
{ "type": "bookReaderFragmentChange", "fragment": "halaman/n1/mode/2up"}(pembaruan?)
JavaScript sumber ditulis dalam ES6 (terletak di direktori src/js ) dan di ES5 (terletak di BookReader ). npm run serve-dev memulai server dev yang memuat ulang otomatis, yang membangun js/css yang telah diedit di localhost:8000 .
Hingga versi utama berikutnya muncul, kita harus menyimpan file build di dalam repo untuk menjaga kompatibilitas ke belakang. Mohon JANGAN sertakan file-file ini dalam PR Anda. Apa pun yang ada di direktori BookReader/ tidak boleh dikomit.
Untuk melihat perubahan paket ikon lokal di pembaca buku, Anda harus menginstal core-js ke dalam paket ikon dan menautkan ke pembaca buku.
Mari kita gunakan icon-share sebagai contoh.
Konfirmasikan paket ikon Anda berfungsi dengan baik di demo iaux-icons
Arahkan ke paket ikon Anda ( iaux-icons/packages/icon-share ) dan jalankan perintah: npm install core-js
Anda tidak perlu melakukan perubahan core-js ini
Dari dalam direktori paket ikon Anda, jalankan perintah: npm link
Anda dapat menggunakan perintah npm ls -g untuk mengonfirmasi paket lokal Anda sekarang muncul di registri
Arahkan ke /bookreader dan jalankan perintah: npm link @internetarchive/icon-share
Anda dapat menggunakan perintah npm ls |grep icon-share untuk mengonfirmasi bahwa icon-share sekarang merupakan tautan ke direktori lokal Anda
Anda sekarang dapat memulai server lokal untuk melihat perubahan Anda dengan menjalankan perintah: npm run serve-dev
Untuk meningkatkan versi repo dan menyiapkan rilis, jalankan npm version major|minor|patch (mengikuti semver), lalu (seperti) git push origin HEAD --tags . Ini akan secara otomatis memperbarui nomor versi yang muncul, membuat file, dan meminta Anda memperbarui CHANGELOG.
Kami merilis dalam repo BookReader sebagai tag & juga sebagai modul simpul @internetarchive/bookreader
Kami ingin mencapai cakupan tes 100% dan melacak kemajuan kami dalam proyek ini: BookReader Fidelity
Kami juga melakukan pengujian ujung ke ujung menggunakan Testcafe. Kami menulis pengujian untuk repo itu sendiri dan juga untuk penggunaan kami di archive.org. Anda dapat membacanya di sini. Ini relatif mudah dilakukan, dan cara yang luar biasa untuk mengenal keajaiban BookReader. Periksa papan proyek untuk tiket terbuka untuk dikerjakan. Dan jika Anda tidak melihat tes untuk sesuatu yang Anda lihat, jangan ragu untuk membuat masalah.
Untuk menjalankan semua pengujian ujung ke ujung lokal, jalankan perintah: npm run test:e2e
Agar server pengujian ujung ke ujung tetap aktif saat pengembangan, jalankan perintah: npm run test:e2e:dev
Kami memiliki pengujian unit dan menggunakan Jest untuk menjalankannya. Untuk tiruan, kami menggunakan mekanisme tiruan internal Jest dan Sinon untuk mengatur mata-mata.
Untuk menjalankan semua pengujian unit lokal, jalankan perintah: npm run test
Kita selalu dapat menggunakan BookReader buatan tangan. Periksa masalahnya dan lihat apa yang menarik minat Anda. Jika Anda mempunyai ide untuk perbaikan, bukalah terbitan.
Dokumentasi pengembang: https://openlibrary.org/dev/docs/bookreader
Kode sumber yang dihosting: https://github.com/internetarchive/bookreader
IIIF (http://iiif.io) Lihat BookReaderDemo/demo-iiif.html untuk melihat contoh cara memuat manifes IIIF di BookReader.
Perhatikan bahwa BookReader adalah bagian inti dari misi Archive.org tentang Akses Universal ke Semua Pengetahuan. Oleh karena itu, perhatian harus diberikan untuk mendukung browser lama. Ini harus tetap berfungsi dan dapat digunakan pada perangkat lama.
Ubah perpustakaan menjadi dependensi NPM daripada disertakan dalam kode sumber
Lihat CHANGELOG.md untuk sejarah proyek.
Lisensi kode sumbernya adalah AGPL v3, seperti yang dijelaskan dalam file LISENSI.
Kemampuan untuk menguji pada beberapa perangkat disediakan berkat Browser Stack.
