Merge pull request #1279 from cdrini/feature/ia-toc

Make chapters plugin support table_of_contents in options

Author: cdrini

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,

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;
     }

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 })

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,23 +36,34 @@ 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" },
     "title": "THE COUNTRY AND THE MISSION 2",
   },
 ];
 
+/** @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,14 +105,49 @@ 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(),
       };
       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', () => {