Support IIIF images with no Image API service

.github/workflows/test.yml

@@ -0,0 +1,35 @@
+name: Test
+
+on:
+  push:
+    branches:
+      - develop
+      - main
+  pull_request:
+
+permissions:
+  contents: read
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v6
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v6
+        with:
+          node-version: '24'
+
+      - name: Install dependencies
+        run: yarn install
+
+      - name: Install Elm globally
+        run: npm install -g elm
+
+      - name: Run Elm tests
+        run: yarn test
+
+      - name: Build
+        run: make build build-dev

build/diva.debug.js

@@ -16421,7 +16421,6 @@
   var $author$project$Model$iiifImageToPageImage = F3(
     function(language, allImages, image) {
       var tileSource = $rism_digital$elm_iiif$IIIF$Image$createImageAddress(image.id);
-      var thumbUrl = $rism_digital$elm_iiif$IIIF$Image$thumbnailUrlFromInfo(tileSource);
       var label = A2(
         $elm$core$Maybe$withDefault,
         "Image",
@@ -16431,6 +16430,8 @@
           image.label
         )
       );
+      var isStatic = $elm$core$List$isEmpty(image.service);
+      var thumbUrl = isStatic ? tileSource : $rism_digital$elm_iiif$IIIF$Image$thumbnailUrlFromInfo(tileSource);
       var isPrimaryImage = $author$project$Utilities$isNothing(
         A2(
           $author$project$Utilities$find,
@@ -16445,7 +16446,7 @@
         $elm$core$List$head(allImages)
       );
       var isPrimary = _Utils_eq(image.imageType, $rism_digital$elm_iiif$IIIF$Presentation$PrimaryImage) || isPrimaryImage && isFirst;
-      return { isPrimary, label, thumbUrl, tileSource };
+      return { isPrimary, isStatic, label, thumbUrl, tileSource };
     }
   );
   var $author$project$Model$canvasToPage = F2(
@@ -16519,7 +16520,24 @@
   };
   var $author$project$Main$tileSourcesUpdated = _Platform_outgoingPort(
     "tileSourcesUpdated",
-    $elm$json$Json$Encode$list($elm$json$Json$Encode$string)
+    $elm$json$Json$Encode$list(
+      function($) {
+        return $elm$json$Json$Encode$object(
+          _List_fromArray(
+            [
+              _Utils_Tuple2(
+                "isStatic",
+                $elm$json$Json$Encode$bool($.isStatic)
+              ),
+              _Utils_Tuple2(
+                "url",
+                $elm$json$Json$Encode$string($.url)
+              )
+            ]
+          )
+        );
+      }
+    )
   );
   var $rism_digital$elm_iiif$IIIF$Presentation$toRanges = $rism_digital$elm_iiif$IIIF$Presentation$withManifest(
     function($) {
@@ -16554,8 +16572,8 @@
           $elm$core$Basics$composeR,
           $author$project$Model$primaryImage,
           $elm$core$Maybe$map(
-            function($) {
-              return $.tileSource;
+            function(image) {
+              return { isStatic: image.isStatic, url: image.tileSource };
             }
           )
         ),
@@ -17076,6 +17094,10 @@
                 );
               })($.filters)
             ),
