@internetarchive/bookreader 5.0.0-72 → 5.0.0-73-alpha1

package/CHANGELOG.md

@@ -1,3 +1,8 @@
+# 5.0.0-73
+- Feature: Add `table_of_contents` option to work with chapters plugin @cdrini
+- Fix: Simple demos not working @xonx4l
+- Dev: Update test/build dependencies @cdrini
+
 # 5.0.0-72
 - Fix: Play/pause button out of sync with ReadAloud @sbwhitt
 - Fix: BookReader not loading in sandboxed iframe @cdrini
@@ -647,7 +652,7 @@ be no observable changes, but note this was a big change.
 
 # 4.2.5
 - Large refactor of plugin.tts.js
-- ES6 compliation step
+- ES6 compilation step
 - Known bug: Clicking on page while TTS is playing won't stop the playback
 
 # 4.2.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/bookreader",
-  "version": "5.0.0-72",
+  "version": "5.0.0-73-alpha1",
   "description": "The Internet Archive BookReader.",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
   "private": false,
   "dependencies": {
     "@internetarchive/ia-activity-indicator": "^0.0.4",
-    "@internetarchive/ia-item-navigator": "^2.0.3",
+    "@internetarchive/ia-item-navigator": "^2.0.3-alpha2",
     "@internetarchive/icon-bookmark": "^1.3.4",
     "@internetarchive/icon-dl": "^1.3.4",
     "@internetarchive/icon-edit-pencil": "^1.3.4",
@@ -40,18 +40,18 @@
     "lit": "^2.5.0"
   },
   "devDependencies": {
-    "@babel/core": "7.22.9",
-    "@babel/eslint-parser": "7.22.9",
+    "@babel/core": "7.23.3",
+    "@babel/eslint-parser": "7.23.3",
     "@babel/plugin-proposal-class-properties": "7.18.6",
-    "@babel/plugin-proposal-decorators": "7.22.7",
-    "@babel/preset-env": "7.22.9",
-    "@open-wc/testing-helpers": "^2.3.0",
-    "@types/jest": "29.5.6",
+    "@babel/plugin-proposal-decorators": "7.23.3",
+    "@babel/preset-env": "7.23.3",
+    "@open-wc/testing-helpers": "3.0.0",
+    "@types/jest": "29.5.10",
     "@webcomponents/webcomponentsjs": "^2.6.0",
     "babel-loader": "9.1.3",
     "codecov": "^3.8.3",
-    "concurrently": "7.6.0",
-    "core-js": "3.27.1",
+    "concurrently": "8.2.2",
+    "core-js": "3.33.3",
     "cpx2": "4.2.3",
     "eslint": "^7.32.0",
     "eslint-plugin-no-jquery": "^2.7.0",
@@ -67,14 +67,14 @@
     "jquery-ui-touch-punch": "0.2.3",
     "jquery.browser": "0.1.0",
     "live-server": "1.2.2",
-    "regenerator-runtime": "0.13.11",
-    "sass": "1.64.2",
-    "sinon": "^17.0.0",
+    "regenerator-runtime": "0.14.0",
+    "sass": "1.69.5",
+    "sinon": "17.0.1",
     "soundmanager2": "2.97.20170602",
-    "svgo": "3.0.2",
-    "testcafe": "2.6.2",
+    "svgo": "3.0.4",
+    "testcafe": "3.4.0",
     "testcafe-browser-provider-browserstack": "^1.13.2-alpha.1",
-    "webpack": "5.88.2",
+    "webpack": "5.89.0",
     "webpack-cli": "5.1.4"
   },
   "jest": {

package/src/BookReader/options.js

@@ -180,6 +180,9 @@ export const DEFAULT_OPTIONS = {
    */
   data: [],
 
+  /** @type {import('../plugins/plugin.chapters.js').TocEntry[]} */
+  table_of_contents: null,
+
   /** Advanced methods for page rendering */
   /** @type {() => number} */
   getNumLeafs: null,

package/src/css/_BRsearch.scss

@@ -9,8 +9,7 @@
   display: none;
   position: absolute;
   bottom: calc(100% + 5px);
-  left: 50%;
-  transform: translateX(-50%);
+  left: -14px;
   width: 350px;
   max-width: 100vw;
   padding: 12px 14px;
@@ -34,9 +33,7 @@
     position: absolute;
     content: "";
     bottom: -9px;
-    left: 50%;
-    margin-left: -1px;
-    transform: translateX(-50%);
+    left: 0;
     width: 30px;
     height: 10px;
     clip-path: polygon(0 0, 100% 0, 50% 100%);
@@ -131,9 +128,10 @@
     main {
       @include ellipsis-lines(4);
       margin-bottom: 6px;
+      &:before { content: "“"; }
+      &:after { content: "”"; }
     }
     footer {
-      text-align: center;
       font-size: 0.85em;
       opacity: .8;
     }

package/src/plugins/plugin.chapters.js

@@ -28,11 +28,28 @@ BookReader.prototype.init = (function(super_) {
 })(BookReader.prototype.init);
 
 BookReader.prototype._chapterInit = async function() {
-  const olEdition = await this.getOpenLibraryRecord(this.options.olHost, this.options.bookId);
-  if (olEdition?.table_of_contents?.length) {
-    this._tocEntries = olEdition.table_of_contents.map(rawTOCEntry => (
-      Object.assign({}, rawTOCEntry, {pageIndex: this.book.getPageIndex(rawTOCEntry.pagenum)})
-    ));
+  let rawTableOfContents = null;
+  // Prefer IA TOC for now, until we update the second half to check for
+  // `openlibrary_edition` on the IA metadata instead of making a bunch of
+  // requests to OL.
+  if (this.options.table_of_contents?.length) {
+    rawTableOfContents = this.options.table_of_contents;
+  } else {
+    const olEdition = await this.getOpenLibraryRecord(this.options.olHost, this.options.bookId);
+    if (olEdition?.table_of_contents?.length) {
+      rawTableOfContents = olEdition.table_of_contents;
+    }
+  }
+
+  if (rawTableOfContents) {
+    this._tocEntries = rawTableOfContents
+      .map(rawTOCEntry => (Object.assign({}, rawTOCEntry, {
+        pageIndex: (
+          typeof(rawTOCEntry.leaf) == 'number' ? this.book.leafNumToIndex(rawTOCEntry.leaf) :
+            rawTOCEntry.pagenum ? this.book.getPageIndex(rawTOCEntry.pagenum) :
+              undefined
+        ),
+      })));
     this._chaptersRender(this._tocEntries);
     this.bind(BookReader.eventNames.pageChanged, () => this._chaptersUpdateCurrent());
   }
@@ -60,19 +77,18 @@ BookReader.prototype._chaptersRender = function() {
     />`,
   };
   shell.updateMenuContents();
-  for (const tocEntry of this._tocEntries) {
-    this._chaptersRenderMarker(tocEntry);
-  }
+  this._tocEntries.forEach((tocEntry, i) => this._chaptersRenderMarker(tocEntry, i));
 };
 
 /**
  * @typedef {Object} TocEntry
  * Table of contents entry as defined by Open Library, with some extra values for internal use
- * @property {string} pagenum
- * @property {number} level
- * @property {string} label
- * @property {string} title
- * @property {number} pageIndex - Added
+ * @property {number} [level]
+ * @property {string} [label]
+ * @property {string} [title]
+ * @property {PageString} [pagenum]
+ * @property {LeafNum} [leaf]
+ * @property {number} [pageIndex] - Added
  *
  * @example {
  *   "pagenum": "17",
@@ -84,21 +100,25 @@ BookReader.prototype._chaptersRender = function() {
 
 /**
  * @param {TocEntry} tocEntry
+ * @param {number} entryIndex
  */
-BookReader.prototype._chaptersRenderMarker = function(tocEntry) {
+BookReader.prototype._chaptersRenderMarker = function(tocEntry, entryIndex) {
   if (tocEntry.pageIndex == undefined) return;
 
   //creates a string with non-void tocEntry.label and tocEntry.title
   const chapterStr = [tocEntry.label, tocEntry.title]
     .filter(x => x)
-    .join(' ');
+    .join(' ') || `Chapter ${entryIndex + 1}`;
 
   const percentThrough = BookReader.util.cssPercentage(tocEntry.pageIndex, this.book.getNumLeafs() - 1);
   $(`<div></div>`)
     .append(
       $('<div />')
         .text(chapterStr)
-        .append($('<div class="BRchapterPage" />').text(`Page ${tocEntry.pagenum}`))
+        .append(
+          $('<div class="BRchapterPage" />')
+            .text(this.book.getPageName(tocEntry.pageIndex))
+        )
     )
     .addClass('BRchapter')
     .css({ left: percentThrough })

package/tests/jest/plugins/plugin.chapters.test.js

@@ -4,7 +4,9 @@ import BookReader from "@/src/BookReader.js";
 import "@/src/plugins/plugin.chapters.js";
 import { BookModel } from "@/src/BookReader/BookModel";
 import { deepCopy } from "../utils";
+/** @typedef {import('@/src/plugins/plugin.chapters').TocEntry} TocEntry  */
 
+/** @type {TocEntry[]} */
 const SAMPLE_TOC = [{
   "pagenum": "3",
   "level": 1,
@@ -34,16 +36,15 @@ const SAMPLE_TOC = [{
   "pageIndex": 40,
 }];
 
+/** @type {TocEntry[]} */
 const SAMPLE_TOC_UNDEF = [
   {
-    "pagenum": "undefined",
     "level": 1,
     "label": "CHAPTER I",
     "type": { "key": "/type/toc_item" },
     "title": "THE COUNTRY AND THE MISSION 1",
   },
   {
-    "pagenum": "undefined",
     "level": 1,
     "label": "CHAPTER II",
     "type": { "key": "/type/toc_item" },
@@ -51,6 +52,18 @@ const SAMPLE_TOC_UNDEF = [
   },
 ];
 
+/** @type {TocEntry[]} */
+const SAMPLE_TOC_OPTION = [
+  {
+    "level": 1,
+    "title": "THE COUNTRY AND THE MISSION 1",
+  },
+  {
+    "level": 1,
+    "title": "THE COUNTRY AND THE MISSION 2",
+  },
+];
+
 afterEach(() => {
   sinon.restore();
 });
@@ -92,7 +105,7 @@ describe("BRChaptersPlugin", () => {
         },
         getOpenLibraryRecord: async () => ({
           "title": "The Adventures of Sherlock Holmes",
-          "table_of_contents": deepCopy(SAMPLE_TOC_UNDEF),
+          "table_of_contents": deepCopy(SAMPLE_TOC_OPTION),
           "ocaid": "adventureofsherl0000unse",
         }),
         _chaptersRender: sinon.stub(),
@@ -100,6 +113,41 @@ describe("BRChaptersPlugin", () => {
       await BookReader.prototype._chapterInit.call(fakeBR);
       expect(fakeBR._chaptersRender.callCount).toBe(1);
     });
+
+    test("does not fetch open library record if table of contents in options", async () => {
+      const fakeBR = {
+        options: {
+          table_of_contents: deepCopy(SAMPLE_TOC_UNDEF),
+        },
+        bind: sinon.stub(),
+        getOpenLibraryRecord: sinon.stub(),
+        _chaptersRender: sinon.stub(),
+      };
+      await BookReader.prototype._chapterInit.call(fakeBR);
+      expect(fakeBR.getOpenLibraryRecord.callCount).toBe(0);
+      expect(fakeBR._chaptersRender.callCount).toBe(1);
+    });
+
+    test("converts leafs and pagenums to page index", async () => {
+      const table_of_contents = deepCopy(SAMPLE_TOC_UNDEF);
+      table_of_contents[0].leaf = 0;
+      table_of_contents[1].pagenum = '17';
+      const fakeBR = {
+        options: {
+          table_of_contents,
+        },
+        bind: sinon.stub(),
+        book: {
+          leafNumToIndex: (leaf) => leaf + 1,
+          getPageIndex: (str) => parseFloat(str),
+        },
+        _chaptersRender: sinon.stub(),
+      };
+      await BookReader.prototype._chapterInit.call(fakeBR);
+      expect(fakeBR._chaptersRender.callCount).toBe(1);
+      expect(fakeBR._tocEntries[0].pageIndex).toBe(1);
+      expect(fakeBR._tocEntries[1].pageIndex).toBe(17);
+    });
   });
 
   describe('_chaptersRender', () => {