feat(embed): move /uv.html to options.embedTemplate for easier embedd…

…ing when uv.html isn't in webroot.
UniversalViewer · Dec 12, 2024 · 8c2e399 · 8c2e399
1 parent d0f6303
commit 8c2e399
Show file tree

Hide file tree

Showing 18 changed files with 104 additions and 40 deletions.
diff --git a/src/content-handlers/iiif/extensions/uv-aleph-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-aleph-extension/Extension.ts
@@ -121,16 +121,21 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 }
diff --git a/src/content-handlers/iiif/extensions/uv-aleph-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-aleph-extension/config/config.json
@@ -239,7 +239,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-av-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-av-extension/Extension.ts
@@ -149,16 +149,25 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+      rid: this.helper.rangeId?.toString() ?? ""
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}&rid=${this.helper.rangeId}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 

diff --git a/src/content-handlers/iiif/extensions/uv-av-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-av-extension/config/config.json
@@ -283,7 +283,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-default-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-default-extension/Extension.ts
@@ -116,16 +116,24 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 }
diff --git a/src/content-handlers/iiif/extensions/uv-default-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-default-extension/config/config.json
@@ -65,7 +65,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-ebook-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-ebook-extension/Extension.ts
@@ -142,16 +142,22 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      cfi: this.cfiFragement,
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&cfi=${this.cfiFragement}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 

diff --git a/src/content-handlers/iiif/extensions/uv-ebook-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-ebook-extension/config/config.json
@@ -234,7 +234,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-mediaelement-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-mediaelement-extension/Extension.ts
@@ -236,16 +236,24 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 

diff --git a/src/content-handlers/iiif/extensions/uv-mediaelement-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-mediaelement-extension/config/config.json
@@ -65,7 +65,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-model-viewer-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-model-viewer-extension/Extension.ts
@@ -255,16 +255,24 @@ export default class ModelViewerExtension extends BaseExtension<Config> {
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 }
diff --git a/src/content-handlers/iiif/extensions/uv-model-viewer-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-model-viewer-extension/config/config.json
@@ -78,7 +78,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-openseadragon-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-openseadragon-extension/Extension.ts
@@ -1369,18 +1369,30 @@ export default class OpenSeadragonExtension extends BaseExtension<Config> {
     zoom: string,
     rotation: number
   ): string {
-    const config: string = this.data.config!.uri || "";
-    const locales: string | null = this.getSerializedLocales();
+    const config: string = this.data.config?.uri ?? "";
+    const locales: string = this.getSerializedLocales() ?? "";
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+      config: config,
+      locales: locales,
+      xywh: zoom,
+      r: rotation.toString(),
+    });
+
     const appUri: string = this.getAppUri();
     const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}&config=${config}&locales=${locales}&xywh=${zoom}&r=${rotation}`;
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 

diff --git a/src/content-handlers/iiif/extensions/uv-openseadragon-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-openseadragon-extension/config/config.json
@@ -445,7 +445,7 @@
     "shareDialogue": {
       "options": {
         "embedEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareEnabled": true,
         "shareFrameEnabled": true,

diff --git a/src/content-handlers/iiif/extensions/uv-pdf-extension/Extension.ts b/src/content-handlers/iiif/extensions/uv-pdf-extension/Extension.ts
@@ -160,16 +160,24 @@ export default class Extension
   }
 
   getEmbedScript(template: string, width: number, height: number): string {
+    const hashParams = new URLSearchParams({
+      manifest: this.helper.manifestUri,
+      c: this.helper.collectionIndex.toString(),
+      m: this.helper.manifestIndex.toString(),
+      cv: this.helper.canvasIndex.toString(),
+    });
+
     const appUri: string = this.getAppUri();
-    const title: string = this.helper.getLabel() || "";
-    const iframeSrc: string = `${appUri}#?manifest=${this.helper.manifestUri}&c=${this.helper.collectionIndex}&m=${this.helper.manifestIndex}&cv=${this.helper.canvasIndex}`;
+    const title: string = this.helper.getLabel() ?? "";
     const script: string = Strings.format(
       template,
-      iframeSrc,
+      appUri,
+      hashParams.toString(),
       width.toString(),
       height.toString(),
       title
     );
+
     return script;
   }
 }
diff --git a/src/content-handlers/iiif/extensions/uv-pdf-extension/config/config.json b/src/content-handlers/iiif/extensions/uv-pdf-extension/config/config.json
@@ -289,7 +289,7 @@
       "options": {
         "embedEnabled": true,
         "shareEnabled": true,
-        "embedTemplate": "<iframe src=\"{0}\" width=\"{1}\" height=\"{2}\" allowfullscreen frameborder=\"0\" title=\"{3}\"></iframe>",
+        "embedTemplate": "<iframe src=\"{0}/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>",
         "instructionsEnabled": false,
         "shareFrameEnabled": true,
         "shareManifestsEnabled": true,

diff --git a/src/content-handlers/iiif/modules/uv-shared-module/BaseExtension.ts b/src/content-handlers/iiif/modules/uv-shared-module/BaseExtension.ts
@@ -765,13 +765,8 @@ export class BaseExtension<T extends BaseConfig> implements IExtension {
   }
 
   getAppUri(): string {
-    const appUri: string =
-      window.location.protocol +
-      "//" +
-      window.location.hostname +
-      (window.location.port ? ":" + window.location.port : "");
-
-    return appUri + "/uv.html";
+    const port = window.location.port ? `:${window.location.port}` : "";
+    return `${window.location.protocol}//${window.location.hostname}${port}`;
   }
 
   getSettings(): ISettings {

diff --git a/src/uv-iiif-config.json b/src/uv-iiif-config.json
@@ -43,6 +43,11 @@
       "options": {
         "downloadEnabled": true
       }
+    },
+    "shareDialogue": {
+      "options": {
+        "embedTemplate": "<iframe src=\"{0}/assets/uv.html#?{1}\" width=\"{2}\" height=\"{3}\" allowfullscreen frameborder=\"0\" title=\"{4}\"></iframe>"
+      }
     }
   }
 }