diff --git a/recipe/0540-link-for-opening-multiple-canvases/annotation.json b/recipe/0540-link-for-opening-multiple-canvases/annotation.json index 0458bc1b4..3a08f4b10 100644 --- a/recipe/0540-link-for-opening-multiple-canvases/annotation.json +++ b/recipe/0540-link-for-opening-multiple-canvases/annotation.json @@ -5,11 +5,11 @@ "motivation": ["contentState"], "target": [ { - "id": "https://iiif.io/api/cookbook/recipe/0318-navPlace-navDate/canvas/2", + "id": "{{ id.path }}/canvas/2", "type": "Canvas", "partOf": [ { - "id": "https://iiif.io/api/cookbook/recipe/0318-navPlace-navDate/manifest-2.json", + "id": "{{ id.path }}/manifest-2.json", "type": "Manifest" } ] @@ -19,7 +19,7 @@ "type": "Canvas", "partOf": [ { - "id": "{{ id.path }}/manifest", + "id": "{{ id.path }}/manifest.json", "type": "Manifest" } ] diff --git a/recipe/0540-link-for-opening-multiple-canvases/canvases_sides_by_side.jpeg b/recipe/0540-link-for-opening-multiple-canvases/canvases_sides_by_side.jpeg new file mode 100644 index 000000000..de2d3f6e4 Binary files /dev/null and b/recipe/0540-link-for-opening-multiple-canvases/canvases_sides_by_side.jpeg differ diff --git a/recipe/0540-link-for-opening-multiple-canvases/index.md b/recipe/0540-link-for-opening-multiple-canvases/index.md index 184ca303b..8b143fbbd 100644 --- a/recipe/0540-link-for-opening-multiple-canvases/index.md +++ b/recipe/0540-link-for-opening-multiple-canvases/index.md @@ -13,12 +13,14 @@ topic: I want to compare pages from two different manuscripts and share a link to open both on the same view. I want to share a link to a colleague showing two similar paintings in two different collections. I want to save my current workspace (open Canvases in the current viewer) for later use. I want to open my current workspace with another viewer. +![Illustration of a possible way of visualizing two Canvases from different IIIF objects.](canvases_sides_by_side.jpeg) + ## Implementation Notes -Some viewers already implement custom formats for exporting the current workspace for sharing or later use. Content State API could be used for the same purpose, adding the advantage of direct loading of the workspace using a crafted link with the `iiif-content` query parameter. The [multiple targets for a comparison view section](https://iiif.io/api/content-state/1.0/#53-multiple-targets-for-a-comparison-view) describes a method for targetting two Canvases at the same time; each Canvas could be from a different Manifest. +Some viewers already implement custom formats for exporting the current workspace for sharing or later use. The Content State API could be used for the same purpose, adding the advantage of direct loading of the workspace using a crafted link with the `iiif-content` query parameter. The [multiple targets for a comparison view section](https://iiif.io/api/content-state/1.0/#53-multiple-targets-for-a-comparison-view) describes a method for targetting two Canvases at the same time; each Canvas could be from a different Manifest. For this purpose, we create an Annotation with `motivation` set to `["contentState"]`. -The value of the the `target` attribute of the Annotation is a list containing the `id` of the Canvases and a `partOf` attribute with the `id` of the Manifests they belong to. +The value of the the `target` property of the Annotation is a list containing the `id` of the Canvases and a `partOf` property with the `id` of the Manifests they belong to. We can hence encode the Annotation as explained in the [Content State encoding guidelines](https://iiif.io/api/content-state/1.0/#6-content-state-encoding), and then pass the encoded string to the viewer as the value of the `iiif-content` query parameter. We can pass the encoded value, using the `iiif-content` query parameter of the viewer landing page: @@ -30,11 +32,14 @@ We can also create an anchor tag with the link as the `href` attribute for use i Link for visualizing the region of a Canvas using a viewer. ## Restrictions -None known. +Note: Content State does not define how the viewer should show the two Canvases. It only mentions: + +“This data structure can be used by clients to load the resource required, present a particular part of the resource to the user.” https://iiif.io/api/content-state/1.0/#content-state +Viewers may show the Canvases side by side or decide to use different approaches (e.g. opening two browser tabs). ## Example In this example we want to compare two painting of the Colosseum from two different Manifests. -One of the two Manifest is available at the following [link](manifest.json). We can notice that the Colosseum painting is in the second Canvas. The other Manifest is from another recipe, and can be [accessed here](https://iiif.io/api/cookbook/recipe/0318-navPlace-navDate/manifest-2.json). +We can notice that the Colosseum painting is in the second Canvas. The Annotation will target the `id` of the two Canvases we want to compare and contain a reference to the two Manifests as shown in the example: diff --git a/recipe/0540-link-for-opening-multiple-canvases/manifest-2.json b/recipe/0540-link-for-opening-multiple-canvases/manifest-2.json new file mode 100644 index 000000000..cef189574 --- /dev/null +++ b/recipe/0540-link-for-opening-multiple-canvases/manifest-2.json @@ -0,0 +1,51 @@ +{ + "@context": "http://iiif.io/api/presentation/3/context.json", + "id": "{{ id.url }}/manifest-2.json", + "type": "Manifest", + "label": { + "en": [ + "The Colosseum" + ] + }, + "items": [ + { + "id": "{{ id.path }}/canvas/2", + "type": "Canvas", + "height": 1529, + "width": 2048, + "label": { + "en": [ + "The Colosseum" + ] + }, + "items": [ + { + "id": "{{ id.path }}/anno-page/2", + "type": "AnnotationPage", + "items": [ + { + "id": "{{ id.path }}/anno/2", + "type": "Annotation", + "motivation": "painting", + "body": { + "id": "https://iiif.io/api/image/3.0/example/reference/71b9228e087f15c75b628214cd9f647d-The_Colosseum/full/max/0/default.jpg", + "type": "Image", + "format": "image/jpeg", + "height": 1529, + "width": 2048, + "service": [ + { + "id": "https://iiif.io/api/image/3.0/example/reference/71b9228e087f15c75b628214cd9f647d-The_Colosseum", + "profile": "level1", + "type": "ImageService3" + } + ] + }, + "target": "{{ id.path }}/canvas/2" + } + ] + } + ] + } + ] +} \ No newline at end of file