@edgepdf/viewer-js 0.0.1

package/dist/lib/tile-layer-manager.d.ts

@@ -0,0 +1,108 @@
+import L from 'leaflet';
+import type { TileConfig, ImageInfo } from '@edgepdf/types';
+/**
+ * TileLayerManager - Manages Leaflet tile layer for displaying image tiles
+ *
+ * This class handles:
+ * - XYZ tile URL template processing
+ * - Tile layer creation and configuration
+ * - Bounds calculation for seamless tile rendering
+ * - Tile grid sizing and management
+ *
+ * @example
+ * ```typescript
+ * const manager = new TileLayerManager({
+ *   tileUrl: '/tiles/{z}/{x}/{y}.webp',
+ *   imageInfo: {
+ *     width: 2000,
+ *     height: 3000,
+ *     tileSize: 256,
+ *     maxZoom: 5,
+ *     minZoom: 0
+ *   }
+ * });
+ *
+ * const tileLayer = manager.createTileLayer();
+ * tileLayer.addTo(map);
+ * ```
+ */
+export declare class TileLayerManager {
+    private config;
+    private tileLayer;
+    /**
+     * Creates a new TileLayerManager instance
+     *
+     * @param config - Tile configuration with URL template and image info
+     *
+     * @throws {Error} If config is invalid or tile URL template is malformed
+     */
+    constructor(config: TileConfig);
+    /**
+     * Creates and configures a Leaflet tile layer
+     *
+     * @param map - Optional Leaflet map instance (for event handling)
+     * @returns Configured Leaflet tile layer
+     *
+     * @throws {Error} If tile layer creation fails
+     */
+    createTileLayer(map?: L.Map): L.TileLayer;
+    /**
+     * Calculates tile bounds based on image dimensions
+     *
+     * Uses the minimum zoom level to ensure consistent coordinate system
+     * across all zoom levels.
+     *
+     * @returns Leaflet bounds for the tile layer
+     */
+    calculateTileBounds(): L.LatLngBoundsExpression;
+    /**
+     * Calculates tile grid dimensions for a specific zoom level
+     *
+     * @param zoom - Zoom level to calculate grid for
+     * @returns Object with tileX and tileY counts
+     */
+    calculateGridSize(zoom: number): {
+        tileX: number;
+        tileY: number;
+    };
+    /**
+     * Generates a tile URL for specific coordinates
+     *
+     * @param z - Zoom level
+     * @param x - Tile X coordinate
+     * @param y - Tile Y coordinate
+     * @returns Complete tile URL
+     */
+    getTileUrl(z: number, x: number, y: number): string;
+    /**
+     * Gets the current tile layer instance
+     *
+     * @returns The tile layer, or null if not created
+     */
+    getTileLayer(): L.TileLayer | null;
+    /**
+     * Removes the tile layer from the map and cleans up
+     *
+     * @param map - Optional map instance to remove layer from
+     */
+    removeTileLayer(map?: L.Map): void;
+    /**
+     * Sets up event listeners for tile loading events
+     *
+     * @param _map - Leaflet map instance (unused but kept for future use)
+     */
+    private setupEventListeners;
+    /**
+     * Gets the image info configuration
+     *
+     * @returns Image info object
+     */
+    getImageInfo(): ImageInfo;
+    /**
+     * Gets the tile configuration
+     *
+     * @returns Tile configuration object
+     */
+    getConfig(): TileConfig;
+}
+//# sourceMappingURL=tile-layer-manager.d.ts.map

