@internetarchive/bookreader 5.0.0-92 → 5.0.0-94

package/BookReaderDemo/IADemoBr.js

@@ -45,23 +45,6 @@ BookReader.optionOverrides.imagesBaseURL = '/BookReader/images/';
 const initializeBookReader = (brManifest) => {
   console.log('initializeBookReader', brManifest);
 
-  const {bookPath, subPrefix} = brManifest.data.brOptions;
-  let path = bookPath;
-  const subPrefixWithSlash = `/${subPrefix}`;
-  if (bookPath.length - bookPath.lastIndexOf(subPrefixWithSlash) == subPrefixWithSlash.length) {
-    path = bookPath.substr(0, bookPath.length - subPrefixWithSlash.length);
-  }
-
-  const searchInsideUrl = '//{{server}}/fulltext/inside.php?' + [
-    'item_id={{bookId|urlencode}}',
-    'doc={{subPrefix|urlencode}}',
-    'q={{query|urlencode}}',
-    // This endpoint doesn't expect the path to be url encoded
-    `path=${encodeURIComponent(path).replace(/%2F/g, '/')}`,
-    'pre_tag={{preTag|urlencode}}',
-    'post_tag={{postTag|urlencode}}',
-  ].join('&');
-
   const options = {
     el: '#BookReader',
     /* Url plugin - IA uses History mode for URL */
@@ -74,6 +57,7 @@ const initializeBookReader = (brManifest) => {
     // urlTrackedParams: ['page', 'search', 'mode'],
     /* End url plugin */
     enableBookTitleLink: false,
+    bookUri: `https://archive.org/details/${ocaid}`,
     bookUrlText: null,
     startFullscreen: openFullImmersionTheater,
     // leaving this option commented out bc we change given user agent on archive.org
@@ -86,16 +70,9 @@ const initializeBookReader = (brManifest) => {
     /* End multiple volumes */
     enableBookmarks: true, // turn this on
     enableFSLogoShortcut: true,
-
-    // TMP: To be replaced once BookReaderJSIA is updated to provide
-    // these in the right spot.
     plugins: {
       search: {
-        enabled: true,
         initialSearchTerm: searchTerm ? searchTerm : '',
-        searchInsideUrl,
-        preTag: brManifest.data.brOptions.searchInsidePreTag,
-        postTag: brManifest.data.brOptions.searchInsidePostTag,
       },
     },
   };

package/BookReaderDemo/demo-internetarchive.html

@@ -30,6 +30,7 @@
     <script src="../BookReader/plugins/plugin.resume.js"></script>
     <script src="../BookReader/plugins/plugin.archive_analytics.js"></script>
     <script src="../BookReader/plugins/plugin.text_selection.js"></script>
+    <script src="../BookReader/plugins/plugin.experiments.js"></script>
 
     <script type="module" src="../BookReader/ia-bookreader-bundle.js"></script>
 

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# 5.0.0-94
+- Refactor: Make bookreader package type: module @cdrini
+- Fix: Search icon being fetched from wrong path @cdrini
+- Refactor: Move BookReader._plugins -> BookReader.plugins , making it public @cdrini
+- Feature: Add length restrictions for protected text selection @cdrini
+- Extend BR to work correctly with Hypothesis @cdrini
+  - Creates new experiments plugin, with a Hypothesis experiment
+  - Adds no `bookUri` option for saving Hypothesis annotations
+  - Adds new public HTML attributes to the PageContainer DOM, `data-index` for `PageIndex`, and `data-page-num` for `PageNumString`
+  - Improves some of BookReader's public APIs. BookReader.bind/unbind are now deprecated in favor of BookReader.on/off
+
+# 5.0.0-93
+- Fix: Clicking on search result not making request_page request correctly @cdrini
+
 # 5.0.0-92
 - Refactor: Migrate search plugin to BookReaderPlugin system @cdrini
   - Breaking changes:

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@internetarchive/bookreader",
-  "version": "5.0.0-92",
+  "version": "5.0.0-94",
   "description": "The Internet Archive BookReader.",
+  "type": "module",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/internetarchive/bookreader.git"
@@ -58,6 +59,7 @@
     "eslint-plugin-no-jquery": "^2.7.0",
     "eslint-plugin-testcafe": "^0.2.1",
     "http-server": "14.1.1",
+    "hypothesis": "^1.1627.0",
     "interactjs": "^1.10.18",
     "iso-language-codes": "1.1.0",
     "jest": "29.7.0",
@@ -99,16 +101,18 @@
     "preversion": "npm run test && node scripts/preversion.js",
     "version": "node scripts/version.js",
     "postversion": "node scripts/postversion.js",
-    "build": "npm run clean && npx concurrently --group npm:build-js npm:build-css npm:build-assets",
+    "build": "npm run clean && npx concurrently --group npm:build-js npm:build-css npm:build-assets npm:build-hypothesis",
     "build-assets": "npx cpx \"src/assets/**/*\" BookReader && npx svgo -f BookReader/icons && npx svgo -f BookReader/images",
     "build-assets:watch": "npx cpx --watch --verbose \"src/assets/**/*\" BookReader",
+    "build-hypothesis": "npx cpx \"node_modules/hypothesis/**/*\" BookReader/hypothesis",
+    "build-hypothesis:watch": "npx cpx --watch --verbose \"node_modules/hypothesis/**/*\" BookReader/hypothesis",
     "build-js": "npx webpack",
     "build-js:watch": "npx webpack --mode=development --watch",
     "build-css": "npx sass --no-source-map ./src/css/BookReader.scss ./BookReader/BookReader.css",
     "build-css:watch": "npx sass --watch --no-source-map ./src/css/BookReader.scss ./BookReader/BookReader.css",
     "clean": "rm -r BookReader/ || true",
-    "lint": "npx eslint src/ tests/ *.js",
-    "lint:fix": "npx eslint --fix src/ tests/ *.js",
+    "lint": "npx eslint src/ tests/ *.js *.cjs",
+    "lint:fix": "npx eslint --fix src/ tests/ *.js *.cjs",
     "serve": "npx http-server . --port=8000",
     "serve-live": "npx live-server . --cors --port=8000 --watch=index.html,BookReader,BookReaderDemo",
     "serve-dev": "env NODE_ENV='development' npm run build-css && env NODE_ENV='development' npx concurrently --kill-others npm:serve-live npm:build-*:watch",

package/scripts/postversion.js

@@ -1,5 +1,6 @@
-const fs = require('fs');
-const { version: NEW_VERSION } = require('../package.json');
+import fs from 'fs';
+import PACKAGE_JSON from '../package.json' assert { type: 'json' };
+const NEW_VERSION = PACKAGE_JSON.version;
 
 const tag = `v${NEW_VERSION}`;
 const releaseBody = fs.readFileSync('CHANGELOG.md').toString()

package/scripts/preversion.js

@@ -1,4 +1,6 @@
-const { version: OLD_VERSION } = require('../package.json');
+import PACKAGE_JSON from '../package.json' assert { type: 'json' };
+
+const OLD_VERSION = PACKAGE_JSON.version;
 const OLD_RELEASE_URL = `https://api.github.com/repos/internetarchive/bookreader/releases/tags/v${OLD_VERSION}`;
 
 async function main() {

package/scripts/version.js

@@ -1,6 +1,7 @@
-const fs = require('fs');
-const { execSync } = require('child_process');
-const { version: NEW_VERSION } = require('../package.json');
+import fs from 'fs';
+import { execSync } from 'child_process';
+import PACKAGE_JSON from '../package.json' assert { type: 'json' };
+const NEW_VERSION = PACKAGE_JSON.version;
 
 async function main() {
     // Update the changelog

package/src/BookNavigator/book-navigator.js

@@ -10,6 +10,7 @@ import BookmarksProvider from './bookmarks/bookmarks-provider.js';
 import SharingProvider from './sharing.js';
 import ViewableFilesProvider from './viewable-files.js';
 import iaLogo from './assets/ia-logo.js';
+import { sortBy } from '../BookReader/utils.js';
 /** @typedef {import('@/src/BookReader.js').default} BookReader */
 
 const events = {
@@ -51,7 +52,20 @@ export class BookNavigator extends LitElement {
     this.isAdmin = false;
     this.lendingInitialized = false;
     this.lendingStatus = {};
-    this.menuProviders = {};
+    this.menuProviders = {
+      /** @type {BookmarksProvider} */
+      bookmarks: null,
+      /** @type {SearchProvider} */
+      search: null,
+      /** @type {DownloadProvider} */
+      downloads: null,
+      /** @type {VisualAdjustmentProvider} */
+      visualAdjustments: null,
+      /** @type {SharingProvider} */
+      share: null,
+      /** @type {ViewableFilesProvider} */
+      volumes: null,
+    };
     this.menuShortcuts = [];
     this.signedIn = false;
     /** @type {ModalManager} */
@@ -73,6 +87,10 @@ export class BookNavigator extends LitElement {
       'chapters',
       'search',
       'bookmarks',
+      'downloads',
+      'visualAdjustments',
+      'share',
+      'experiments',
     ];
   }
 
@@ -313,14 +331,20 @@ export class BookNavigator extends LitElement {
    * Sets order of menu and emits custom event when done
    */
   updateMenuContents() {
-    const {
-      search, downloads, visualAdjustments, share, bookmarks, volumes, chapters,
-    } = this.menuProviders;
-    const availableMenus = [volumes, chapters, search, bookmarks, visualAdjustments, share].filter((menu) => !!menu);
+    const availableMenus = sortBy(
+      Object.entries(this.menuProviders)
+        .filter(([id, menu]) => !!menu)
+        .filter(([id, menu]) => {
+          return id === 'downloads' ? this.shouldShowDownloadsMenu() : true;
+        }),
+      ([id, menu]) => {
+        const index = this.shortcutOrder.indexOf(id);
+        return index === -1 ? this.shortcutOrder.length : index;
+      },
+    ).map(([id, menu]) => menu);
 
     if (this.shouldShowDownloadsMenu()) {
-      downloads?.update(this.downloadableTypes);
-      availableMenus.splice(-2, 0, downloads);
+      this.menuProviders.downloads?.update(this.downloadableTypes);
     }
 
     const event = new CustomEvent(
@@ -387,11 +411,13 @@ export class BookNavigator extends LitElement {
    * the id in each iteration over the shortcutOrder array.
    */
   sortMenuShortcuts() {
-    this.menuShortcuts = this.shortcutOrder.reduce((shortcuts, id) => {
-      const menu = this.menuShortcuts.find((m) => m.id === id);
-      if (menu) { shortcuts.push(menu); }
-      return shortcuts;
-    }, []);
+    this.menuShortcuts = sortBy(
+      this.menuShortcuts,
+      (shortcut) => {
+        const index = this.shortcutOrder.indexOf(shortcut.id);
+        return index === -1 ? this.shortcutOrder.length : index;
+      },
+    );
   }
 
   emitMenuShortcutsUpdated() {

package/src/BookNavigator/downloads/downloads-provider.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
-import '@internetarchive/icon-dl/icon-dl';
-import './downloads';
+import '@internetarchive/icon-dl/icon-dl.js';
+import './downloads.js';
 
 const menuBase = {
   pdf: {

package/src/BookNavigator/search/search-provider.js

@@ -1,7 +1,7 @@
 // @ts-check
 import { html, nothing } from 'lit';
-import '@internetarchive/icon-search/icon-search';
-import './search-results';
+import '@internetarchive/icon-search/icon-search.js';
+import './search-results.js';
 /** @typedef {import('@/src/plugins/search/plugin.search.js').SearchInsideMatch} SearchInsideMatch */
 /** @typedef {import('@/src/plugins/search/plugin.search.js').SearchInsideResults} SearchInsideResults */
 /** @typedef {import('@/src/BookReader.js').default} BookReader */
@@ -143,7 +143,7 @@ export default class SearchProvider {
   }
 
   searchCanceledInMenu() {
-    this.bookreader._plugins.search.cancelSearchRequest();
+    this.bookreader.plugins.search.cancelSearchRequest();
   }
 
   onSearchResultsCleared() {
@@ -155,7 +155,7 @@ export default class SearchProvider {
       errorMessage: '',
     };
     this.updateMenu({ openMenu: false });
-    this.bookreader._plugins.search.searchView.clearSearchFieldAndResults(false);
+    this.bookreader.plugins.search.searchView.clearSearchFieldAndResults(false);
     if (this.bookreader.urlPlugin) {
       this.updateSearchInUrl();
     }
@@ -204,6 +204,6 @@ export default class SearchProvider {
    * @param {{ detail: {match: SearchInsideMatch} }} param0
    */
   onSearchResultsClicked({ detail }) {
-    this.bookreader._plugins.search.jumpToMatch(detail.match.matchIndex);
+    this.bookreader.plugins.search.jumpToMatch(detail.match.matchIndex);
   }
 }

package/src/BookNavigator/search/search-results.js

@@ -1,7 +1,7 @@
 /* eslint-disable class-methods-use-this */
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { css, html, LitElement, nothing } from 'lit';
-import '@internetarchive/ia-activity-indicator/ia-activity-indicator';
+import '@internetarchive/ia-activity-indicator/ia-activity-indicator.js';
 import checkmarkIcon from '../assets/icon_checkmark.js';
 import closeIcon from '../assets/icon_close.js';
 import buttonCSS from '../assets/button-base.js';

package/src/BookNavigator/sharing.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
-import { iauxShareIcon } from '@internetarchive/ia-item-navigator/dist/src/menus/share-panel';
-import '@internetarchive/ia-item-navigator/dist/src/menus/share-panel';
+import { iauxShareIcon } from '@internetarchive/ia-item-navigator/dist/src/menus/share-panel.js';
+import '@internetarchive/ia-item-navigator/dist/src/menus/share-panel.js';
 
 export default class SharingProvider {
   constructor({

package/src/BookNavigator/viewable-files.js

@@ -1,7 +1,7 @@
 import { html } from 'lit';
 
-import { viewableFilesIcon  } from '@internetarchive/ia-item-navigator/dist/src/menus/viewable-files';
-import '@internetarchive/ia-item-navigator/dist/src/menus/viewable-files';
+import { viewableFilesIcon  } from '@internetarchive/ia-item-navigator/dist/src/menus/viewable-files.js';
+import '@internetarchive/ia-item-navigator/dist/src/menus/viewable-files.js';
 
 /**
  * * @typedef { 'title_asc' | 'title_desc' | 'default'} SortTypesT

package/src/BookNavigator/visual-adjustments/visual-adjustments-provider.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
-import '@internetarchive/icon-visual-adjustment/icon-visual-adjustment';
-import './visual-adjustments';
+import '@internetarchive/icon-visual-adjustment/icon-visual-adjustment.js';
+import './visual-adjustments.js';
 
 const visualAdjustmentOptions = [{
   id: 'brightness',
@@ -45,7 +45,7 @@ export default class VisualAdjustmentsProvider {
     this.icon = html`<ia-icon-visual-adjustment style="width: var(--iconWidth); height: var(--iconHeight);"></ia-icon-visual-adjustment>`;
     this.label = 'Visual Adjustments';
     this.menuDetails = this.updateOptionsCount();
-    this.id = 'adjustment';
+    this.id = 'visualAdjustments';
     this.component = html`
       <ia-book-visual-adjustments
         .options=${visualAdjustmentOptions}

package/src/BookNavigator/visual-adjustments/visual-adjustments.js

@@ -2,8 +2,8 @@ import { css, html, LitElement } from "lit";
 import { repeat } from "lit/directives/repeat.js";
 import { nothing } from "lit";
 import checkmarkIcon from '../assets/icon_checkmark.js';
-import "@internetarchive/icon-magnify-minus/icon-magnify-minus";
-import "@internetarchive/icon-magnify-plus/icon-magnify-plus";
+import "@internetarchive/icon-magnify-minus/icon-magnify-minus.js";
+import "@internetarchive/icon-magnify-plus/icon-magnify-plus.js";
 
 const namespacedEvent = (eventName) => `visualAdjustment${eventName}`;
 

package/src/BookReader/BookModel.js

@@ -461,6 +461,15 @@ export class PageModel {
     return this.book.getPageURI(this.index, reduce, rotate);
   }
 
+  /**
+   * Return the asserted page number for this page, or, if one is not
+   * present, the n-prefixed page index.
+   * @returns {PageNumString}
+   */
+  getPageNum() {
+    return this.book.getPageNum(this.index);
+  }
+
   /**
    * Returns the srcset with correct URIs or void string if out of range
    * @param {number} reduce
@@ -539,12 +548,13 @@ export class PageModel {
 // There are a few main ways we can reference a specific page in a book:
 /**
  * @typedef {string} PageNumString
- * Possible values: /^n?\d+$/. Example: 'n7', '18'
- * Not necessarily unique
+ * The way page numbers are usually displayed in the UI. Either
+ * an asserted page number if the book has one (e.g. '18', or 'A-1'),
+ * or the n-prefixed 0-based index (e.g. 'n7')
  */
 /**
  * @typedef {number} LeafNum
- * No clue if 0 or 1 indexed or consecutive; generally from IA book info.
+ * Internal number to IA scans. Can be 0 or 1 indexed. Unclear it it's consecutive.
  */
 /**
  * @typedef {string} PageString

package/src/BookReader/ImageCache.js

@@ -9,8 +9,8 @@
 /** @typedef {import("./ReduceSet").ReduceSet} ReduceSet */
 /** @typedef {import("./options").BookReaderOptions} BookReaderOptions */
 
-import { Pow2ReduceSet } from "./ReduceSet";
-import { DEFAULT_OPTIONS } from "./options";
+import { Pow2ReduceSet } from "./ReduceSet.js";
+import { DEFAULT_OPTIONS } from "./options.js";
 
 export class ImageCache {
   /**

package/src/BookReader/Mode1Up.js

@@ -6,6 +6,8 @@ import { DragScrollable } from './DragScrollable.js';
 /** @typedef {import('./BookModel.js').PageIndex} PageIndex */
 
 export class Mode1Up {
+  name = '1up'
+
   /**
    * @param {BookReader} br
    * @param {BookModel} bookModel

package/src/BookReader/Mode1UpLit.js

@@ -2,11 +2,11 @@
 import { customElement, property, query } from 'lit/decorators.js';
 import {LitElement, html} from 'lit';
 import { styleMap } from 'lit/directives/style-map.js';
-import { ModeSmoothZoom } from './ModeSmoothZoom';
-import { arrChanged, genToArray, sum, throttle } from './utils';
-import { HTMLDimensionsCacher } from "./utils/HTMLDimensionsCacher";
-import { ScrollClassAdder } from './utils/ScrollClassAdder';
-import { ModeCoordinateSpace } from './ModeCoordinateSpace';
+import { ModeSmoothZoom } from './ModeSmoothZoom.js';
+import { arrChanged, genToArray, sum, throttle } from './utils.js';
+import { HTMLDimensionsCacher } from "./utils/HTMLDimensionsCacher.js";
+import { ScrollClassAdder } from './utils/ScrollClassAdder.js';
+import { ModeCoordinateSpace } from './ModeCoordinateSpace.js';
 /** @typedef {import('./BookModel').BookModel} BookModel */
 /** @typedef {import('./BookModel').PageIndex} PageIndex */
 /** @typedef {import('./BookModel').PageModel} PageModel */

package/src/BookReader/Mode2Up.js

@@ -6,6 +6,8 @@ import { DragScrollable } from './DragScrollable.js';
 /** @typedef {import('./BookModel.js').PageIndex} PageIndex */
 
 export class Mode2Up {
+  name = '2up';
+
   /**
    * @param {BookReader} br
    * @param {BookModel} bookModel

package/src/BookReader/Mode2UpLit.js

@@ -2,11 +2,11 @@
 import { customElement, property, query } from 'lit/decorators.js';
 import {LitElement, html} from 'lit';
 import { styleMap } from 'lit/directives/style-map.js';
-import { ModeSmoothZoom } from './ModeSmoothZoom';
-import { arrChanged, promisifyEvent } from './utils';
-import { HTMLDimensionsCacher } from "./utils/HTMLDimensionsCacher";
-import { PageModel } from './BookModel';
-import { ModeCoordinateSpace } from './ModeCoordinateSpace';
+import { ModeSmoothZoom } from './ModeSmoothZoom.js';
+import { arrChanged, promisifyEvent } from './utils.js';
+import { HTMLDimensionsCacher } from "./utils/HTMLDimensionsCacher.js";
+import { PageModel } from './BookModel.js';
+import { ModeCoordinateSpace } from './ModeCoordinateSpace.js';
 /** @typedef {import('./BookModel').BookModel} BookModel */
 /** @typedef {import('./BookModel').PageIndex} PageIndex */
 /** @typedef {import('./ModeSmoothZoom').SmoothZoomable} SmoothZoomable */

package/src/BookReader/ModeCoordinateSpace.js

@@ -1,4 +1,4 @@
-import { calcScreenDPI } from './utils';
+import { calcScreenDPI } from './utils.js';
 
 /**
  * There are a few different "coordinate spaces" at play in BR:

package/src/BookReader/ModeThumb.js

@@ -9,6 +9,8 @@ import { DragScrollable } from './DragScrollable.js';
 /** @typedef {JQuery} $lazyLoadImgPlaceholder * jQuery element with data attributes: leaf, reduce */
 
 export class ModeThumb {
+  name = 'thumb'
+
   /**
    * @param {BookReader} br
    * @param {BookModel} bookModel

package/src/BookReader/PageContainer.js

@@ -18,7 +18,10 @@ export class PageContainer {
     this.$container = $('<div />', {
       'class': `BRpagecontainer ${page ? `pagediv${page.index}` : 'BRemptypage'}`,
       css: { position: 'absolute' },
-    }).attr('data-side', page?.pageSide);
+    })
+      .attr('data-side', page?.pageSide)
+      .attr('data-index', page?.index)
+      .attr('data-page-num', page?.getPageNum());
 
     if (isProtected) {
       this.$container.append($('<div class="BRscreen" />'));

package/src/BookReader/Toolbar/Toolbar.js

@@ -60,7 +60,7 @@ export class Toolbar {
     }
 
     // Call _bindNavigationHandlers on the plugins
-    for (const plugin of Object.values(br._plugins)) {
+    for (const plugin of Object.values(br.plugins)) {
       plugin._configureToolbar(br.refs.$BRtoolbar);
     }
 

package/src/BookReader/options.js

@@ -97,6 +97,11 @@ export const DEFAULT_OPTIONS = {
   /** @type {string} */
   bookUrlTitle: null,
   enableBookTitleLink: true,
+  /**
+   * @type {string} A globally unique URI for the book. This is used to
+   * save data like annotations the user makes to the book.
+   */
+  bookUri: null,
   /**
    * @type {string} language in ISO 639-1 (PRIVATE: Will also
    * handle language name in English, native name, 639-2/T, or 639-2/B . (archive.org books

package/src/BookReader/utils/HTMLDimensionsCacher.js

@@ -1,5 +1,5 @@
 // @ts-check
-import { debounce } from '../utils';
+import { debounce } from '../utils.js';
 
 /**
  * Computing these things repeatedly is expensive (the browser needs to

package/src/BookReader/utils.js

@@ -298,3 +298,16 @@ export function parseAnimationSpeed(speed) {
   if (speed === 'fast') return 200;
   return parseInt(speed, 10);
 }
+
+/**
+ * @template T
+ * @param {T[]} array
+ * @param {function(T): number} [valueFn]
+ */
+export function sortBy(array, valueFn) {
+  return array.sort((a, b) => {
+    const aValue = valueFn ? valueFn(a) : a;
+    const bValue = valueFn ? valueFn(b) : b;
+    return aValue < bValue ? -1 : aValue > bValue ? 1 : 0;
+  });
+}