+            _Utils_Tuple2(
+              "isStatic",
+              $elm$json$Json$Encode$bool($.isStatic)
+            ),
             _Utils_Tuple2(
               "tileSource",
               $elm$json$Json$Encode$string($.tileSource)
@@ -17103,7 +17125,7 @@
             $elm$core$Maybe$map,
             function(image) {
               return $author$project$Main$filterPreviewUpdated(
-                { aspect: page.aspect, filters: model.filters, tileSource: image.tileSource }
+                { aspect: page.aspect, filters: model.filters, isStatic: image.isStatic, tileSource: image.tileSource }
               );
             },
             $elm$core$List$head(
@@ -28757,6 +28779,7 @@
     target.appendChild(styleEl);
   };
   injectStyles(diva_default);
+  var toViewerTileSource = (url, isStatic) => isStatic ? { type: "image", url } : url;
   var Diva = class {
     constructor(rootId, flags) {
       this.mainViewer = null;
@@ -28817,7 +28840,10 @@
     }
     bindPorts() {
       this.getPort("tileSourcesUpdated").subscribe((tileSources) => {
-        this.callViewerMethod("setTileSources", tileSources);
+        this.callViewerMethod(
+          "setTileSources",
+          tileSources.map((entry) => toViewerTileSource(entry.url, entry.isStatic))
+        );
       });
       this.getPort("pageAspectsUpdated").subscribe((aspects) => {
         this.callViewerMethod("setPageAspects", aspects);
@@ -28894,7 +28920,7 @@
         const tileSourceChanged = this.currentFilterTileSource !== payload.tileSource;
         if (tileSourceChanged) {
           this.currentFilterTileSource = payload.tileSource;
-          this.filterViewer.open(payload.tileSource);
+          this.filterViewer.open(toViewerTileSource(payload.tileSource, payload.isStatic));
         } else {
           this.applyFilterOptions();
         }

elm.json

@@ -26,7 +26,11 @@
         }
     },
     "test-dependencies": {
-        "direct": {},
-        "indirect": {}
+        "direct": {
+            "elm-explorations/test": "2.2.1"
+        },
+        "indirect": {
+            "elm/random": "1.0.0"
+        }
     }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "diva.js",
-  "version": "7.3.0",
+  "version": "7.3.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -22,12 +22,14 @@
   ],
   "scripts": {
     "format": "find src -name \"*.ts\" -print0 | xargs -0 clang-format -i",
-    "develop": "chokidar \"src/**/*\" \"scripts/elm-esm.sh\" \"Makefile\" -c \"make build-dev\""
+    "develop": "chokidar \"src/**/*\" \"scripts/elm-esm.sh\" \"Makefile\" -c \"make build-dev\"",
+    "test": "elm-test-rs"
   },
   "devDependencies": {
     "@types/openseadragon": "^5.0.2",
     "chokidar-cli": "^3.0.0",
     "concurrently": "^9.2.1",
+    "elm-test-rs": "^3.0.2-0",
     "esbuild": "^0.28.1",
     "lightningcss": "^1.31.1",
     "typescript": "^5.9.3"

src/Main.elm

@@ -23,6 +23,7 @@ port copyToClipboard : String -> Cmd msg
 
 port filterPreviewUpdated :
     { tileSource : String
+    , isStatic : Bool
     , aspect : Float
     , filters : Filters
     }
@@ -59,7 +60,7 @@ port scrollToIndex : Int -> Cmd msg
 port setFullscreen : Bool -> Cmd msg
 
 
-port tileSourcesUpdated : List String -> Cmd msg
+port tileSourcesUpdated : List { url : String, isStatic : Bool } -> Cmd msg
 
 
 port viewerLoadingChanged : (Bool -> msg) -> Sub msg
@@ -163,7 +164,9 @@ handleManifestLoaded model manifest =
             manifestToPages model.detectedLanguage manifest
 
         tileSources =
-            List.filterMap (primaryImage >> Maybe.map .tileSource) pages
+            List.filterMap
+                (primaryImage >> Maybe.map (\image -> { url = image.tileSource, isStatic = image.isStatic }))
+                pages
 
         pageAspects =
             List.map .aspect pages
@@ -549,6 +552,7 @@ sendPageViewPreview model =
                                     { aspect = page.aspect
                                     , filters = model.filters
                                     , tileSource = image.tileSource
+                                    , isStatic = image.isStatic
                                     }
                             )
                 )

src/Model.elm

@@ -77,6 +77,7 @@ type alias PageImage =
     , thumbUrl : String
     , label : String
     , isPrimary : Bool
+    , isStatic : Bool
     }
 
 
@@ -189,8 +190,17 @@ iiifImageToPageImage language allImages image =
         tileSource =
             createImageAddress image.id
 
+        isStatic =
+            List.isEmpty image.service
+
         thumbUrl =