package/dist/lib/tile-layer-manager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tile-layer-manager.d.ts","sourceRoot":"","sources":["../../src/lib/tile-layer-manager.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,MAAM,SAAS,CAAC;AACxB,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAQ5D;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,qBAAa,gBAAgB;IAC3B,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,SAAS,CAA4B;IAE7C;;;;;;OAMG;gBACS,MAAM,EAAE,UAAU;IAmB9B;;;;;;;OAOG;IACH,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,SAAS;IAkDzC;;;;;;;OAOG;IACH,mBAAmB,IAAI,CAAC,CAAC,sBAAsB;IAK/C;;;;;OAKG;IACH,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE;IAKjE;;;;;;;OAOG;IACH,UAAU,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM;IAInD;;;;OAIG;IACH,YAAY,IAAI,CAAC,CAAC,SAAS,GAAG,IAAI;IAIlC;;;;OAIG;IACH,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,IAAI;IAUlC;;;;OAIG;IAEH,OAAO,CAAC,mBAAmB;IAwB3B;;;;OAIG;IACH,YAAY,IAAI,SAAS;IAIzB;;;;OAIG;IACH,SAAS,IAAI,UAAU;CAGxB"}

package/dist/lib/viewer.d.ts

@@ -0,0 +1,135 @@
+import L from 'leaflet';
+import type { ViewerConfig, MapOptions } from '@edgepdf/types';
+import { TileLayerManager } from './tile-layer-manager.js';
+import { CoordinateMapper } from './coordinate-mapper.js';
+import { ZoomController } from './zoom-controller.js';
+import { MarkerManager } from './marker-manager.js';
+/**
+ * EdgePdfViewer - Core class for initializing and managing Leaflet map instances
+ *
+ * This class provides the foundation for the EdgePDF viewer, handling:
+ * - Leaflet map initialization with custom CRS
+ * - Map container lifecycle management
+ * - Basic cleanup and disposal
+ *
+ * @example
+ * ```typescript
+ * const viewer = new EdgePdfViewer({
+ *   container: document.getElementById('map'),
+ *   config: {
+ *     tileUrl: 'https://example.com/tiles/{z}/{x}/{y}.png',
+ *     imageInfo: {
+ *       width: 2000,
+ *       height: 3000,
+ *       tileSize: 256,
+ *       maxZoom: 5,
+ *       minZoom: 0
+ *     }
+ *   }
+ * });
+ *
+ * viewer.initialize();
+ * ```
+ */
+export declare class EdgePdfViewer {
+    private map;
+    private container;
+    private config;
+    private mapOptions?;
+    private tileLayerManager;
+    private coordinateMapper;
+    private zoomController;
+    private markerManager;
+    /**
+     * Creates a new EdgePdfViewer instance
+     *
+     * @param options - Configuration options for the viewer
+     * @param options.container - HTML element that will contain the map
+     * @param options.config - Viewer configuration with tile URL and image info
+     * @param options.mapOptions - Optional Leaflet map options
+     *
+     * @throws {Error} If container is not provided or invalid
+     * @throws {Error} If config is not provided or invalid
+     */
+    constructor(options: {
+        container: HTMLElement;
+        config: ViewerConfig;
+        mapOptions?: MapOptions;
+    });
+    /**
+     * Initializes the Leaflet map with custom CRS
+     *
+     * Sets up a custom coordinate reference system (CRS.Simple) suitable for
+     * displaying image tiles without geographic coordinates.
+     *
+     * @throws {Error} If map initialization fails
+     */
+    initialize(): void;
+    /**
+     * Calculates optimal initial zoom based on device type
+     *
+     * Mobile devices start zoomed out for overview, desktop starts with more detail.
+     *
+     * @returns Calculated zoom level
+     */
+    private calculateOptimalInitialZoom;
+    /**
+     * Adds CSS for seamless tile rendering
+     *
+     * Removes borders and gaps between tiles for a seamless appearance.
+     */
+    private addSeamlessTileStyles;
+    /**
+     * Gets the Leaflet map instance
+     *
+     * @returns The Leaflet map instance, or null if not initialized
+     */
+    getMap(): L.Map | null;
+    /**
+     * Checks if the map is initialized
+     *
+     * @returns True if map is initialized, false otherwise
+     */
+    isInitialized(): boolean;
+    /**
+     * Adds the tile layer to the map
+     *
+     * Creates a TileLayerManager and adds the tile layer to the initialized map.
+     * This is called automatically during initialization.
+     *
+     * @throws {Error} If map is not initialized or tile layer creation fails
+     */
+    private addTileLayer;
+    /**
+     * Gets the tile layer manager instance
+     *
+     * @returns The tile layer manager, or null if not created
+     */
+    getTileLayerManager(): TileLayerManager | null;
+    /**
+     * Gets the coordinate mapper instance
+     *
+     * @returns The coordinate mapper, or null if not created
+     */
+    getCoordinateMapper(): CoordinateMapper | null;
+    /**
+     * Gets the zoom controller instance
+     *
+     * @returns The zoom controller, or null if not created
+     */
+    getZoomController(): ZoomController | null;
+    /**
+     * Gets the marker manager instance
+     *
+     * @returns The marker manager, or null if not created
+     */
+    getMarkerManager(): MarkerManager | null;
+    /**
+     * Disposes of the map instance and cleans up resources
+     *
+     * This should be called when the viewer is no longer needed to prevent
+     * memory leaks and event listener issues.
+     */
+    dispose(): void;
+}
+//# sourceMappingURL=viewer.d.ts.map

