@readium/navigator 2.2.9 → 2.3.0

package/src/epub/preferences/EpubPreferences.ts

@@ -48,8 +48,8 @@ export interface IEpubPreferences {
   scroll?: boolean | null,
   scrollPaddingTop?: number | null,
   scrollPaddingBottom?: number | null,
-  // scrollPaddingLeft?: number | null,
-  // scrollPaddingRight?: number | null,
+  scrollPaddingLeft?: number | null,
+  scrollPaddingRight?: number | null,
   selectionBackgroundColor?: string | null,
   selectionTextColor?: string | null,
   textAlign?: TextAlignment | null,
@@ -91,8 +91,8 @@ export class EpubPreferences implements ConfigurablePreferences {
   scroll?: boolean | null;
   scrollPaddingTop?: number | null;
   scrollPaddingBottom?: number | null;
-  // scrollPaddingLeft?: number | null;
-  // scrollPaddingRight?: number | null;
+  scrollPaddingLeft?: number | null;
+  scrollPaddingRight?: number | null;
   selectionBackgroundColor?: string | null;
   selectionTextColor?: string | null;
   textAlign?: TextAlignment | null;
@@ -130,8 +130,8 @@ export class EpubPreferences implements ConfigurablePreferences {
     this.scroll = ensureBoolean(preferences.scroll);
     this.scrollPaddingTop = ensureNonNegative(preferences.scrollPaddingTop);
     this.scrollPaddingBottom = ensureNonNegative(preferences.scrollPaddingBottom);
-    // this.scrollPaddingLeft = ensureNonNegative(preferences.scrollPaddingLeft);
-    // this.scrollPaddingRight = ensureNonNegative(preferences.scrollPaddingRight);
+    this.scrollPaddingLeft = ensureNonNegative(preferences.scrollPaddingLeft);
+    this.scrollPaddingRight = ensureNonNegative(preferences.scrollPaddingRight);
     this.selectionBackgroundColor = ensureString(preferences.selectionBackgroundColor);
     this.selectionTextColor = ensureString(preferences.selectionTextColor);
     this.textAlign = ensureEnumValue<TextAlignment>(preferences.textAlign, TextAlignment);

package/src/epub/preferences/EpubPreferencesEditor.ts

@@ -364,7 +364,7 @@ export class EpubPreferencesEditor implements IPreferencesEditor {
     return new Preference<number>({
       initialValue: this.preferences.pageGutter,
       effectiveValue: this.settings.pageGutter,
-      isEffective: this.layout !== Layout.fixed,
+      isEffective: this.layout !== Layout.fixed && !this.settings.scroll,
       onChange: (newValue: number | null | undefined) => {
         this.updatePreference("pageGutter", newValue || null);
       }
@@ -430,7 +430,6 @@ export class EpubPreferencesEditor implements IPreferencesEditor {
     });
   }
 
-  /* 
   get scrollPaddingLeft(): Preference<number> {
     return new Preference<number>({
       initialValue: this.preferences.scrollPaddingLeft,
@@ -452,7 +451,6 @@ export class EpubPreferencesEditor implements IPreferencesEditor {
       }
     });
   } 
-  */
 
   get selectionBackgroundColor(): Preference<string> {
     return new Preference<string>({

package/src/epub/preferences/EpubSettings.ts

@@ -37,8 +37,8 @@ export interface IEpubSettings {
   scroll?: boolean | null,
   scrollPaddingTop?: number | null,
   scrollPaddingBottom?: number | null,
-  // scrollPaddingLeft?: number | null,
-  // scrollPaddingRight?: number | null,
+  scrollPaddingLeft?: number | null,
+  scrollPaddingRight?: number | null,
   selectionBackgroundColor?: string | null,
   selectionTextColor?: string | null,
   textAlign?: TextAlignment | null,
@@ -81,8 +81,8 @@ export class EpubSettings implements ConfigurableSettings {
   scroll: boolean | null;
   scrollPaddingTop: number | null;
   scrollPaddingBottom: number | null;
-  // scrollPaddingLeft: number | null;
-  // scrollPaddingRight: number | null;
+  scrollPaddingLeft: number | null;
+  scrollPaddingRight: number | null;
   selectionBackgroundColor: string | null;
   selectionTextColor: string | null;
   textAlign: TextAlignment | null;
@@ -205,8 +205,7 @@ export class EpubSettings implements ConfigurableSettings {
       ? preferences.scrollPaddingBottom 
       : defaults.scrollPaddingBottom !== undefined 
         ? defaults.scrollPaddingBottom 
-        : null;
-    /* 
+        : null; 
     this.scrollPaddingLeft = preferences.scrollPaddingLeft !== undefined 
       ? preferences.scrollPaddingLeft 
       : defaults.scrollPaddingLeft !== undefined 
@@ -217,7 +216,6 @@ export class EpubSettings implements ConfigurableSettings {
       : defaults.scrollPaddingRight !== undefined 
         ? defaults.scrollPaddingRight 
         : null;
-    */
     this.selectionBackgroundColor = preferences.selectionBackgroundColor || defaults.selectionBackgroundColor || null;
     this.selectionTextColor = preferences.selectionTextColor || defaults.selectionTextColor || null;
     this.textAlign = preferences.textAlign || defaults.textAlign || null;

package/src/helpers/lineLength.ts

@@ -11,7 +11,7 @@ export interface ILineLengthsConfig {
   maxChars?: number | null;
   baseFontSize?: number | null;
   sample?: string | null;
-  pageGutter?: number | null;
+  padding?: number | null;
   fontFace?: string | ICustomFontFace | null;
   letterSpacing?: number | null;
   wordSpacing?: number | null;
@@ -51,13 +51,12 @@ export class LineLengths {
   private _baseFontSize: number;
   private _fontFace: string | ICustomFontFace;
   private _sample: string | null;
-  private _pageGutter: number;
+  private _padding: number;
   private _letterSpacing: number;
   private _wordSpacing: number;
   private _isCJK: boolean;
   private _getRelative: boolean;
   
-  private _padding: number;
   private _minDivider: number | null;
   private _maxMultiplier: number | null;
   private _approximatedWordSpaces: number;
@@ -72,7 +71,7 @@ export class LineLengths {
     this._baseFontSize = config.baseFontSize || DEFAULT_FONT_SIZE;
     this._fontFace = config.fontFace || DEFAULT_FONT_FACE;
     this._sample = config.sample || null;
-    this._pageGutter = config.pageGutter || 0;
+    this._padding = config.padding ?? 0;
     this._letterSpacing = config.letterSpacing 
       ? Math.round(config.letterSpacing * this._baseFontSize) 
       : 0;
@@ -81,7 +80,6 @@ export class LineLengths {
       : 0;
     this._isCJK = config.isCJK || false;
     this._getRelative = config.getRelative || false;
-    this._padding = this._pageGutter * 2;
     this._minDivider = this._minChars && this._minChars < this._optimalChars 
       ? this._optimalChars / this._minChars 
       : this._minChars === null 
@@ -121,7 +119,7 @@ export class LineLengths {
     if (props.letterSpacing) this._letterSpacing = props.letterSpacing;
     if (props.wordSpacing) this._wordSpacing = props.wordSpacing;
     if (props.isCJK != null) this._isCJK = props.isCJK;
-    if (props.pageGutter) this._pageGutter = props.pageGutter;
+    if (props.padding !== undefined) this._padding = props.padding ?? 0;
     if (props.getRelative) this._getRelative = props.getRelative;
 
     if (props.sample) {

package/src/injection/epubInjectables.ts

@@ -1,6 +1,6 @@
 import { IInjectableRule, IInjectable } from "../injection/Injectable";
 import { stripJS, stripCSS } from "../helpers/minify";
-import { Metadata, Layout } from "@readium/shared";
+import { Metadata, Layout, Link } from "@readium/shared";
 
 import readiumCSSAfter from "@readium/css/css/dist/ReadiumCSS-after.css?raw";
 import readiumCSSBefore from "@readium/css/css/dist/ReadiumCSS-before.css?raw";
@@ -13,9 +13,17 @@ import onloadProxyContent from "../dom/_readium_executionCleanup.js?raw";
 /**
  * Creates injectable rules for EPUB content documents
  */
-export function createReadiumEpubRules(metadata: Metadata): IInjectableRule[] {
+export function createReadiumEpubRules(metadata: Metadata, readingOrderItems: Link[]): IInjectableRule[] {
     const isFixedLayout = metadata.effectiveLayout === Layout.fixed;
     
+    const htmlHrefs = readingOrderItems
+        .filter(item => item.mediaType.isHTML)
+        .map(item => item.href);
+    
+    const resources = htmlHrefs.length > 0 
+        ? htmlHrefs 
+        : [/\.xhtml$/, /\.html$/]; // fallback patterns
+    
     // Core injectables that should be prepended
     const prependInjectables: IInjectable[] = [
         // CSS Selector Generator - always injected
@@ -82,7 +90,7 @@ export function createReadiumEpubRules(metadata: Metadata): IInjectableRule[] {
 
     return [
         {
-            resources: [/\.xhtml$/, /\.html$/],
+            resources: resources,
             prepend: prependInjectables,
             append: appendInjectables
         }

package/src/injection/webpubInjectables.ts

@@ -1,5 +1,6 @@
 import { IInjectableRule, IInjectable } from "../injection/Injectable";
 import { stripJS, stripCSS } from "../helpers/minify";
+import { Link } from "@readium/shared";
 
 import readiumCSSWebPub from "@readium/css/css/dist/webPub/ReadiumCSS-webPub.css?raw";
 
@@ -10,7 +11,16 @@ import onloadProxyContent from "../dom/_readium_executionCleanup.js?raw";
 /**
  * Creates injectable rules for WebPub content documents
  */
-export function createReadiumWebPubRules(): IInjectableRule[] {
+export function createReadiumWebPubRules(readingOrderItems: Link[]): IInjectableRule[] {
+    // Create exact match patterns for manifest hrefs
+    const htmlHrefs = readingOrderItems
+        .filter(item => item.mediaType.isHTML)
+        .map(item => item.href);
+    
+    const resources = htmlHrefs.length > 0 
+        ? htmlHrefs 
+        : [/\.html$/, /\.xhtml$/, /\/$/]; // fallback patterns
+    
     // Core injectables that should be prepended
     const prependInjectables: IInjectable[] = [
         // CSS Selector Generator - always injected
@@ -51,7 +61,7 @@ export function createReadiumWebPubRules(): IInjectableRule[] {
 
     return [
         {
-            resources: [/\.xhtml$/, /\.html$/],
+            resources: resources,
             prepend: prependInjectables,
             append: appendInjectables
         }

package/src/peripherals/KeyboardPeripherals.ts

@@ -0,0 +1,53 @@
+import { 
+    KeyCombinationManager,
+    ActivityEventDispatcher,
+    KeyboardPeripheral
+} from "@readium/navigator-html-injectables";
+
+export const NAVIGATOR_KEYBOARD_PERIPHERAL_EVENT = "readium:navigator:keyboardPeripheral";
+
+export interface KeyboardPeripheralOptions {
+    /** Array of keyboard peripherals to configure */
+    keyboardPeripherals?: KeyboardPeripheral[];
+}
+
+export class KeyboardPeripherals {
+    private keydownHandler?: (event: KeyboardEvent) => void;
+    private keyManager = new KeyCombinationManager();
+
+    constructor(options: KeyboardPeripheralOptions = {}) {
+        this.setupKeyboardPeripherals(options.keyboardPeripherals || []);
+    }
+    
+    private setupKeyboardPeripherals(keyboardPeripherals: KeyboardPeripheral[]) {
+        if (keyboardPeripherals.length > 0) {
+            // Create activity event dispatcher
+            const dispatcher: ActivityEventDispatcher = (activityEvent) => {
+                const customEvent = new CustomEvent(NAVIGATOR_KEYBOARD_PERIPHERAL_EVENT, {
+                    detail: activityEvent
+                });
+                window.dispatchEvent(customEvent);
+            };
+            
+            // Create unified handler using the provided keyboard peripherals
+            this.keydownHandler = this.keyManager.createUnifiedHandler(
+                "", // Empty string as target frame source for main window
+                keyboardPeripherals, 
+                dispatcher
+            );
+            
+            if (this.keydownHandler) {
+                document.addEventListener("keydown", this.keydownHandler, true);
+            }
+        }
+        
+        window.addEventListener("unload", () => this.destroy());
+    }
+    
+    public destroy() {
+        if (this.keydownHandler) {
+            document.removeEventListener("keydown", this.keydownHandler, true);
+            this.keydownHandler = undefined;
+        }
+    }
+}

package/src/protection/AutomationDetector.ts

@@ -0,0 +1,66 @@
+export interface AutomationDetectorOptions {
+    /** Callback when an automation tool is detected */
+    onDetected?: (tool: string) => void;
+}
+
+export class AutomationDetector {
+    private options: AutomationDetectorOptions;
+    private detectedTools = new Set<string>();
+    private observer?: MutationObserver;
+
+    constructor(options: AutomationDetectorOptions) {
+        if (!options.onDetected) {
+            throw new Error('onDetected callback is required');
+        }
+        
+        this.options = options;
+        this.setupDetection();
+    }
+
+    private isAutomationToolPresent(): string | null {
+        const win = window as any;
+        
+        if (win.domAutomation || win.domAutomationController) return "Selenium";
+        if (navigator.webdriver === true) return "Puppeteer/Playwright";
+        if (win.__webdriver_evaluate || win.__selenium_evaluate) return "Chrome Automation";
+        if (win.callPhantom || win._phantom) return "PhantomJS";
+        if (win.__nightmare) return "Nightmare";
+        if (win.$testCafe) return "TestCafe";
+        
+        return null;
+    }
+
+    private setupDetection() {
+        const tool = this.isAutomationToolPresent();
+        if (tool) {
+            this.handleDetected(tool);
+            return;
+        }
+
+        this.observer = new MutationObserver(() => {
+            const tool = this.isAutomationToolPresent();
+            if (tool && !this.detectedTools.has(tool)) {
+                this.handleDetected(tool);
+            }
+        });
+
+        this.observer.observe(document.documentElement, {
+            childList: true,
+            subtree: true,
+            attributes: true
+        });
+
+        window.addEventListener("unload", () => this.destroy());
+    }
+
+    private handleDetected(tool: string) {
+        this.detectedTools.add(tool);
+        this.options.onDetected?.(tool);
+    }
+
+    public destroy() {
+        this.observer?.disconnect();
+        this.observer = undefined;
+        this.detectedTools.clear();
+    }
+}

package/src/protection/ContextMenuProtector.ts

@@ -0,0 +1,46 @@
+import { ContextMenuEvent } from "@readium/navigator-html-injectables";
+
+export interface ContextMenuProtectionOptions {
+    onContextMenuBlocked?: (event: ContextMenuEvent) => void;
+}
+
+export class ContextMenuProtector {
+    private contextMenuHandler?: (event: MouseEvent) => void;
+    private onContextMenuBlocked?: (event: ContextMenuEvent) => void;
+
+    constructor(options: ContextMenuProtectionOptions = {}) {
+        this.onContextMenuBlocked = options.onContextMenuBlocked;
+        this.contextMenuHandler = this.handleContextMenu.bind(this);
+        document.addEventListener("contextmenu", this.contextMenuHandler, true);
+        
+        window.addEventListener("unload", () => this.destroy());
+    }
+    
+    private handleContextMenu(event: MouseEvent) {
+        event.preventDefault();
+        event.stopPropagation();
+        
+        // Create context menu event
+        const activityEvent: ContextMenuEvent & { type: "context_menu" } = {
+            type: "context_menu",
+            timestamp: Date.now(),
+            clientX: event.clientX,
+            clientY: event.clientY,
+            targetFrameSrc: ''
+        };
+        
+        // Call the callback if provided
+        if (this.onContextMenuBlocked) {
+            this.onContextMenuBlocked(activityEvent);
+        }
+        
+        return false;
+    }
+    
+    public destroy() {
+        if (this.contextMenuHandler) {
+            document.removeEventListener("contextmenu", this.contextMenuHandler, true);
+            this.contextMenuHandler = undefined;
+        }
+    }
+}

package/src/protection/DevToolsDetector.ts

@@ -0,0 +1,290 @@
+import { sML } from "../helpers/sML";
+import { WorkerConsole } from "./utils/WorkerConsole";
+import { log, table, clear } from "./utils/console";
+import { isBrave } from "./utils/platform";
+import { match } from "./utils/match";
+
+export interface DevToolsDetectorOptions {
+    /** Callback when Developer Tools are detected as open */
+    onDetected?: () => void;
+    /** Callback when Developer Tools are detected as closed */
+    onClosed?: () => void;
+    /** Detection interval in milliseconds (default: 1000) */
+    interval?: number;
+    /** Enable debugger-based detection (fallback, impacts UX) */
+    enableDebuggerDetection?: boolean;
+}
+
+export class DevToolsDetector {
+    private options: Required<DevToolsDetectorOptions>;
+    private isOpen = false;
+    private intervalId?: number;
+    private checkCount = 0;
+    private maxChecks = 10;
+    private maxPrintTime = 0;
+    private largeObjectArray: Record<string, string>[] | null = null;
+    private workerConsole?: WorkerConsole;
+
+    constructor(options: DevToolsDetectorOptions = {}) {
+        this.options = {
+            onDetected: options.onDetected || (() => {}),
+            onClosed: options.onClosed || (() => {}),
+            interval: options.interval || 1000,
+            enableDebuggerDetection: options.enableDebuggerDetection || false
+        };
+
+        // Initialize Web Worker for console operations (skip Firefox for now as it will fail)
+        if (!sML.UA.Firefox) {
+            try {
+                const blob = new Blob([WorkerConsole.workerScript], { type: 'application/javascript' });
+                const blobUrl = URL.createObjectURL(blob);
+                const worker = new Worker(blobUrl);
+                this.workerConsole = new WorkerConsole(worker, blobUrl);
+            } catch (error) {
+                // Fallback to regular console if Worker creation fails
+                console.warn('Failed to create Web Worker for DevTools detection:', error);
+            }
+        }
+
+        this.startDetection();
+    }
+
+    /**
+     * Create large object array for performance testing
+     */
+    private createLargeObjectArray(): Record<string, string>[] {
+        const largeObject: Record<string, string> = {};
+        for (let i = 0; i < 500; i++) {
+            largeObject[`${i}`] = `${i}`;
+        }
+        
+        const largeObjectArray: Record<string, string>[] = [];
+        for (let i = 0; i < 50; i++) {
+            largeObjectArray.push(largeObject);
+        }
+        
+        return largeObjectArray;
+    }
+
+    /**
+     * Get cached large object array
+     */
+    private getLargeObjectArray(): Record<string, string>[] {
+        if (this.largeObjectArray === null) {
+            this.largeObjectArray = this.createLargeObjectArray();
+        }
+        return this.largeObjectArray;
+    }
+
+    /**
+     * Performance-based detection using console.table timing
+     */
+    private async calcTablePrintTime(): Promise<number> {
+        const largeObjectArray = this.getLargeObjectArray();
+        
+        if (this.workerConsole) {
+            try {
+                const result = await this.workerConsole.table(largeObjectArray);
+                return result.time;
+            } catch (e) {
+                // Fallback to regular console
+                const start = performance.now();
+                table(largeObjectArray);
+                return performance.now() - start;
+            }
+        } else {
+            // Fallback to cached console methods
+            const start = performance.now();
+            table(largeObjectArray);
+            return performance.now() - start;
+        }
+    }
+
+    /**
+     * Performance-based detection using console.log timing
+     */
+    private async calcLogPrintTime(): Promise<number> {
+        const largeObjectArray = this.getLargeObjectArray();
+        
+        if (this.workerConsole) {
+            const result = await this.workerConsole.log(largeObjectArray);
+            return result.time;
+        } else {
+            // Fallback to cached console methods
+            const start = performance.now();
+            log(largeObjectArray);
+            return performance.now() - start;
+        }
+    }
+
+    /**
+     * Check if performance-based detection is enabled for current browser
+     */
+    private isPerformanceDetectionEnabled(): boolean {
+        return match({
+            includes: [
+                () => !!sML.UA.Chrome,
+                () => !!sML.UA.Chromium, 
+                () => !!sML.UA.Safari,
+                () => !!sML.UA.Firefox
+            ],
+            excludes: []
+        });
+    }
+
+    /**
+     * Check if debugger detection is enabled for current browser
+     */
+    private isDebuggerDetectionEnabled(): boolean {
+        // Only enable debugger detection if explicitly enabled in options
+        // Note: We can't check for Brave here since isBrave() is async
+        // and this method needs to be synchronous
+        return this.options.enableDebuggerDetection;
+    }
+
+    /**
+     * Performance-based detection using large object timing differences
+     */
+    private async checkPerformanceBased(): Promise<boolean> {
+        if (!this.isPerformanceDetectionEnabled()) {
+            return false;
+        }
+
+        const tablePrintTime = await this.calcTablePrintTime();
+        const logPrintTime = Math.max(await this.calcLogPrintTime(), await this.calcLogPrintTime());
+        this.maxPrintTime = Math.max(this.maxPrintTime, logPrintTime);
+
+        if (this.workerConsole) {
+            await this.workerConsole.clear();
+        } else {
+            clear();
+        }
+
+        if (tablePrintTime === 0) return false;
+        if (this.maxPrintTime === 0) {
+            if (await isBrave()) {
+                return true;
+            }
+            return false;
+        }
+
+        return tablePrintTime > this.maxPrintTime * 10;
+    }
+
+    /**
+     * Debugger-based detection (fallback method)
+     * WARNING: This method impacts user experience
+     */
+    private async checkDebuggerBased(): Promise<boolean> {
+        if (!this.isDebuggerDetectionEnabled()) {
+            return false;
+        }
+
+        // Skip debugger detection in Brave (has anti-fingerprinting measures)
+        if (await isBrave()) {
+            return false;
+        }
+
+        const startTime = performance.now();
+
+        try {
+            (() => {}).constructor('debugger')();
+        } catch {
+            debugger;
+        }
+
+        return performance.now() - startTime > 100;
+    }
+
+    /**
+     * Main detection method combining multiple approaches
+     * Prioritizes performance-based detection
+     */
+    private async detectDevTools(): Promise<boolean> {
+        // Primary method: Performance-based detection (from original library)
+        const performanceResult = await this.checkPerformanceBased();
+        
+        if (performanceResult) {
+            return true;
+        }
+
+        // Fallback method: Debugger-based (only if enabled)
+        if (this.options.enableDebuggerDetection && this.checkCount >= this.maxChecks) {
+            const debuggerResult = await this.checkDebuggerBased();
+            return debuggerResult;
+        }
+
+        return false;
+    }
+
+    /**
+     * Start continuous detection monitoring
+     */
+    private startDetection() {
+        this.intervalId = window.setInterval(async () => {
+            this.checkCount++;
+            const currentlyOpen = await this.detectDevTools();
+
+            if (currentlyOpen !== this.isOpen) {
+                this.isOpen = currentlyOpen;
+                
+                if (currentlyOpen) {
+                    this.options.onDetected();
+                } else {
+                    this.options.onClosed();
+                }
+            }
+
+            // Reset check count periodically to avoid excessive debugger usage
+            if (this.checkCount > this.maxChecks * 2) {
+                this.checkCount = 0;
+            }
+        }, this.options.interval);
+
+        // Cleanup on page unload
+        window.addEventListener('beforeunload', () => this.destroy());
+    }
+
+    /**
+     * Get current DevTools state
+     */
+    public isDevToolsOpen(): boolean {
+        return this.isOpen;
+    }
+
+    /**
+     * Force an immediate check
+     */
+    public async checkNow(): Promise<boolean> {
+        const wasOpen = this.isOpen;
+        this.isOpen = await this.detectDevTools();
+        
+        if (this.isOpen !== wasOpen) {
+            if (this.isOpen) {
+                this.options.onDetected();
+            } else {
+                this.options.onClosed();
+            }
+        }
+        
+        return this.isOpen;
+    }
+
+    /**
+     * Stop detection and cleanup resources
+     */
+    public destroy() {
+        if (this.intervalId) {
+            clearInterval(this.intervalId);
+            this.intervalId = undefined;
+        }
+        
+        // Cleanup Web Worker
+        if (this.workerConsole) {
+            this.workerConsole.destroy();
+        }
+        
+        this.isOpen = false;
+        this.checkCount = 0;
+    }
+}