@knaw-huc/osd-iiif-viewer 0.2.0 → 0.2.2

package/dist/index.js

@@ -1796,7 +1796,15 @@ const defaultState$1 = {
   setIsFullPage: (isFullPage) => set({ isFullPage }),
   setRotation: (rotation) => set({ rotation }),
   reset: () => set(defaultState)
-}), defaultManifest = {
+});
+function findCanvasIndex(vault, manifestId, canvasId) {
+  return vault.get({ id: manifestId, type: "Manifest" }).items.findIndex((item) => vault.get(item).id === canvasId);
+}
+function orThrow(msg) {
+  throw new Error(msg);
+}
+const defaultManifest = {
+  id: null,
   url: null,
   isLoading: !1,
   isReady: !1,
@@ -1804,10 +1812,20 @@ const defaultState$1 = {
 }, createManifestSlice = (vault) => (set) => ({
   vault,
   ...defaultManifest,
-  loadManifest: async (url) => {
+  loadManifest: async (url, initialCanvasId) => {
     set({ url, isLoading: !0, error: null });
     try {
-      await vault.loadManifest(url), set({ isLoading: !1, error: null });
+      const id = (await vault.loadManifest(url))?.id || orThrow("No manifest"), updates = {
+        id,
+        url,
+        isLoading: !1,
+        error: null
+      };
+      if (initialCanvasId) {
+        const index = findCanvasIndex(vault, id, initialCanvasId);
+        index !== -1 && (updates.currentIndex = index);
+      }
+      set(updates);
     } catch (e2) {
       const error = e2 instanceof Error ? e2.message : "Unknown error";
       set({ isLoading: !1, error });
@@ -1819,12 +1837,23 @@ const defaultState$1 = {
 }, createCanvasSlice = (set, get) => ({
   ...defaultCanvas,
   goToCanvas: (index) => {
-    const { vault, url } = get();
-    if (!url)
+    const { vault, id: manifestId } = get();
+    if (!manifestId)
       return;
-    const manifest = vault.get({ id: url, type: "Manifest" }), clamped = Math.max(0, Math.min(index, manifest.items.length - 1));
+    const manifest = vault.get({ id: manifestId, type: "Manifest" }), clamped = Math.max(0, Math.min(index, manifest.items.length - 1));
     set({ currentIndex: clamped });
   },
+  goToCanvasById: (id) => {
+    const { vault, id: manifestId, goToCanvas } = get();
+    if (!manifestId)
+      return;
+    const index = findCanvasIndex(vault, manifestId, id);
+    if (index === -1) {
+      console.warn(`Canvas not found: ${id}`);
+      return;
+    }
+    goToCanvas(index);
+  },
   nextCanvas: () => {
     const { currentIndex, goToCanvas } = get();
     goToCanvas(currentIndex + 1);
@@ -1850,9 +1879,6 @@ const defaultState$1 = {
     };
   });
 }, ViewerContext = createContext(null);
-function orThrow(msg) {
-  throw new Error(msg);
-}
 function useViewerStore() {
   return useContext(ViewerContext) ?? orThrow("viewer hook must be used within viewer provider");
 }
@@ -1926,7 +1952,14 @@ function getImageServiceId(vault, canvas) {
   if (!isExternalWebResource(resource))
     return null;
   const services = de(resource);
-  return services.length ? H(services[0]) ?? null : null;
+  return services.length ? H(services[0]) ?? null : getImageServiceIdWithoutProfileCheck(resource);
+}
+function getImageServiceIdWithoutProfileCheck(resource) {
+  const service = resource.service;
+  if (!Array.isArray(service) || !service.length)
+    return null;
+  const first = service[0];
+  return typeof first == "object" && first && "id" in first ? first.id : null;
 }
 function isExternalWebResource(resource) {
   return resource.type !== "SpecificResource";
@@ -1940,17 +1973,26 @@ function useViewerStoreSelector(selector) {
   return useStore(store, selector);
 }
 function useCanvas() {
-  const vault = useViewerStoreSelector((s2) => s2.vault), url = useViewerStoreSelector((s2) => s2.url), isLoading = useViewerStoreSelector((s2) => s2.isLoading), currentIndex = useViewerStoreSelector((s2) => s2.currentIndex), goTo = useViewerStoreSelector((s2) => s2.goToCanvas), next = useViewerStoreSelector((s2) => s2.nextCanvas), prev = useViewerStoreSelector((s2) => s2.prevCanvas), { current, total } = useMemo(() => {
-    if (!url || isLoading)
+  const vault = useViewerStoreSelector((s2) => s2.vault), id = useViewerStoreSelector((s2) => s2.id), isLoading = useViewerStoreSelector((s2) => s2.isLoading), currentIndex = useViewerStoreSelector((s2) => s2.currentIndex), goTo = useViewerStoreSelector((s2) => s2.goToCanvas), goToById = useViewerStoreSelector((s2) => s2.goToCanvasById), next = useViewerStoreSelector((s2) => s2.nextCanvas), prev = useViewerStoreSelector((s2) => s2.prevCanvas), { current, total } = useMemo(() => {
+    if (!id || isLoading)
       return { current: null, total: 0 };
-    const manifest = vault.get({ id: url, type: "Manifest" }), canvasRef = manifest.items[currentIndex] ?? orThrow("No canvas ref for " + currentIndex), current2 = vault.get(canvasRef), total2 = manifest.items.length;
+    const manifest = vault.get({ id, type: "Manifest" }), canvasRef = manifest.items[currentIndex] ?? orThrow("No canvas ref for " + currentIndex), current2 = vault.get(canvasRef), total2 = manifest.items.length;
     return { current: current2, total: total2 };
-  }, [vault, url, isLoading, currentIndex]);
-  return { currentIndex, current, total, goTo, next, prev };
+  }, [vault, id, isLoading, currentIndex]), currentCanvasId = current?.id ?? null;
+  return {
+    currentIndex,
+    currentCanvasId,
+    current,
+    total,
+    goTo,
+    goToById,
+    next,
+    prev
+  };
 }
 function useManifest() {
-  const vault = useViewerStoreSelector((s2) => s2.vault), url = useViewerStoreSelector((s2) => s2.url), isLoading = useViewerStoreSelector((s2) => s2.isLoading), error = useViewerStoreSelector((s2) => s2.error), loadManifest = useViewerStoreSelector((s2) => s2.loadManifest);
-  return { vault, url, isLoading, error, isReady: !!url && !isLoading && !error, loadManifest };
+  const vault = useViewerStoreSelector((s2) => s2.vault), id = useViewerStoreSelector((s2) => s2.id), url = useViewerStoreSelector((s2) => s2.url), isLoading = useViewerStoreSelector((s2) => s2.isLoading), error = useViewerStoreSelector((s2) => s2.error), loadManifest = useViewerStoreSelector((s2) => s2.loadManifest);
+  return { vault, id, url, isLoading, error, isReady: !!url && !isLoading && !error, loadManifest };
 }
 function useLoadManifest() {
   return useViewerStoreSelector((s2) => s2.loadManifest);
@@ -2048,23 +2090,23 @@ function useImageInfo() {
   }, [viewer, ready]);
 }
 function Overlay({ location, children }) {
-  const viewer = useViewer(), [container] = useState(() => {
-    const el = document.createElement("div");
-    return el.style.position = "absolute", el.style.pointerEvents = "none", el;
+  const viewer = useViewer(), [overlay] = useState(() => {
+    const div = document.createElement("div");
+    return div.style.position = "absolute", div.style.pointerEvents = "none", div;
   });
   return useEffect(() => {
-    function stopPropagation(e2) {
-      e2.target !== container && e2.stopPropagation();
+    function stopPropagation(event) {
+      event.target !== overlay && event.stopPropagation();
     }
-    return container.addEventListener("pointerdown", stopPropagation), () => {
-      container.removeEventListener("pointerdown", stopPropagation);
+    return overlay.addEventListener("pointerdown", stopPropagation), () => {
+      overlay.removeEventListener("pointerdown", stopPropagation);
     };
-  }, [container]), useEffect(() => {
+  }, [overlay]), useEffect(() => {
     if (viewer)
-      return viewer.addOverlay({ element: container, location }), () => {
-        viewer.isOpen() && viewer.removeOverlay(container);
+      return viewer.addOverlay({ element: overlay, location }), () => {
+        viewer.isOpen() && viewer.removeOverlay(overlay);
       };
-  }, [viewer, location, container]), viewer ? createPortal(children, container) : null;
+  }, [viewer, location, overlay]), viewer ? createPortal(children, overlay) : null;
 }
 function ViewerProvider({ children }) {
   const [store] = useState(() => createViewerStore());

package/dist/manifest/CanvasSlice.d.ts

@@ -6,6 +6,7 @@ export type CanvasState = {
 };
 export type CanvasSlice = Resettable & CanvasState & {
     goToCanvas: (index: number) => void;
+    goToCanvasById: (id: string) => void;
     nextCanvas: () => void;
     prevCanvas: () => void;
 };

package/dist/manifest/ManifestSlice.d.ts

@@ -3,6 +3,7 @@ import { Vault } from '@iiif/helpers/vault';
 import { ViewerStore } from '../ViewerStore.ts';
 import { Resettable } from '../Resettable.ts';
 export type ManifestState = {
+    id: string | null;
     url: string | null;
     isLoading: boolean;
     error: string | null;
@@ -10,6 +11,6 @@ export type ManifestState = {
 };
 export type ManifestSlice = Resettable & ManifestState & {
     vault: Vault;
-    loadManifest: (url: string) => Promise<void>;
+    loadManifest: (url: string, initialCanvasId?: string) => Promise<void>;
 };
 export declare const createManifestSlice: (vault: Vault) => StateCreator<ViewerStore, [], [], ManifestSlice>;

package/dist/manifest/findCanvasIndex.d.ts

@@ -0,0 +1,2 @@
+import { Vault } from '@iiif/helpers/vault';
+export declare function findCanvasIndex(vault: Vault, manifestId: string, canvasId: string): number;

package/dist/manifest/useCanvas.d.ts

@@ -1,9 +1,11 @@
 import { CanvasNormalized } from '@iiif/presentation-3-normalized';
 export declare function useCanvas(): {
     currentIndex: number;
+    currentCanvasId: string | null;
     current: CanvasNormalized | null;
     total: number;
     goTo: (index: number) => void;
+    goToById: (id: string) => void;
     next: () => void;
     prev: () => void;
 };

package/dist/manifest/useManifest.d.ts

@@ -1,9 +1,10 @@
 export declare function useManifest(): {
     vault: import('@iiif/helpers/vault').Vault;
+    id: string | null;
     url: string | null;
     isLoading: boolean;
     error: string | null;
     isReady: boolean;
-    loadManifest: (url: string) => Promise<void>;
+    loadManifest: (url: string, initialCanvasId?: string) => Promise<void>;
 };
-export declare function useLoadManifest(): (url: string) => Promise<void>;
+export declare function useLoadManifest(): (url: string, initialCanvasId?: string) => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@knaw-huc/osd-iiif-viewer",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "repository": {
     "type": "git",
     "url": "https://github.com/knaw-huc/osd-iiif-viewer.git"