package/dist/lib/viewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewer.d.ts","sourceRoot":"","sources":["../../src/lib/viewer.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,MAAM,SAAS,CAAC;AACxB,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,qBAAa,aAAa;IACxB,OAAO,CAAC,GAAG,CAAsB;IACjC,OAAO,CAAC,SAAS,CAAc;IAC/B,OAAO,CAAC,MAAM,CAAe;IAC7B,OAAO,CAAC,UAAU,CAAC,CAAa;IAChC,OAAO,CAAC,gBAAgB,CAAiC;IACzD,OAAO,CAAC,gBAAgB,CAAiC;IACzD,OAAO,CAAC,cAAc,CAA+B;IACrD,OAAO,CAAC,aAAa,CAA8B;IAEnD;;;;;;;;;;OAUG;gBACS,OAAO,EAAE;QACnB,SAAS,EAAE,WAAW,CAAC;QACvB,MAAM,EAAE,YAAY,CAAC;QACrB,UAAU,CAAC,EAAE,UAAU,CAAC;KACzB;IAmBD;;;;;;;OAOG;IACH,UAAU,IAAI,IAAI;IAsFlB;;;;;;OAMG;IACH,OAAO,CAAC,2BAA2B;IAmBnC;;;;OAIG;IACH,OAAO,CAAC,qBAAqB;IAuB7B;;;;OAIG;IACH,MAAM,IAAI,CAAC,CAAC,GAAG,GAAG,IAAI;IAItB;;;;OAIG;IACH,aAAa,IAAI,OAAO;IAIxB;;;;;;;OAOG;IACH,OAAO,CAAC,YAAY;IAwBpB;;;;OAIG;IACH,mBAAmB,IAAI,gBAAgB,GAAG,IAAI;IAI9C;;;;OAIG;IACH,mBAAmB,IAAI,gBAAgB,GAAG,IAAI;IAI9C;;;;OAIG;IACH,iBAAiB,IAAI,cAAc,GAAG,IAAI;IAI1C;;;;OAIG;IACH,gBAAgB,IAAI,aAAa,GAAG,IAAI;IAIxC;;;;;OAKG;IACH,OAAO,IAAI,IAAI;CA0BhB"}

package/dist/lib/zoom-controller.d.ts