-            thumbnailUrlFromInfo tileSource
+            if isStatic then
+                -- A static image has no Image API, so there is no derivative
+                -- URL to request; fall back to the full image itself.
+                tileSource
+
+            else
+                thumbnailUrlFromInfo tileSource
 
         label =
             Maybe.map (extractLabelFromLanguageMap language) image.label
@@ -210,4 +220,5 @@ iiifImageToPageImage language allImages image =
     , thumbUrl = thumbUrl
     , label = label
     , isPrimary = isPrimary
+    , isStatic = isStatic
     }

src/diva.ts

@@ -116,12 +116,21 @@ type FilterSettings = {
 };
 
 type FilterPreviewPayload = {
-    tileSource: string; aspect : number;
+    tileSource: string; isStatic : boolean; aspect : number;
     filters?: FilterSettings;
 };
 
+type TileSourceEntry = { url: string; isStatic: boolean };
+
+/**
+ * A static image has no IIIF Image API, so OpenSeadragon must be told to treat
+ * it as a plain image rather than fetching it as an info.json tile pyramid.
+ */
+const toViewerTileSource = (url: string, isStatic: boolean): string | {type: string; url: string} =>
+    isStatic ? {type : "image", url} : url;
+
 type ElmPorts = {
-    tileSourcesUpdated: {subscribe: (callback: (tileSources: string[]) => void) => void};
+    tileSourcesUpdated: {subscribe: (callback: (tileSources: TileSourceEntry[]) => void) => void};
     pageAspectsUpdated : {subscribe : (callback: (aspects: number[]) => void) => void};
     pageLabelsUpdated : {subscribe : (callback: (labels: string[]) => void) => void};
     zoomLevelUpdated : {subscribe : (callback: (zoom: number) => void) => void};
@@ -240,7 +249,12 @@ class Diva
     private bindPorts(): void
     {
         this.getPort("tileSourcesUpdated")
-            .subscribe((tileSources: string[]) => { this.callViewerMethod("setTileSources", tileSources); });
+            .subscribe((tileSources: TileSourceEntry[]) => {
+                this.callViewerMethod(
+                    "setTileSources",
+                    tileSources.map((entry) => toViewerTileSource(entry.url, entry.isStatic))
+                );
+            });
 
         this.getPort("pageAspectsUpdated")
             .subscribe((aspects: number[]) => { this.callViewerMethod("setPageAspects", aspects); });
@@ -326,7 +340,7 @@ class Diva
             if (tileSourceChanged)
             {
                 this.currentFilterTileSource = payload.tileSource;
-                this.filterViewer.open(payload.tileSource);
+                this.filterViewer.open(toViewerTileSource(payload.tileSource, payload.isStatic));
             }
             else
             {

src/viewer-element.ts

@@ -2,6 +2,8 @@ import type * as OpenSeadragonType from "openseadragon";
 
 declare const OpenSeadragon: typeof OpenSeadragonType;
 
+type ViewerTileSource = string | {type: string; url: string};
+
 const ZOOM_IN_FACTOR = 1.6
 const ZOOM_OUT_FACTOR = 1 / ZOOM_IN_FACTOR
 const PAGE_LABEL_TOP_PADDING_PX = 28;
@@ -12,7 +14,7 @@ class OsdViewer extends HTMLElement
     private container: HTMLDivElement|null = null;
     private viewer: OpenSeadragonType.Viewer|null = null;
     private loadToken = 0;
-    private tileSources: string[] = [];
+    private tileSources: ViewerTileSource[] = [];
     private pageLabels: string[] = [];
     private pageAspects: number[] = [];
     private pageOffsets: number[] = [];
@@ -166,7 +168,7 @@ class OsdViewer extends HTMLElement
         this.applyLayoutChange({mode : nextMode, direction : nextDirection});
     }
 
-    public setTileSources(tileSources: string[]): void
+    public setTileSources(tileSources: ViewerTileSource[]): void
     {
         if (!Array.isArray(tileSources) || tileSources.length === 0)
         {
@@ -190,7 +192,7 @@ class OsdViewer extends HTMLElement
         });
     }
 
-    private resetTileSources(tileSources: string[]): void
+    private resetTileSources(tileSources: ViewerTileSource[]): void
     {
         if (!this.viewer)
         {