med-viewer-sdk 0.1.20 → 0.1.22

package/dist/core/ColorAdjustPlugin.d.ts

@@ -13,6 +13,7 @@ export interface ColorAdjustOptions {
     adjustments?: ColorAdjustments;
     debounceMs?: number;
     loadMode?: 'async' | 'sync';
+    onAdjustmentsChange?: (adjustments: ColorAdjustments) => void;
 }
 export declare class ColorAdjustPlugin {
     private viewer;

package/dist/core/Engine.d.ts

@@ -86,6 +86,10 @@ export declare class MedViewerEngine {
     private mountAnnotorious;
     loadAIMarks(aiBoxes?: AiBoxRect[], showLabel?: boolean): void;
     updateAIMarks(aiBoxes?: AiBoxRect[], showLabel?: boolean): void;
+    goToPosition(target: {
+        x: number;
+        y: number;
+    }, animate?: boolean, mag?: number | null): Promise<void>;
     clearAIMarks(): void;
     loadSelectionBox(selections?: SelectionBox[]): void;
     addHandler(event: string, handler: Function): void;

package/dist/core/SelectionPlugin.d.ts

@@ -13,7 +13,7 @@ export interface SelectionOptions {
     startRotated?: boolean;
     startRotatedHeight?: number;
     restrictToImage?: boolean;
-    onSelection?: (rect: OpenSeadragon.Rect) => void;
+    onSelection?: (rect: OpenSeadragon.Rect, blob: Blob | null) => void;
     onSelectionCanceled?: () => void;
     onSelectionChange?: (rect: OpenSeadragon.Rect) => void;
     onSelectionToggled?: (state: {

package/dist/med-viewer-sdk.d.ts

@@ -1,8 +1,10 @@
 import { AnnoAnnotator } from './core/AnnoAnnotator';
 import { ColorAdjustPlugin, type ColorAdjustOptions } from './core/ColorAdjustPlugin';
 import { MedViewerEngine, type MedEngineOptions } from './core/Engine';
+import type OpenSeadragonType from 'openseadragon';
+import OpenSeadragon from 'openseadragon';
 import { MagnificationPlugin, MagnificationPosition, MagnificationType, type MagnificationOptions } from './core/Magnification';
 import { ScalebarLocation, ScalebarType, type ScalebarOptions } from './core/Scalebar';
 import { SelectionPlugin, type SelectionOptions } from './core/SelectionPlugin';
 import { MedToolbar, ToolbarPosition, type ToolbarOptions } from './core/Toolbar';
-export { AnnoAnnotator, ColorAdjustPlugin, MagnificationPlugin, MagnificationPosition, MagnificationType, MedToolbar, MedViewerEngine, ScalebarLocation, ScalebarType, SelectionPlugin, ToolbarPosition, type ColorAdjustOptions, type MagnificationOptions, type MedEngineOptions, type ScalebarOptions, type SelectionOptions, type ToolbarOptions };
+export { AnnoAnnotator, ColorAdjustPlugin, MagnificationPlugin, MagnificationPosition, MagnificationType, MedToolbar, MedViewerEngine, ScalebarLocation, ScalebarType, SelectionPlugin, ToolbarPosition, OpenSeadragon, type OpenSeadragonType, type ColorAdjustOptions, type MagnificationOptions, type MedEngineOptions, type ScalebarOptions, type SelectionOptions, type ToolbarOptions };

package/dist/med-viewer-sdk.mjs

@@ -6,6 +6,7 @@ var __publicField = (obj, key, value) => {
 };
 var _a, _b, _c, _d, _e;
 import OpenSeadragon from "openseadragon";
+import { default as default2 } from "openseadragon";
 function getDefaultExportFromCjs(x2) {
   return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
 }
@@ -13156,6 +13157,8 @@ class ColorAdjustPlugin {
       },
       debounceMs: 60,
       loadMode: "async",
+      onAdjustmentsChange: () => {
+      },
       ...options
     };
     this._adjustments = { ...this.options.adjustments };
@@ -13207,6 +13210,9 @@ class ColorAdjustPlugin {
       clearTimeout(this.debounceTimer);
     this.debounceTimer = setTimeout(() => {
       this.apply();
+      if (this.options.onAdjustmentsChange) {
+        this.options.onAdjustmentsChange(this._adjustments);
+      }
       this.debounceTimer = null;
     }, this.options.debounceMs);
   }
@@ -13216,6 +13222,9 @@ class ColorAdjustPlugin {
   reset() {
     this._adjustments = { ...this.options.adjustments };
     this.apply();
+    if (this.options.onAdjustmentsChange) {
+      this.options.onAdjustmentsChange(this._adjustments);
+    }
   }
   destroy() {
     var _a2;
@@ -15296,6 +15305,10 @@ class SelectionPlugin {
     // OpenSeadragonSelection instance
     __publicField(this, "options");
     this.viewer = viewer;
+    const userOnSelection = options.onSelection;
+    if (options.onSelection) {
+      delete options.onSelection;
+    }
     this.options = {
       showSelectionControl: true,
       showConfirmDenyButtons: true,
@@ -15351,7 +15364,45 @@ class SelectionPlugin {
         background: "#4CAF50",
         border: "2px solid #4CAF50"
       },
-      ...options
+      ...options,
+      // Override onSelection to provide a blob
+      onSelection: (rect) => {
+        if (!userOnSelection) {
+          return;
+        }
+        try {
+          const viewportRect = this.viewer.viewport.imageToViewportRectangle(rect);
+          const webRect = this.viewer.viewport.viewportToViewerElementRectangle(viewportRect);
+          const pixelDensityRatio = OpenSeadragon.pixelDensityRatio || 1;
+          const { x: x2, y: y2, width, height } = webRect || {};
+          const { canvas } = this.viewer.drawer;
+          const selectionCanvas = document.createElement("canvas");
+          const ctx = selectionCanvas.getContext("2d");
+          if (!ctx) {
+            userOnSelection(rect, null);
+            return;
+          }
+          selectionCanvas.width = width * pixelDensityRatio;
+          selectionCanvas.height = height * pixelDensityRatio;
+          ctx.drawImage(
+            canvas,
+            x2 * pixelDensityRatio,
+            y2 * pixelDensityRatio,
+            width * pixelDensityRatio,
+            height * pixelDensityRatio,
+            0,
+            0,
+            width * pixelDensityRatio,
+            height * pixelDensityRatio
+          );
+          selectionCanvas.toBlob((blob) => {
+            userOnSelection(rect, blob);
+          });
+        } catch (e2) {
+          console.error("[SelectionPlugin] Error creating blob from selection:", e2);
+          userOnSelection(rect, null);
+        }
+      }
     };
     this.init();
     updateOsdTooltips();
@@ -15501,6 +15552,9 @@ const createAnnoDropdownContent = (engine, hide) => {
     btn.className = "med-tool-item";
     btn.textContent = tItem.label;
     btn.onclick = () => {
+      if (engine.selection) {
+        engine.selection.disable();
+      }
       if (engine.anno)
         engine.anno.setTool(tItem.id, selectedColor);
       hide();
@@ -15523,6 +15577,10 @@ const createColorAdjustDropdownContent = (engine, hide) => {
   var _a2;
   const container = document.createElement("div");
   container.className = "med-toolbar-dropdown-inner med-color-adjust-dropdown";
+  if (engine.anno)
+    engine.anno.setEnabled(false);
+  if (engine.selection)
+    engine.selection.disable();
   const createSlider = (labelText, id, min, max, step, initialValue, onChange) => {
     const section = document.createElement("div");
     section.className = "med-toolbar-section";
@@ -15736,6 +15794,12 @@ const DEFAULT_BUTTONS = [
     label: t("toolbar.reset"),
     onClick: (engine, hide) => {
       engine.viewer.viewport.goHome();
+      if (engine.selection) {
+        engine.selection.disable();
+      }
+      if (engine.anno) {
+        engine.anno.setEnabled(false);
+      }
       hide();
     }
   },
@@ -15757,7 +15821,11 @@ const DEFAULT_BUTTONS = [
     label: t("toolbar.screenshot"),
     onClick: (engine, hide) => {
       var _a2;
+      console.log("selection toggleState");
       (_a2 = engine.selection) == null ? void 0 : _a2.toggleState();
+      if (engine.anno) {
+        engine.anno.setEnabled(false);
+      }
       hide();
     }
   }
@@ -16401,6 +16469,38 @@ class MedViewerEngine {
   updateAIMarks(aiBoxes = [], showLabel = false) {
     this.loadAIMarks(aiBoxes, showLabel);
   }
+  async goToPosition(target, animate = true, mag = null) {
+    var _a2, _b2, _c2, _d2;
+    const point = this.viewer.viewport.imageToViewportCoordinates(target.x, target.y);
+    if (!point)
+      return;
+    if (!mag) {
+      this.viewer.viewport.panTo(point, animate);
+      return;
+    }
+    const { plugins } = this.options;
+    const config = typeof (plugins == null ? void 0 : plugins.magnification) === "object" ? plugins.magnification : {};
+    if (config.type === "LD") {
+      const tiledImage = this.viewer.world.getItemAt(0);
+      if (!tiledImage)
+        return;
+      const source = this.viewer.source;
+      const width = source.width;
+      source.height;
+      const pixelsPerMeter = typeof (plugins == null ? void 0 : plugins.scalebar) === "object" && ((_a2 = plugins == null ? void 0 : plugins.scalebar) == null ? void 0 : _a2.pixelsPerMeter) ? (_b2 = plugins == null ? void 0 : plugins.scalebar) == null ? void 0 : _b2.pixelsPerMeter : ((_c2 = this.viewer.scalebarInstance) == null ? void 0 : _c2.pixelsPerMeter) || 96;
+      const conversionFactor = 20 * 11e-4 * pixelsPerMeter / width;
+      const targetZoom = mag / conversionFactor;
+      await this.viewer.viewport.zoomTo(targetZoom, point, false);
+    } else {
+      const tiledImage = this.viewer.world.getItemAt(0);
+      if (!tiledImage)
+        return;
+      const baseMag = ((_d2 = this.viewer.source) == null ? void 0 : _d2.max_magnification) || 40;
+      const targetImageZoom = mag / baseMag;
+      const targetViewportZoom = this.viewer.viewport.imageToViewportZoom(targetImageZoom);
+      await this.viewer.viewport.zoomTo(targetViewportZoom, point, false);
+    }
+  }
   clearAIMarks() {
     const aiBoxesList = Array.from(
       document.getElementsByClassName("ld-ai-box")
@@ -16503,6 +16603,7 @@ export {
   MagnificationType,
   MedToolbar,
   MedViewerEngine,
+  default2 as OpenSeadragon,
   ScalebarLocation,
   ScalebarType,
   SelectionPlugin,