@@ -0,0 +1,182 @@
+import L from 'leaflet';
+import type { ImageInfo, ZoomConfig, ZoomState } from '@edgepdf/types';
+/**
+ * ZoomController - Manages zoom state and operations for the viewer
+ *
+ * This class provides:
+ * - Zoom state management
+ * - Zoom level calculations from image dimensions
+ * - Zoom constraints enforcement
+ * - Responsive initial zoom calculation
+ * - Zoom control methods (zoomIn, zoomOut, setZoom)
+ * - Zoom event handling
+ *
+ * @example
+ * ```typescript
+ * const zoomController = new ZoomController({
+ *   map: leafletMap,
+ *   imageInfo: {
+ *     width: 2000,
+ *     height: 3000,
+ *     tileSize: 256,
+ *     maxZoom: 5,
+ *     minZoom: 0
+ *   }
+ * });
+ *
+ * // Zoom in
+ * zoomController.zoomIn();
+ *
+ * // Zoom out
+ * zoomController.zoomOut();
+ *
+ * // Set specific zoom level
+ * zoomController.setZoom(3);
+ *
+ * // Get current zoom state
+ * const state = zoomController.getZoomState();
+ * ```
+ */
+export declare class ZoomController {
+    private map;
+    private imageInfo;
+    private config;
+    private zoomState;
+    private zoomChangeListeners;
+    /**
+     * Creates a new ZoomController instance
+     *
+     * @param options - Configuration options
+     * @param options.map - Leaflet map instance
+     * @param options.imageInfo - Image information for zoom calculations
+     * @param options.config - Optional zoom configuration (overrides imageInfo zoom levels)
+     *
+     * @throws {Error} If map is not provided or invalid
+     * @throws {Error} If imageInfo is invalid
+     */
+    constructor(options: {
+        map: L.Map;
+        imageInfo: ImageInfo;
+        config?: Partial<ZoomConfig>;
+    });
+    /**
+     * Calculates maximum zoom level from image dimensions
+     *
+     * The calculation considers:
+     * - Image dimensions and tile size
+     * - Sharp pixel limit (16,383px per dimension) for performance
+     * - Practical maximum zoom level (typically 5)
+     *
+     * @returns Calculated maximum zoom level
+     */
+    calculateMaxZoomFromDimensions(): number;
+    /**
+     * Calculates optimal initial zoom based on viewport size
+     *
+     * Mobile devices start zoomed out for overview, desktop starts with more detail.
+     *
+     * @returns Calculated initial zoom level
+     */
+    calculateOptimalInitialZoom(): number;
+    /**
+     * Constrains a zoom level to the valid range
+     *
+     * @param zoom - Zoom level to constrain
+     * @returns Constrained zoom level within [minZoom, maxZoom]
+     */
+    constrainZoom(zoom: number): number;
+    /**
+     * Validates if a zoom level is within the valid range
+     *
+     * @param zoom - Zoom level to validate
+     * @returns True if zoom is valid, false otherwise
+     */
+    isValidZoom(zoom: number): boolean;
+    /**
+     * Zooms in by the configured zoom delta
+     *
+     * @param options - Optional zoom options
+     * @param options.animate - Whether to animate the zoom (default: true)
+     * @returns True if zoom was successful, false if already at max zoom
+     */
+    zoomIn(options?: {
+        animate?: boolean;
+    }): boolean;
+    /**
+     * Zooms out by the configured zoom delta
+     *
+     * @param options - Optional zoom options
+     * @param options.animate - Whether to animate the zoom (default: true)
+     * @returns True if zoom was successful, false if already at min zoom
+     */
+    zoomOut(options?: {
+        animate?: boolean;
+    }): boolean;
+    /**
+     * Sets the zoom level to a specific value
+     *
+     * @param zoom - Target zoom level
+     * @param options - Optional zoom options
+     * @param options.animate - Whether to animate the zoom (default: true)
+     * @throws {Error} If zoom level is not a finite number
+     */
+    setZoom(zoom: number, options?: {
+        animate?: boolean;
+    }): void;
+    /**
+     * Gets the current zoom state
+     *
+     * @returns Current zoom state
+     */
+    getZoomState(): ZoomState;
+    /**
+     * Gets the current zoom level
+     *
+     * @returns Current zoom level
+     */
+    getZoom(): number;
+    /**
+     * Gets the minimum zoom level
+     *
+     * @returns Minimum zoom level
+     */
+    getMinZoom(): number;
+    /**
+     * Gets the maximum zoom level
+     *
+     * @returns Maximum zoom level
+     */
+    getMaxZoom(): number;
+    /**
+     * Checks if zoom can be increased
+     *
+     * @returns True if zoom can be increased, false otherwise
+     */
+    canZoomIn(): boolean;
+    /**
+     * Checks if zoom can be decreased
+     *
+     * @returns True if zoom can be decreased, false otherwise
+     */
+    canZoomOut(): boolean;
+    /**
+     * Adds a listener for zoom change events
+     *
+     * @param listener - Callback function called when zoom changes
+     * @returns Function to remove the listener
+     */
+    onZoomChange(listener: (state: ZoomState) => void): () => void;
+    /**
+     * Removes all zoom change listeners
+     */
+    removeAllListeners(): void;
+    /**
+     * Sets up zoom event listeners on the map
+     */
+    private setupZoomListeners;
+    /**
+     * Disposes of the zoom controller and cleans up resources
+     */
+    dispose(): void;
+}
+//# sourceMappingURL=zoom-controller.d.ts.map

