| ... | ... | @@ -7,6 +7,10 @@ Here we shall give you a brief introduction to what a IIIF manifest is. A IIIF m |
|
|
|
- [Adding Media](#adding-media)
|
|
|
|
3. [Annotations](#annotations)
|
|
|
|
- [Basic Annotation](#basic-annotation)
|
|
|
|
- [Region Annotation](#region-annotation)
|
|
|
|
- [Linked Annotation](#linked-annotation)
|
|
|
|
- [Image Annotation](#image-annotation)
|
|
|
|
4. [Full Example](#full-example)
|
|
|
|
|
|
|
|
# Form: JSON
|
|
|
|
|
| ... | ... | @@ -179,13 +183,162 @@ In the MemoRekall-IIIF environment, there are different kinds of annotations tha |
|
|
|
|
|
|
|
Let’s first create a basic annotation. This won’t paint anything to the screen. In the Mirador viewer, this would simply appear in the list of annotation. Like when we add a media item, we create an Annotation resource that will be added to the AnnotationPage’s items list.
|
|
|
|
|
|
|
|
As before, the ID is the AnnotationPage’s ID with the index of the annotation, and the type is Annotation. The motivation here will be supplementing. The target will just be the Canvas’s ID without any information about painting to the screen. We don’t need to inform the body of the annotation.
|
|
|
|
As before, the ID is the AnnotationPage’s ID with the index of the annotation, and the type is Annotation. The motivation here will be supplementing. The target will just be the Canvas’s ID without any information about painting to the screen. There is only one key in the body that we need to inform, that’s the value. This is what will be written in the list of annotations in Mirador. Note that you can add some basic HTML in the value that will be parsed in the list, such as bold and italic font and adding links.
|
|
|
|
|
|
|
|
```
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/1”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1"
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1",
|
|
|
|
"body" : {
|
|
|
|
"value" : "My first annotation"
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
## Region Annotation
|
|
|
|
|
|
|
|
Next, we can create an annotation that has a region on the Canvas, and a duration within the Canvas’s duration if it is timed. As you can imagine, like with defining a media item, this is achieved by appending the information to the target key. Here is an example of an annotation that will be placed at 100,150,50,50 and lasts from 10 seconds to 20 seconds:
|
|
|
|
|
|
|
|
```
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/2”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "A region annotation"
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
## Linked Annotation
|
|
|
|
|
|
|
|
Next, we can create an annotation that is linked to another manifest. In the MemoRekall-IIIF environment, this will cause a link and preview of the manifest to appear in the list of annotations. To achieve this, we have chosen the following standard: append to the annotation’s ID a hashtag #, and then the link to the manifest file (the manifest’s main ID). For example:
|
|
|
|
|
|
|
|
```
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/3#www.my-server.com/link-to-another-manifest/linked_manifest_name.json”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "A linked annotation"
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
## Image Annotation
|
|
|
|
|
|
|
|
Finally, you can also create an annotation that not only is attached to a region, but also paints an image to that region. This is achieved in the same way as adding a media file. Here is an example:
|
|
|
|
|
|
|
|
```
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/4”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "An image annotation",
|
|
|
|
"id" : "www.my-server.com/my-image-file.png",
|
|
|
|
"type" : "Image",
|
|
|
|
"format" : "image/png",
|
|
|
|
"width" : 1000,
|
|
|
|
"height" : 1000
|
|
|
|
}
|
|
|
|
}
|
|
|
|
```
|
|
|
|
|
|
|
|
Note that the information in the body pertains to the actual image file, and that it will be resized according to the target. Of course, it is also possible to combine linked and image annotations.
|
|
|
|
|
|
|
|
# Full Example
|
|
|
|
|
|
|
|
And there you have it! You know should have a good idea about what an IIIF Manifest actually is, and how it is structured. Here is a full version of the manifest that was constructed across these examples:
|
|
|
|
|
|
|
|
```
|
|
|
|
{
|
|
|
|
“id” : “www.my-server.com/link-to-my-manifest/manifest_name.json”,
|
|
|
|
“type” : “Manifest”,
|
|
|
|
“@context": "http://iiif.io/api/presentation/3/context.json",
|
|
|
|
“label” : {
|
|
|
|
“en” : [“The title of my manifest”],
|
|
|
|
“fr” : [“Le titre de mon manifest"]
|
|
|
|
}
|
|
|
|
"items" : [{
|
|
|
|
“id” : “www.my-server.com/link-to-my-manifest/canvas/1”,
|
|
|
|
“type” : “Canvas”,
|
|
|
|
“label” : {“en” : [“Page One"]},
|
|
|
|
"width" : 1080,
|
|
|
|
"height" : 720,
|
|
|
|
"duration" : 1000.5,
|
|
|
|
"items" : [{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/page/1”,
|
|
|
|
"type" : "AnnotationPage"
|
|
|
|
"items" : [
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/page/1/1”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "painting",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=0,0,1080,720&t=0,1000.5"
|
|
|
|
"body" : {
|
|
|
|
"id" : "www.my-server.com/my-media-file.mp4",
|
|
|
|
"type" : "Video",
|
|
|
|
"format" : "video/mp4",
|
|
|
|
"width" : 1080,
|
|
|
|
"height" : 720,
|
|
|
|
"duration" : 1000.5,
|
|
|
|
}
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}],
|
|
|
|
"annotations" : [{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1”,
|
|
|
|
"type" : "AnnotationPage"
|
|
|
|
"items" : [
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/1”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1",
|
|
|
|
"body" : {
|
|
|
|
"value" : "My first annotation"
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/2”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "A region annotation"
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/3#www.my-server.com/link-to-another-manifest/linked_manifest_name.json”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "A linked annotation"
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
"id" : “www.my-server.com/link-to-my-manifest/canvas/1/annotation/1/4”,
|
|
|
|
"type" : "Annotation",
|
|
|
|
"motivation" : "supplementing",
|
|
|
|
"target" : "www.my-server.com/link-to-my-manifest/canvas/1#xywh=100,150,50,50&t=10,20",
|
|
|
|
"body" : {
|
|
|
|
"value" : "An image annotation",
|
|
|
|
"id" : "www.my-server.com/my-image-file.png",
|
|
|
|
"type" : "Image",
|
|
|
|
"format" : "image/png",
|
|
|
|
"width" : 1000,
|
|
|
|
"height" : 1000
|
|
|
|
}
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}]
|
|
|
|
}]
|
|
|
|
}
|
|
|
|
``` |
|
|
\ No newline at end of file |
