Notes on getting started with IIIF at Durham

Creating manifests

Manifests can be very complex, and it is clear from looking at existing examples that they can look quite different and still work. If you add tables of contents, annotations etc. they get even more convoluted, but to get a basic manifest you only need a few variables. I adapted an existing METS creating program to write manifests - most of the variables go into the metadata section (title, date, description of the thing) but you also need the base name of your image files (assuming these are in a numbered sequence), the separate subdirectories your image files and manifest will be in, and the name of the manifest file you will generate. You also need the height and width of each image (either calculated at the time of creation or beforehand and the label (e.g. f.1r etc.) for each image. I found it easier to do this in an external file as manuscript foliation is often not standard so a csv file is called in to populate an array for the label values.

You should be able to view/download any manifest with a browser to see working examples.

Using Mirador to display a search result

Mirador 2 is a good looking but complex viewer, built upon a whole lot of Javascript libraries. Although it is built upon linked data and does so much effortlessly it does need user intervention in some ways that make it work. The default opening screen "Add item" is rather a nonplussing thing to hit first off, and not easy to suppress - the viewer seems more of a human-driven desktop tool than an automatic one. Given the json-based IIIF system I would expect you to be able to send json to Mirador to tell it what to display, but it is not obvious how to do this. Looking at the simple base index.html file it is the final section of Javascript that does the data loading and configuration

Ā  <script type="text/javascript">
Ā Ā  $(function() {
Ā Ā Ā Ā Ā  Mirador({
Ā Ā Ā Ā Ā Ā Ā  "id": "viewer",
Ā Ā Ā Ā Ā Ā Ā  "data": [
Ā Ā Ā Ā Ā Ā Ā Ā Ā  { "manifestUri": "http://www.example.org/manifests/manifest1.json", "location": "Example Organisation Library"},
Ā Ā Ā Ā  { "manifestUri": "http://www.example.org/manifests/manifest1.json", "location": "Example Organisation Library"}Ā  Ā Ā Ā Ā Ā  ],
Ā Ā Ā Ā Ā Ā Ā  "windowObjects": []
Ā Ā Ā Ā Ā  });
Ā Ā Ā  });
Ā  </script>

If we are using Mirador as a result viewer we want to get a single (for the sake of simplicity) manifest into the data array, but that will still land you on the "Add item" screen. The only way I've found to carry on to see the images instead is to add some extra values and insert your manifest twice, once in the data array and again as the loadedManifest value within windowObjects

$(function() {
Ā Ā Ā Ā Ā  Mirador({
Ā Ā Ā Ā Ā Ā Ā  "id": "viewer",
Ā Ā Ā Ā Ā Ā Ā  "currentWorkspaceType": "singleObject",
Ā Ā Ā Ā Ā Ā Ā  "saveSession": false,
Ā Ā Ā Ā Ā Ā Ā  "layout": "1x1",
Ā Ā Ā Ā Ā Ā Ā  "data": [
{Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "manifestUri": "http://www.example.org/manifests/subdir/subdir/manifest.json"Ā Ā Ā Ā Ā  } ],
Ā Ā Ā Ā Ā Ā Ā  "windowObjects": [
Ā Ā Ā Ā Ā Ā Ā Ā Ā  {Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "loadedManifest": "http://www.example.org/manifests/subdir/subdir/manifest.json",
Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "viewType" : "ImageView",
Ā Ā Ā Ā Ā Ā Ā Ā Ā Ā  }
Ā Ā Ā Ā Ā Ā Ā  ]
Ā Ā Ā Ā Ā  });
Ā Ā Ā  });Ā 

Finally in a link you may want to jump to a page, which means adding a canvas. For the example below there are two variables: the variable fragment of the manifest url path "dul/clb/clb1-94" and the page number to open "2". So with some very ugly Javascript to retrieve and build in these two parameters, and saveSession set to false to remove the hash session ID, https://iiif.durham.ac.uk/mview.html?p1=dul/clb/clb1-94&p2=2 gives you

Ā Ā Ā  $(function() {
Ā Ā Ā Ā Ā  Mirador({
Ā Ā Ā Ā Ā Ā Ā  "id": "viewer",
Ā Ā Ā Ā Ā Ā Ā  "currentWorkspaceType": "singleObject",
Ā Ā Ā Ā Ā Ā Ā  "saveSession": false,
Ā Ā Ā Ā Ā Ā Ā  "layout": "1x1",
Ā Ā Ā Ā Ā Ā Ā  "data": [
Ā {Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "manifestUri": "https://iiif.durham.ac.uk/manifests/dul/clb/clb1-94.json"Ā Ā Ā Ā Ā  } ],
Ā Ā Ā Ā Ā Ā Ā  "windowObjects": [
Ā Ā Ā Ā Ā Ā Ā Ā Ā  {Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "loadedManifest": "https://iiif.durham.ac.uk/manifests/dul/clb/clb1-94.json",
Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "viewType" : "ImageView",
Ā Ā Ā Ā Ā Ā Ā  Ā Ā Ā  Ā "canvasID": "https://iiif.durham.ac.uk/manifests/dul/clb/clb1-94/canvas/p2"
Ā Ā Ā Ā Ā Ā Ā Ā Ā Ā  }
Ā Ā Ā Ā Ā Ā Ā  ]
Ā Ā Ā Ā Ā  });
Ā Ā Ā  });Ā 

and a means of using Mirador to display a search result.

Ā 

Ā 

Ā 

Ā 

Ā 

Ā