Add epubReadingSystem property to frame documents

navigator-html-injectables/src/helpers/dom.ts

@@ -5,6 +5,13 @@ import type { getCssSelector } from "css-selector-generator";
 
 type BlockedEventData = [0, Function, any[], any[]] | [1, Event, EventTarget];
 
+export interface EPUBReadingSystem {
+    name: string;
+    version: string;
+    layoutStyle: "paginated" | "scrolling"; // Technically, more are allowed
+    hasFeature: (feature: string, version?: string) => boolean;
+}
+
 // This is what is injected into the HTML documents
 export interface ReadiumWindow extends Window {
     _readium_blockEvents: boolean;
@@ -13,6 +20,7 @@ export interface ReadiumWindow extends Window {
     _readium_cssSelectorGenerator: {
         getCssSelector: typeof getCssSelector;
     };
+    navigator: Navigator & { epubReadingSystem: EPUBReadingSystem };
 }
 
 export function deselect(wnd: ReadiumWindow) {

navigator-html-injectables/src/modules/setup/FixedSetup.ts

@@ -12,6 +12,8 @@ export class FixedSetup extends Setup {
     mount(wnd: ReadiumWindow, comms: Comms): boolean {
         if(!super.mount(wnd, comms)) return false;
 
+        wnd.navigator.epubReadingSystem.layoutStyle = "paginated"; // TODO: what if we support scrolling?
+
         const style = wnd.document.createElement("style");
         style.id = FIXED_STYLE_ID;
         style.dataset.readium = "true";

navigator-html-injectables/src/modules/setup/Setup.ts

@@ -1,5 +1,5 @@
 import { Comms } from "../../comms/comms";
-import { ReadiumWindow } from "../../helpers/dom";
+import { ReadiumWindow, EPUBReadingSystem } from "../../helpers/dom";
 import { Module } from "../Module";
 import { ModuleName } from "../ModuleLibrary";
 
@@ -72,6 +72,35 @@ export abstract class Setup extends Module {
             false
         );
 
+        // Add reading system property to navigator
+        Reflect.defineProperty(wnd.navigator, "epubReadingSystem", {
+            value: {
+                name: "readium-ts-toolkit",
+                version: import.meta.env.PACKAGE_VERSION,
+                hasFeature: (feature: string, _version = "") => {
+                    switch (feature) {
+                        case "dom-manipulation":
+                            return true;
+                        case "layout-changes":
+                            return true;
+                        case "touch-events":
+                            return true;
+                        case "mouse-events":
+                            return true;
+                        case "keyboard-events":
+                            return true;
+                        case "spine-scripting":
+                            return true;
+                        case "embedded-web-content":
+                            return true;
+                        default:
+                            return false;
+                    }
+                }
+            } as EPUBReadingSystem,
+            writable: false
+        });
+
         // Add all currently active animations and cancel them
         if("getAnimations" in wnd.document) {
             wnd.document.getAnimations().forEach((a) => {

navigator-html-injectables/src/modules/snapper/ColumnSnapper.ts

@@ -229,6 +229,8 @@ export class ColumnSnapper extends Snapper {
         this.comms = comms;
         if(!super.mount(wnd, comms)) return false;
 
+        wnd.navigator.epubReadingSystem.layoutStyle = "paginated";
+
         // Add styling to hide the scrollbar
         const d = wnd.document.createElement("style");
         d.dataset.readium = "true";

navigator-html-injectables/src/modules/snapper/ScrollSnapper.ts

@@ -38,6 +38,8 @@ export class ScrollSnapper extends Snapper {
         this.wnd = wnd;
         this.comms = comms;
 
+        wnd.navigator.epubReadingSystem.layoutStyle = "scrolling";
+
         // Add styling to hide the scrollbar
         const style = wnd.document.createElement("style");
         style.dataset.readium = "true";

navigator-html-injectables/tsconfig.json

@@ -35,6 +35,7 @@
     "forceConsistentCasingInFileNames": true,
     // emit only .d.ts
     "noEmit": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["vite/client"]
   },
 }

navigator-html-injectables/vite.config.js

@@ -1,5 +1,6 @@
 import { resolve } from "path";
 import { defineConfig } from "vite";
+import packageJson from "./package.json";
 
 export default defineConfig({
   build: {
@@ -8,5 +9,9 @@ export default defineConfig({
       name: "navigator-html-injectables",
       fileName: "index"
     }
+  },
+  define: {
+    "import.meta.env.PACKAGE_NAME": JSON.stringify(packageJson.name),
+    "import.meta.env.PACKAGE_VERSION": JSON.stringify(packageJson.version),
   }
 });

navigator/tsconfig.json

@@ -36,6 +36,7 @@
     "forceConsistentCasingInFileNames": true,
     // emit only .d.ts
     "noEmit": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["vite/client"]
   }
 }

navigator/vite.config.js

@@ -1,6 +1,7 @@
 import { resolve } from "path";
 import { defineConfig } from "vite";
 import libAssetsPlugin from "@laynezh/vite-plugin-lib-assets";
+import packageJson from "./package.json";
 
 export default defineConfig({
   plugins: [
@@ -15,5 +16,9 @@ export default defineConfig({
       name: "navigator",
       fileName: "index"
     }
+  },
+  define: {
+    "import.meta.env.PACKAGE_NAME": JSON.stringify(packageJson.name),
+    "import.meta.env.PACKAGE_VERSION": JSON.stringify(packageJson.version),
   }
 });

shared/tsconfig.json

@@ -35,6 +35,7 @@
     "forceConsistentCasingInFileNames": true,
     // emit only .d.ts
     "noEmit": false,
-    "emitDeclarationOnly": true
+    "emitDeclarationOnly": true,
+    "types": ["vite/client"]
   },
 }

shared/vite.config.js

@@ -1,5 +1,6 @@
 import { resolve } from "path";
 import { defineConfig } from "vite";
+import packageJson from "./package.json";
 
 export default defineConfig({
   build: {
@@ -8,5 +9,9 @@ export default defineConfig({
       name: "shared",
       fileName: "index"
     }
+  },
+  define: {
+    "import.meta.env.PACKAGE_NAME": JSON.stringify(packageJson.name),
+    "import.meta.env.PACKAGE_VERSION": JSON.stringify(packageJson.version),
   }
 });