@internetarchive/bookreader 5.0.0-8 → 5.0.0-80

package/README.md

@@ -123,7 +123,7 @@ A peek in how to use/extend core functionality:
     - plugin.url.js - automatically updates the browser url
     - plugin.resume.js - uses cookies to remember the current page
     - plugin.vendor-fullscreen.js - replaces fullscreen mode with vendor native fullscreen
-    - see plugin directory for current plugin files ()[https://github.com/internetarchive/bookreader/tree/master/src/plugins]
+    - see [plugin directory for current plugin files](https://github.com/internetarchive/bookreader/tree/master/src/plugins)
 
 ### Embedding BookReader in an iFrame
 
@@ -149,6 +149,19 @@ The source JavaScript is written in ES6 (located in the `src/js` directory) and
 
 Until the next major version bump, we have to store the build files inside the repo to maintain backwards compatibility. Please _DO NOT_ include these files in your PR. Anything in the `BookReader/` directory should not be committed.
 
+### Developing icons
+To see local icon package changes in bookreader, you'll need to install core-js into the icon package and link into bookreader.
+
+Let's use `icon-share` as an example.
+1.  Confirm your icon package is working properly in the iaux-icons demo
+2.  Navigate to your icon package (`iaux-icons/packages/icon-share`) and run command: `npm install core-js`
+    -  You shouldn't need to commit any of these core-js changes
+3.  From within your icon package directory run command: `npm link`
+    -  You can use the command `npm ls -g` to confirm your local package now appears in the registry
+4.  Navigate to `/bookreader` and run command: `npm link @internetarchive/icon-share`
+    -  You can use the command `npm ls |grep icon-share` to confirm icon-share is now a link to your local directory
+5. You may now start a local server to see your changes by running command: `npm run serve-dev`
+
 ## Releases
 
 To version bump the repo and prepare a release, run `npm version major|minor|patch` (following [semver](https://semver.org/)), then (something like) `git push origin HEAD --tags`. It'll automatically update the version number where it appears, build the files, and ask you to update the CHANGELOG.

package/babel.config.js

@@ -0,0 +1,20 @@
+module.exports = {
+  presets: [
+    [
+      "@babel/preset-env",
+      process.env.NODE_ENV == "test" ? { targets: { node: process.version } } :
+        process.env.NODE_ENV == "development" ? { targets: "last 2 Chrome versions, last 2 Firefox versions, last 2 Safari versions, last 2 Edge versions" } : {
+          targets: "> 2%, ie 11, edge 14, samsung > 9, OperaMini all, UCAndroid > 12, Safari >= 9",
+          useBuiltIns: "usage",
+          corejs: 3
+        }
+    ]
+  ],
+  plugins: [
+    ["@babel/plugin-proposal-decorators", {
+      version: "2018-09",
+      decoratorsBeforeExport: true
+    }],
+    ["@babel/plugin-proposal-class-properties"],
+  ]
+};

package/codecov.yml

@@ -1,6 +1,12 @@
 codecov:
   notify:
     require_ci_to_pass: yes
+  status:
+    project:
+      default:
+        # Allow small drops in coverage
+        threshold: 0.005  # .5 %
+        if_not_found: failure
 
 coverage:
   precision: 2

package/index.html

@@ -18,12 +18,15 @@
       <li><a href="BookReaderDemo/demo-preview-pages.html">Preview Pages</a></li>
       <li><a href="BookReaderDemo/demo-embed.html">Embed</a></li>
       <li><a href="BookReaderDemo/demo-multiple.html">Multiple on same page</a></li>
+      <!-- plugin.search.js -->
       <li><a href="BookReaderDemo/demo-internetarchive.html?ocaid=theworksofplato01platiala">From Internet Archive</a></li>
-      <li><a href="BookReaderDemo/demo-internetarchive.html?ocaid=adventuresofoli00dick">From Internet Archive - a book with CHAPTERS</a></li>
+      <!-- plugin.search.js -->
+      <li><a href="BookReaderDemo/demo-internetarchive.html?ocaid=adventureofsherl0000unse">From Internet Archive - a book with CHAPTERS</a></li>
       <li><a href="BookReaderDemo/demo-iiif.html">IIIF</a></li>
       <li><a href="BookReaderDemo/demo-autoplay.html">Autoplay (kiosk mode)</a></li>
       <li><a href="BookReaderDemo/demo-plugin-menu-toggle.html">Plugin: Full screen menu toggle</a></li>
       <li><a href="BookReaderDemo/immersion-mode.html">Start in immersion (fullscreen) mode</a></li>
+      <!-- plugin.search.js -->
       <li><a href="BookReaderDemo/immersion-1up.html">Start in immersion mode on 1up default item</a></li>
       <li><a href="BookReaderDemo/viewmode-cycle.html">Replace view mode buttons with view mode cycler</a></li>
      </ul>

package/jsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es6",
+    "moduleResolution": "node",
+    "experimentalDecorators": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": [
+    "src/**/*.js",
+    "tests/**/*.js",
+  ],
+  "exclude": [
+    "node_modules",
+    "BookReader"
+  ]
+}

package/netlify.toml

@@ -0,0 +1,9 @@
+[build.environment]
+  # Keep in sync with CI in .github/workflows/node.js.yml
+  NODE_VERSION = "20"
+
+[[headers]]
+  # Define which paths this specific [[headers]] block will cover.
+  for = "/BookReader/*"
+    [headers.values]
+    Access-Control-Allow-Origin = "*"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/bookreader",
-  "version": "5.0.0-8",
+  "version": "5.0.0-80",
   "description": "The Internet Archive BookReader.",
   "repository": {
     "type": "git",
@@ -9,7 +9,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "module": "src/BookNavigator/BookNavigator.js",
+  "module": "src/ia-bookreader/ia-bookreader.js",
   "keywords": [
     "online",
     "bookreader",
@@ -25,73 +25,82 @@
   "homepage": "https://github.com/internetarchive/bookreader#readme",
   "private": false,
   "dependencies": {
-    "@internetarchive/ia-activity-indicator": "^0.0.1",
-    "@internetarchive/ia-icons": "^1.2.2",
-    "@internetarchive/ia-menu-slider": "^0.1.10",
-    "@internetarchive/ia-sharing-options": "^0.1.2",
-    "@internetarchive/icon-bookmark": "^1.1.3",
-    "@internetarchive/icon-collapse-sidebar": "^1.1.0",
-    "@internetarchive/icon-edit-pencil": "1.1.5",
-    "@internetarchive/icon-magnify-minus": "^1.2.3",
-    "@internetarchive/icon-magnify-plus": "^1.2.3",
-    "@internetarchive/icon-search": "^1.2.3",
-    "@internetarchive/modal-manager": "^0.1.0",
-    "lit-element": "^2.4.0",
-    "lit-html": "^1.3.0"
+    "@internetarchive/ia-activity-indicator": "^0.0.4",
+    "@internetarchive/ia-item-navigator": "^2.1.2",
+    "@internetarchive/icon-bookmark": "^1.3.4",
+    "@internetarchive/icon-dl": "^1.3.4",
+    "@internetarchive/icon-edit-pencil": "^1.3.4",
+    "@internetarchive/icon-magnify-minus": "^1.3.4",
+    "@internetarchive/icon-magnify-plus": "^1.3.4",
+    "@internetarchive/icon-search": "^1.3.4",
+    "@internetarchive/icon-toc": "^1.3.4",
+    "@internetarchive/icon-visual-adjustment": "^1.3.4",
+    "@internetarchive/modal-manager": "^0.2.12",
+    "@internetarchive/shared-resize-observer": "^0.2.0",
+    "lit": "^2.5.0"
   },
   "devDependencies": {
-    "@babel/core": "7.13.16",
-    "@babel/preset-env": "7.13.15",
-    "@open-wc/testing": "^2.5.33",
-    "@open-wc/testing-karma": "^4.0.9",
-    "@types/jest": "26.0.23",
-    "babel-loader": "8.2.2",
-    "codecov": "3.8.1",
-    "concurrently": "6.0.2",
-    "core-js": "3.11.0",
-    "cpx2": "3.0.0",
-    "eslint": "7.25.0",
-    "eslint-plugin-testcafe": "0.2.1",
-    "http-server": "0.12.3",
-    "iso-language-codes": "1.0.8",
-    "jest": "26.6.3",
-    "jquery": "1.11.3",
+    "@babel/core": "7.23.3",
+    "@babel/eslint-parser": "7.23.3",
+    "@babel/plugin-proposal-class-properties": "7.18.6",
+    "@babel/plugin-proposal-decorators": "7.23.3",
+    "@babel/preset-env": "7.23.3",
+    "@iiif/presentation-2": "^1.0.4",
+    "@iiif/presentation-3": "^2.1.3",
+    "@open-wc/testing-helpers": "3.0.0",
+    "@types/jest": "29.5.12",
+    "@webcomponents/webcomponentsjs": "^2.6.0",
+    "babel-loader": "9.1.3",
+    "codecov": "^3.8.3",
+    "concurrently": "8.2.2",
+    "core-js": "3.33.3",
+    "cpx2": "4.2.3",
+    "eslint": "^7.32.0",
+    "eslint-plugin-no-jquery": "^2.7.0",
+    "eslint-plugin-testcafe": "^0.2.1",
+    "http-server": "14.1.1",
+    "interactjs": "^1.10.18",
+    "iso-language-codes": "1.1.0",
+    "jest": "29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "jquery": "3.6.1",
     "jquery-colorbox": "1.6.4",
     "jquery-ui": "1.12.1",
     "jquery-ui-touch-punch": "0.2.3",
     "jquery.browser": "0.1.0",
-    "jquery.mmenu": "5.6.5",
-    "karma-coverage": "^2.0.3",
-    "live-server": "1.2.1",
-    "node-fetch": "2.6.1",
-    "regenerator-runtime": "0.13.7",
-    "sass": "1.32.11",
-    "sinon": "10.0.0",
+    "live-server": "1.2.2",
+    "regenerator-runtime": "0.14.0",
+    "sass": "1.69.5",
+    "sinon": "17.0.1",
     "soundmanager2": "2.97.20170602",
-    "svgo": "2.3.0",
-    "testcafe": "1.14.0",
-    "webpack": "5.35.0",
-    "webpack-cli": "4.6.0"
+    "svgo": "3.0.4",
+    "testcafe": "3.4.0",
+    "testcafe-browser-provider-browserstack": "^1.13.2-alpha.1",
+    "webpack": "5.89.0",
+    "webpack-cli": "5.1.4"
   },
   "jest": {
+    "testEnvironment": "jsdom",
+    "transformIgnorePatterns": [
+      "node_modules/(?!(sinon|lit-html|lit-element|lit|@lit|@internetarchive|@open-wc)/)"
+    ],
+    "moduleNameMapper": {
+      "^@/(.*)$": "<rootDir>/$1"
+    },
     "setupFiles": [
-      "./src/jquery-wrapper.js"
+      "./src/jquery-wrapper.js",
+      "./tests/jest/setup.js"
     ],
     "roots": [
       "<rootDir>/src/",
-      "<rootDir>/tests/"
-    ],
-    "testPathIgnorePatterns": [
-      "<rootDir>/tests/e2e/",
-      "<rootDir>/tests/karma/"
-    ],
-    "coverageDirectory": "<rootDir>/coverage-jest"
+      "<rootDir>/tests/jest/"
+    ]
   },
   "scripts": {
     "preversion": "npm run test && node scripts/preversion.js",
     "version": "node scripts/version.js",
     "postversion": "node scripts/postversion.js",
-    "build": "npm run clean && npm run build-js && npm run build-css && npm run build-assets",
+    "build": "npm run clean && npx concurrently --group npm:build-js npm:build-css npm:build-assets",
     "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-js": "npx webpack",
@@ -102,15 +111,16 @@
     "lint": "npx eslint src/ tests/ *.js",
     "lint:fix": "npx eslint --fix src/ tests/ *.js",
     "serve": "npx http-server . --port 8000",
-    "serve-live": "npx live-server . --port 8000 --watch=index.html,BookReader,BookReaderDemo",
-    "serve-dev": "npm run build-css && npx concurrently --kill-others npm:serve-live npm:build-*:watch",
-    "test": "npm run test-jest && npm run test-karma",
-    "test:e2e": "npm run build && env BASE_URL=http://127.0.0.1:8000/BookReaderDemo/ npx testcafe",
-    "test:e2e:dev": "env BASE_URL=http://127.0.0.1:8000/BookReaderDemo/ npx testcafe --live --dev",
-    "test-jest:watch": "npx jest --watch",
-    "test-jest": "npx jest --coverage --colors",
-    "test-karma": "npx karma start --coverage",
-    "test-karma:watch": "npx karma start --auto-watch=true --single-run=false",
+    "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",
+    "test": "npx jest --coverage --colors",
+    "test:watch": "npx jest --watch",
+    "test:e2e": "npm run build && npx testcafe",
+    "test:e2e:dev": "npx testcafe --live --dev",
+    "DOCS:update:test-deps": "If CI succeeds, these should be good to update",
+    "update:test-deps": "npm i @babel/eslint-parser@latest @open-wc/testing-helpers@latest @types/jest@latest codecov@latest eslint@7 eslint-plugin-testcafe@latest jest@latest sinon@latest testcafe@latest",
+    "DOCS:update:build-deps": "These can cause strange changes, so do an npm run build + check file size (git diff --stat), and check the site is as expected",
+    "update:build-deps": "npm i @babel/core@latest @babel/preset-env@latest @babel/plugin-proposal-class-properties@latest @babel/plugin-proposal-decorators@latest babel-loader@latest core-js@latest regenerator-runtime@latest sass@latest svgo@latest webpack@latest webpack-cli@latest",
     "codecov": "npx codecov"
   }
 }

package/renovate.json

@@ -0,0 +1,52 @@
+{
+  "extends": [
+    "config:base",
+    "schedule:monthly"
+  ],
+  "packageRules": [
+    {
+      "matchPackageNames": [
+        "@babel/eslint-parser",
+        "@open-wc/testing-helpers",
+        "@types/jest",
+        "codecov",
+        "eslint",
+        "eslint-plugin-no-jquery",
+        "eslint-plugin-testcafe",
+        "jest",
+        "jest-environment-jsdom",
+        "sinon",
+        "testcafe"
+      ],
+      "automerge": true
+    },
+    {
+      "matchPackageNames": [
+        "concurrently",
+        "http-server",
+        "live-server",
+        "node-fetch"
+      ],
+      "matchUpdateTypes": ["minor", "patch"],
+      "automerge": true
+    },
+    {
+      "matchPackagePatterns": ["^@internetarchive/icon-"],
+      "groupName": "@internetarchive icons",
+      "rangeStrategy": "bump"
+    },
+    {
+      "matchPackagePatterns": ["*"],
+      "rangeStrategy": "bump"
+    },
+    {
+      "matchPackagePatterns": ["^actions/"],
+      "groupName": "GitHub Actions",
+      "automerge": true
+    },
+    {
+      "matchPackagePatterns": ["^@internetarchive"],
+      "schedule": ["at any time"]
+    }
+  ]
+}

package/scripts/preversion.js

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

package/src/BookNavigator/assets/bookmark-colors.js

@@ -1,4 +1,4 @@
-import { css } from 'lit-element';
+import { css } from 'lit';
 
 export default css`
   .blue {

package/src/BookNavigator/assets/button-base.js

@@ -1,4 +1,4 @@
-import { css } from 'lit-element';
+import { css } from 'lit';
 
 export default css`
   .ia-button {
@@ -24,8 +24,10 @@ export default css`
     user-select: none;
   }
 
-  .ia-button.link {
+  .ia-button.link,
+  .ia-button.external {
     min-height: unset;
+    text-decoration: none;
   }
 
   .ia-button:disabled,

package/src/BookNavigator/assets/ia-logo.js

@@ -0,0 +1,17 @@
+import { svg } from 'lit';
+
+export default svg`
+  <svg class="ia-logo" width="27" height="30" viewBox="0 0 27 30" xmlns="http://www.w3.org/2000/svg" aria-labelledby="logoTitleID logoDescID">
+    <title id="logoTitleID">Internet Archive logo</title>
+    <desc id="logoDescID">A line drawing of the Internet Archive headquarters building façade.</desc>
+    <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+      <mask id="mask-2" fill="white">
+        <path d="M26.6666667,28.6046512 L26.6666667,30 L0,30 L0.000283687943,28.6046512 L26.6666667,28.6046512 Z M25.6140351,26.5116279 L25.6140351,28.255814 L1.05263158,28.255814 L1.05263158,26.5116279 L25.6140351,26.5116279 Z M3.62469203,7.6744186 L3.91746909,7.82153285 L4.0639977,10.1739544 L4.21052632,13.9963932 L4.21052632,17.6725617 L4.0639977,22.255044 L4.03962296,25.3421929 L3.62469203,25.4651163 L2.16024641,25.4651163 L1.72094074,25.3421929 L1.55031755,22.255044 L1.40350877,17.6970339 L1.40350877,14.0211467 L1.55031755,10.1739544 L1.68423854,7.80887484 L1.98962322,7.6744186 L3.62469203,7.6744186 Z M24.6774869,7.6744186 L24.9706026,7.82153285 L25.1168803,10.1739544 L25.2631579,13.9963932 L25.2631579,17.6725617 L25.1168803,22.255044 L25.0927809,25.3421929 L24.6774869,25.4651163 L23.2130291,25.4651163 L22.7736357,25.3421929 L22.602418,22.255044 L22.4561404,17.6970339 L22.4561404,14.0211467 L22.602418,10.1739544 L22.7369262,7.80887484 L23.0420916,7.6744186 L24.6774869,7.6744186 Z M9.94042303,7.6744186 L10.2332293,7.82153285 L10.3797725,10.1739544 L10.5263158,13.9963932 L10.5263158,17.6725617 L10.3797725,22.255044 L10.3556756,25.3421929 L9.94042303,25.4651163 L8.47583122,25.4651163 L8.0362015,25.3421929 L7.86556129,22.255044 L7.71929825,17.6970339 L7.71929825,14.0211467 L7.86556129,10.1739544 L8.00005604,7.80887484 L8.30491081,7.6744186 L9.94042303,7.6744186 Z M18.0105985,7.6744186 L18.3034047,7.82153285 L18.449948,10.1739544 L18.5964912,13.9963932 L18.5964912,17.6725617 L18.449948,22.255044 L18.425851,25.3421929 L18.0105985,25.4651163 L16.5460067,25.4651163 L16.1066571,25.3421929 L15.9357367,22.255044 L15.7894737,17.6970339 L15.7894737,14.0211467 L15.9357367,10.1739544 L16.0702315,7.80887484 L16.3753664,7.6744186 L18.0105985,7.6744186 Z M25.6140351,4.53488372 L25.6140351,6.97674419 L1.05263158,6.97674419 L1.05263158,4.53488372 L25.6140351,4.53488372 Z M13.0806755,0 L25.9649123,2.93331338 L25.4484139,3.8372093 L0.771925248,3.8372093 L0,3.1041615 L13.0806755,0 Z" id="path-1"></path>
+      </mask>
+      <use fill="#FFFFFF" xlink:href="#path-1"></use>
+      <g mask="url(#mask-2)" fill="#FFFFFF">
+        <path d="M0,0 L26.6666667,0 L26.6666667,30 L0,30 L0,0 Z" id="swatch"></path>
+      </g>
+    </g>
+  </svg>
+`;

package/src/BookNavigator/assets/icon_checkmark.js

@@ -1,4 +1,4 @@
-import { css } from 'lit-element';
+import { css } from 'lit';
 
 // Original SVG object for reference
 // <svg height="10" viewBox="0 0 13 10" width="13" xmlns="http://www.w3.org/2000/svg"><path d="m4.33333333 10-4.33333333-4.16666667 1.73333333-1.66666666 2.6 2.5 6.93333337-6.66666667 1.7333333 1.66666667z" fill="#fff" fill-rule="evenodd"/></svg>

package/src/BookNavigator/assets/icon_close.js

@@ -1,3 +1,3 @@
-import { css } from 'lit-element';
+import { css } from 'lit';
 
 export default css`data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNDAgNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1sYWJlbGxlZGJ5PSJjbG9zZVRpdGxlSUQgY2xvc2VEZXNjSUQiPjxwYXRoIGQ9Ik0yOS4xOTIgMTAuODA4YTEuNSAxLjUgMCAwMTAgMi4xMkwyMi4xMjIgMjBsNy4wNyA3LjA3MmExLjUgMS41IDAgMDEtMi4xMiAyLjEyMWwtNy4wNzMtNy4wNy03LjA3IDcuMDdhMS41IDEuNSAwIDAxLTIuMTIxLTIuMTJsNy4wNy03LjA3My03LjA3LTcuMDdhMS41IDEuNSAwIDAxMi4xMi0yLjEyMUwyMCAxNy44NzhsNy4wNzItNy4wN2ExLjUgMS41IDAgMDEyLjEyMSAweiIgY2xhc3M9ImZpbGwtY29sb3IiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==`;