From 2469bb8c02781539339cd713925bf022865bce3f Mon Sep 17 00:00:00 2001 From: Richard Caceres Date: Wed, 28 Feb 2018 13:25:09 -0800 Subject: [PATCH] More updates to demos and documentation. Preparing for a v3 release. --- BookReader/BookReaderEmbed.css | 4 +- BookReader/plugins/plugin.mobile_nav.js | 2 +- BookReaderDemo/BookReaderDemo.css | 4 +- BookReaderDemo/BookReaderJSAdvanced.js | 8 +- BookReaderDemo/BookReaderJSSimple.js | 10 +- BookReaderDemo/IIIFBookReader.js | 2 + BookReaderDemo/demo-advanced.html | 28 ++-- BookReaderDemo/demo-embed-iframe-src.html | 157 ++++++++-------------- BookReaderDemo/demo-fullscreen.html | 43 +++++- BookReaderDemo/demo-ia-plato.html | 47 ++++--- BookReaderDemo/demo-iiif.html | 28 ++-- BookReaderDemo/demo-iiif.js | 3 - BookReaderDemo/demo-simple.html | 26 ++-- BookReaderDemo/index.html | 6 + CHANGELOG.md | 12 +- README.md | 51 +++---- 16 files changed, 225 insertions(+), 206 deletions(-) create mode 100644 BookReaderDemo/index.html diff --git a/BookReader/BookReaderEmbed.css b/BookReader/BookReaderEmbed.css index 921af717e..84f1f5b5a 100644 --- a/BookReader/BookReaderEmbed.css +++ b/BookReader/BookReaderEmbed.css @@ -13,7 +13,7 @@ font-size: 0.9em; } -#BRembedreturn { +.BRembedreturn { /* Center text */ font-size: 14px; line-height: 40px; @@ -21,7 +21,7 @@ font-family: "Lucida Grande","Arial",sans-serif; } -#BRembedreturn a { +.BRembedreturn a { font-size: 14px; color: #036daa; } diff --git a/BookReader/plugins/plugin.mobile_nav.js b/BookReader/plugins/plugin.mobile_nav.js index fe7964708..4456ec36a 100644 --- a/BookReader/plugins/plugin.mobile_nav.js +++ b/BookReader/plugins/plugin.mobile_nav.js @@ -1,6 +1,6 @@ /** * Adds mobile navigation at responsive breakpoint - * NOTE addition script and style must be included. + * NOTE additional script and style tags must be included. * * * diff --git a/BookReaderDemo/BookReaderDemo.css b/BookReaderDemo/BookReaderDemo.css index 24a0484b1..3ba04c237 100644 --- a/BookReaderDemo/BookReaderDemo.css +++ b/BookReaderDemo/BookReaderDemo.css @@ -6,11 +6,11 @@ body { } /* Hide print and embed functionality */ -#BRtoolbar .embed, .print { +.BRtoolbar .embed, .print { display: none; } -#BookReader { +.BookReader { width:800px; height: 600px; overflow: hidden; diff --git a/BookReaderDemo/BookReaderJSAdvanced.js b/BookReaderDemo/BookReaderJSAdvanced.js index bbae95b24..189304672 100644 --- a/BookReaderDemo/BookReaderJSAdvanced.js +++ b/BookReaderDemo/BookReaderJSAdvanced.js @@ -81,10 +81,10 @@ var options = { }, // Book title and the URL used for the book title link - bookTitle: 'Internet Archive BookReader Presentation', - bookUrl: '//archive.org/details/BookReader', - bookUrlText: 'Back to details on Archive.org', - bookUrlTitle: 'Back to details on Archive.org', + bookTitle: 'BookReader Advanced Demo', + bookUrl: '/BookReaderDemo/index.html', + bookUrlText: 'Back to Demos', + bookUrlTitle: 'This is the book URL title', // thumbnail is optional, but it is used in the info dialog thumbnail: '//archive.org/download/BookReader/img/page014.jpg', // Metadata is optional, but it is used in the info dialog diff --git a/BookReaderDemo/BookReaderJSSimple.js b/BookReaderDemo/BookReaderJSSimple.js index 7a53d7178..547241f7d 100644 --- a/BookReaderDemo/BookReaderJSSimple.js +++ b/BookReaderDemo/BookReaderJSSimple.js @@ -25,10 +25,10 @@ var options = { ], // Book title and the URL used for the book title link - bookTitle: 'Simple BookReader Presentation', - bookUrl: 'https://archive.org/details/BookReader', - bookUrlText: 'Back to Archive.org', - bookUrlTitle: 'Back to Archive.org', + bookTitle: 'BookReader Demo', + bookUrl: '/BookReaderDemo/index.html', + bookUrlText: 'Back to Demos', + bookUrlTitle: 'This is the book URL title', // thumbnail is optional, but it is used in the info dialog thumbnail: '//archive.org/download/BookReader/img/page014.jpg', @@ -47,6 +47,4 @@ var options = { el: '#BookReader', }; var br = new BookReader(options); - -// Let's go! br.init(); diff --git a/BookReaderDemo/IIIFBookReader.js b/BookReaderDemo/IIIFBookReader.js index 4d4f37cd9..746785d62 100644 --- a/BookReaderDemo/IIIFBookReader.js +++ b/BookReaderDemo/IIIFBookReader.js @@ -1,7 +1,9 @@ // Bind to the BookReader object providing facilities to set the necessary // BookReader functions from a IIIF endpoint URL. +// author: @aeschylus // TODO enable passing in manifest and sequence id directly +// TODO convert this to be a v3 plugin. Use simplified options.data (function(BR){ diff --git a/BookReaderDemo/demo-advanced.html b/BookReaderDemo/demo-advanced.html index 72e09ea85..95577d2bc 100644 --- a/BookReaderDemo/demo-advanced.html +++ b/BookReaderDemo/demo-advanced.html @@ -6,28 +6,28 @@ - + + + + + + + - - - - - - - - - - - - + + + + + +
Internet Archive BookReader Demo
diff --git a/BookReaderDemo/demo-embed-iframe-src.html b/BookReaderDemo/demo-embed-iframe-src.html index b80980e4f..627652719 100644 --- a/BookReaderDemo/demo-embed-iframe-src.html +++ b/BookReaderDemo/demo-embed-iframe-src.html @@ -6,19 +6,19 @@ - + - + - - - - - - + + + + + + - + + + +
+ + + diff --git a/BookReaderDemo/demo-ia-plato.html b/BookReaderDemo/demo-ia-plato.html index 12ba3963b..e457e7bef 100644 --- a/BookReaderDemo/demo-ia-plato.html +++ b/BookReaderDemo/demo-ia-plato.html @@ -4,28 +4,33 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + - - - - - + + + + + + + @@ -33,7 +38,7 @@ Internet Archive BookReader Demo
diff --git a/BookReaderDemo/demo-iiif.html b/BookReaderDemo/demo-iiif.html index c2ab06224..efad90df3 100644 --- a/BookReaderDemo/demo-iiif.html +++ b/BookReaderDemo/demo-iiif.html @@ -4,17 +4,21 @@ - - + + + + + + + - - - - - - + + + + + + - @@ -22,13 +26,13 @@ Internet Archive BookReader Demo
- - + + diff --git a/BookReaderDemo/demo-iiif.js b/BookReaderDemo/demo-iiif.js index 095a1db8e..b3c006d58 100644 --- a/BookReaderDemo/demo-iiif.js +++ b/BookReaderDemo/demo-iiif.js @@ -19,9 +19,6 @@ br.IIIF({ sequenceId : 'https://iiif.archivelab.org/iiif/platowithenglish04platuoft/canvas/default', maxWidth: 800, initCallback: function() { - // read-aloud and search need backend compenents and are not supported in the demo - $('#BRtoolbar').find('.read').hide(); - $('.BRtoolbarSectionSearch').hide(); } }); diff --git a/BookReaderDemo/demo-simple.html b/BookReaderDemo/demo-simple.html index 08fc7dc2c..10cfc3af0 100644 --- a/BookReaderDemo/demo-simple.html +++ b/BookReaderDemo/demo-simple.html @@ -1,30 +1,32 @@ - bookreader demo + bookreader simple demo - + + + + + + + - - + + + - - - - - - - + +
Internet Archive BookReader Demo
diff --git a/BookReaderDemo/index.html b/BookReaderDemo/index.html new file mode 100644 index 000000000..4a8ec3f66 --- /dev/null +++ b/BookReaderDemo/index.html @@ -0,0 +1,6 @@ +Simple
+Fullscreen with mobile nav
+Advanced
+Embed
+From Internet Archive
+IIIF
diff --git a/CHANGELOG.md b/CHANGELOG.md index 787d704b4..263d28d02 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,13 +1,23 @@ # 3.0.0 Major Release -- Make BookReader easier to use, by adding `options` to the constructor, and adding new `options.data` option. The old way of overriding properties should still work, but it is deprecated. + +Version 3.0.0 is an effort to make BookReader more modular, extensible, and easier to use. + +Changes include: + +- Make BookReader easier to use, by adding `options` to the constructor, and adding new `options.data` option. The old way of overriding properties should still work, but it is deprecated. With `options.data`, all BookReader needs is the image URLs and dimensions. To have dynamic image URLs (eg for scaling), omit the URL from `options.data`, and include `options.getPageURI`. - Factor out extra features into plugins. See `plugins` directory. Example plugins include: - plugins.chapters.js - render chapter markers - plugins.search.js - add search ui, and callbacks - plugins.tts.js - add tts (read aloud) ui, sound library, and callbacks - plugins.url.js - automatically updates the browser url - plugins.resume.js - uses cookies to remember the current page + - plugins.mobile_nav.js - adds responsive mobile nav to BookReader +Note that there is minor overhead added when loading multiple script tags. If this is a concern, a build step, can be used to concatenate the files into a single JS file. - Clean up code: Remove a lot of commented-out code. Remove some unused methods. - Change some, but not all, CSS ids to classes. +- DEPRECATED: Use options to configure BookReader. It is now deprecated to change properties directly. +- DEPRECATED: CSS ids are being removed, (eg #BookReader is now .BookReader), with the goal to entirely use classes instead. This is in progress, but it is considered deprecated to use the ids directly. We would like to remove all ids for the next major release. +- BREAKING: If features that are now in plugins were used, the plugin's JS file will need to be included as well. Note, we would also like to separate the CSS into a separate file for the next major release. # 2.1.0 - Add auto mode to 1up autosize (in addition to height and width) diff --git a/README.md b/README.md index e05d27ae8..139032790 100644 --- a/README.md +++ b/README.md @@ -75,20 +75,17 @@ See `BookReaderDemo/demo-simple.html` and `BookReaderDemo/BookReaderJSSimple.js` - TODO (for now see BookReader.js and BookReader function at approx. line 44) -## Notes about version 3 +## Plugins -- Make BookReader easier to use, by adding `options` to the constructor, and adding new `options.data` option. The old way of overriding properties should still work, but it is deprecated. -- Factor out extra features into plugins. See `plugins` directory. -- Clean up code: Remove a lot of commented-out code. Remove some unused methods. -- Change some, but not all, CSS ids to classes. +A basic plugin system is used. See the examples in the plugins directory. The general idea is that they are mixins that augment the BookReader prototype. See the plugins directory for all the included plugins, but here are some examples: -## Notes about version 2 +- plugins.chapters.js - render chapter markers +- plugins.search.js - add search ui, and callbacks +- plugins.tts.js - add tts (read aloud) ui, sound library, and callbacks +- plugins.url.js - automatically updates the browser url +- plugins.resume.js - uses cookies to remember the current page +- plugins.mobile_nav.js - adds responsive mobile nav to BookReader -Some of the new features in version 2: -- Updated look for desktop -- Improved mobile support -- Fix issues with Text to Speech in browsers that don't support Flash -- Remove PHP backend code from this repository and only include frontend code ## More info @@ -103,6 +100,25 @@ IIIF (http://iiif.io) See `BookReaderDemo/demo-iiif.html` to see an example of how to load a IIIF manifest in BookReader. +## Notes about version 3 + +- Make BookReader easier to use, by adding `options` to the constructor, and adding new `options.data` option. The old way of overriding properties should still work, but it is deprecated. +- Factor out extra features into plugins. See `plugins` directory. +- Clean up code: Remove a lot of commented-out code. Remove some unused methods. +- Change some, but not all, CSS ids to classes. + +See the CHANGELOG.md for more information. + + +## Notes about version 2 + +Some of the new features in version 2: +- Updated look for desktop +- Improved mobile support +- Fix issues with Text to Speech in browsers that don't support Flash +- Remove PHP backend code from this repository and only include frontend code + + ## Areas for improvement - Change libraries to be NPM dependencies rather than included in the source code @@ -117,24 +133,13 @@ Some notes for contributing: - Please test the changes in desktop, mobile, and embed modes, and also on many different devices/browsers. -## Plugins - -A work-in-progress plugin system is in being developed. The API might change. See the examples in the plugins directory. The general idea is that they are mixins that augment the BookReader prototype. See the plugins directory for all the included plugins, but here are some examples: - -- plugins.chapters.js - render chapter markers -- plugins.search.js - add search ui, and callbacks -- plugins.tts.js - add tts (read aloud) ui, sound library, and callbacks -- plugins.url.js - automatically updates the browser url -- plugins.resume.js - uses cookies to remember the current page - - ## License The source code license is AGPL v3, as described in the LICENSE file. The mobile menu is built with [mmenu](http://mmenu.frebsite.nl/download.html), which is free for personal and non-profit use. However, for commmercial use, a license must be purchased. -Alternatively, the mobile mmenu can be disabled with `br.enableMobileNav = false;`. +To use it, include the script `plugins/plugin.mobile_nav.js`. ## Other credits