package/dist/lib/zoom-controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"zoom-controller.d.ts","sourceRoot":"","sources":["../../src/lib/zoom-controller.ts"],"names":[],"mappings":"AAAA,OAAO,CAAC,MAAM,SAAS,CAAC;AACxB,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEvE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,qBAAa,cAAc;IACzB,OAAO,CAAC,GAAG,CAAQ;IACnB,OAAO,CAAC,SAAS,CAAY;IAC7B,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,SAAS,CAAY;IAC7B,OAAO,CAAC,mBAAmB,CAA8C;IAEzE;;;;;;;;;;OAUG;gBACS,OAAO,EAAE;QACnB,GAAG,EAAE,CAAC,CAAC,GAAG,CAAC;QACX,SAAS,EAAE,SAAS,CAAC;QACrB,MAAM,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;KAC9B;IAkDD;;;;;;;;;OASG;IACH,8BAA8B,IAAI,MAAM;IAsBxC;;;;;;OAMG;IACH,2BAA2B,IAAI,MAAM;IAoBrC;;;;;OAKG;IACH,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;IAOnC;;;;;OAKG;IACH,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAQlC;;;;;;OAMG;IACH,MAAM,CAAC,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO;IAahD;;;;;;OAMG;IACH,OAAO,CAAC,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,OAAO,CAAA;KAAE,GAAG,OAAO;IAajD;;;;;;;OAOG;IACH,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE;QAAE,OAAO,CAAC,EAAE,OAAO,CAAA;KAAE,GAAG,IAAI;IAe5D;;;;OAIG;IACH,YAAY,IAAI,SAAS;IAIzB;;;;OAIG;IACH,OAAO,IAAI,MAAM;IAIjB;;;;OAIG;IACH,UAAU,IAAI,MAAM;IAIpB;;;;OAIG;IACH,UAAU,IAAI,MAAM;IAIpB;;;;OAIG;IACH,SAAS,IAAI,OAAO;IAIpB;;;;OAIG;IACH,UAAU,IAAI,OAAO;IAIrB;;;;;OAKG;IACH,YAAY,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,GAAG,MAAM,IAAI;IAS9D;;OAEG;IACH,kBAAkB,IAAI,IAAI;IAI1B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAwB1B;;OAEG;IACH,OAAO,IAAI,IAAI;CAKhB"}

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@edgepdf/viewer-js",
+  "version": "0.0.1",
+  "description": "EdgePDF Viewer - JavaScript library for viewing PDF documents with interactive markers and zoom controls",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/EdgeTechStudio/EdgePDF.git",
+    "directory": "packages/viewer-js"
+  },
+  "keywords": [
+    "pdf",
+    "viewer",
+    "leaflet",
+    "markers",
+    "zoom",
+    "interactive"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "@edge-pdf/workspace": "./src/index.ts",
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./styles.css": "./src/styles.css"
+  },
+  "files": [
+    "dist",
+    "!**/*.tsbuildinfo"
+  ],
+  "dependencies": {
+    "leaflet": "^1.9.4"
+  },
+  "devDependencies": {
+    "@edgepdf/types": "workspace:*",
+    "@edgepdf/utils": "workspace:*",
+    "@types/leaflet": "^1.9.21",
+    "jest-environment-jsdom": "^30.0.2"
+  }
+}