This is an demonstration of a simple-site extension that uses the IIIF image viewer Mirador to produce a customised presentation of a bespoke selection of IIIF manifests[1]. It is an example of a special page that can be added to the pages.json file.
For this extension to work the class variable needs to be set to mirador and the file variable needs to give the name of the additional json file including the IIIF manifest list data as shown below.
The details included in the content and content right variable will be presented as previously described, however the data included in the named file, in this case mirador.json will be processed to add a populated MIrador image viewer to the page.
As with the other JSON files the mirador data needs to be organised in a series of JSON objects, an example of which is provided below, for an example of real code please see the mirador.json file. The expected data can be split into two parts, the first is required and the second, more complex section is optional.
This object is composed of a simple list of manifests URIs that should be preloaded into the viewer. If only the catalog object is provided Mirador is setup to autoload in the first image of the first manifest listed.
As noted above this section is optional, it can also be a bit more complex. This object id intended to allow users to make use of some of the standard Mirador options to define which manifests and images are automatically loaded into the viewer and how they are arranged.
Although the JSON format described above is preferred and provides additional functions, in order to make this extension as simple an accessible as possible, it is also possible to provide details of required manifests as simple text list, with one manifest per line.
{
"parent": "",
"class": "mirador",
"file": "mirador.json",
"title": "Simple Site - The <b>IIIF Mirador Extension</b>",
"content": "<p>This is an demonstration of a [simple-site|https://github.com/jpadfield/simple-site] extension that uses the [IIIF|https://iiif.io] image viewer [Mirador|https://projectmirador.org/] to produce a customised presentation of a bespoke selection of IIIF manifests[@@IIIF manifests are simply a structured list of web based images resources that can be viewed in a IIIF compliant viewer, for more details see https://iiif.io/api/presentation/3.0/#table-of-contents]. It is an example of a special page that can be added to the [pages.json|pages.json.html] file.</p>\r\n\r\n<h3>The Example</h3>\r\n[##]\r\n<br/>\r\n<h3>Summary</h3>\r\n<div class=\"alert alert-info\" role=\"alert\"><h4 class=\"alert-heading\">Extension Variables</h4><p>For this extension to work the <b>class</b> variable needs to be set to <b>mirador</b> and the <b>file</b> variable needs to give the name of the additional json file including the IIIF manifest list data as shown below.</p></div>\r\n\r\n<figure>\r\n\t\t<pre style=\"overflow: hidden;border: 2px solid black;padding: 10px;\">\r\n<code>... \r\n \"<b>mirador</b>\": {\r\n \"<b>parent</b>\": \"extensions\",\r\n \"<b>class</b>\": \"mirador\",\r\n \"<b>file</b>\": \"mirador.json\",\r\n \"<b>title</b>\": \"Simple Site - The <b>IIIF Mirador Extension</b>\",\r\n \"<b>content</b>\": \"<p>This extension uses the [IIIF|https://iiif.io] to produce a customised presentation of a bespoke selection of [IIIF manifests ... \",\r\n \"<b>content right</b>\": \"\"\t\t\r\n }\r\n...\r\n</code></pre><figcaption class=\"figure-caption\">Simplified version of the JSON object used to describe this page.</figcaption>\r\n</figure>\r\n\r\n<p>The details included in the <b>content</b> and <b>content right</b> variable will be presented as [previously described|pages.json.html], however the data included in the named file, in this case <b>mirador.json</b> will be processed to add a populated MIrador image viewer to the page.</p>\r\n\r\n<h3>Mirador JSON file</h3>\r\n\r\n<p>As with the other JSON files the mirador data needs to be organised in a series of JSON objects, an example of which is provided below, for an example of real code please see the [mirador.json|https://github.com/jpadfield/simple-site/blob/master/build/mirador.json] file. The expected data can be split into two parts, the first is required and the second, more complex section is optional.</p>\r\n\r\n<h4>Section one - <b>catalog</b> object</h4>\r\n\r\n<p>This object is composed of a simple list of manifests URIs that should be preloaded into the viewer. If only the catalog object is provided Mirador is setup to autoload in the first image of the first manifest listed.</p>\r\n<figure>\r\n\t\t<pre style=\"overflow: hidden;border: 2px solid black;padding: 10px;\">\r\n<code>...\r\n \"<b>catalog</b>\": [\r\n { \"manifestId\": \"<b>https://web.address/of/a/manifest you want to include\"</b> }, \r\n { \"manifestId\": \"<b>https://you.can.include/a/number/of/manifests/as/required</b>\" }\r\n ]\r\n...\r\n</code></pre><figcaption class=\"figure-caption\">A commented example of a catalog object with two manifests listed.</figcaption>\r\n</figure>\r\n<br/>\r\n<h4>Section two - the <b>windows</b> object</h4>\r\n<p>As noted above this section is optional, it can also be a bit more complex. This object id intended to allow users to make use of some of the standard Mirador options to define which manifests and images are automatically loaded into the viewer and how they are arranged.</p>\r\n<figure>\r\n\t\t<pre style=\"overflow: hidden;border: 2px solid black;padding: 10px;\">\r\n<code>...\r\n \"<b>windows</b>\": [\r\n {\r\n \"<b>manifestId</b>\": \"URI of the manifest, from the included list, that you would like to load into a given slot by default\",\r\n \"<b>canvasIndex</b>\":\"The number, starting from 0, of the image, as listed in the manifest, to be loaded in first\",\r\n \"<b>view</b>\": \"The optional variable to define the initial view of this slot, enter one of <b>single</b>(default) or <b>gallery</b>\",\r\n \"<b>id</b>: \"Option variable to define a unique id for this slot, can be used in conjunction with more complex options to define the order and position in which listed slots will appear.\"\r\n }\r\n ]\r\n...\r\n</code></pre><figcaption class=\"figure-caption\">A commented version of a windows object with a single slot defined. More information about these various values can be found on the main [Mirador webpage|https://github.com/ProjectMirador/mirador/wiki/Configuration-Guides].</figcaption>\r\n</figure>\r\n<br/>\r\n<h3>Mirador Text file</h3>\r\n\r\n<p>Although the JSON format described above is preferred and provides additional functions, in order to make this extension as simple an accessible as possible, it is also possible to provide details of required manifests as simple text list, with one manifest per line.</p>\r\n\r\n<figure>\r\n\t\t<pre style=\"overflow: hidden;border: 2px solid black;padding: 10px;\">\r\n<code>https://manifests.britishart.yale.edu/manifest/34\r\nhttps://iiif.harvardartmuseums.org/manifests/object/299843\r\nhttps://media.nga.gov/public/manifests/nga_highlights.json\r\n</code></pre><figcaption class=\"figure-caption\">An example of the simplest way of passing manifests to simple-site page builder, a simple list of manifest urls saved as a text file with one manifest url per line.</figcaption>\r\n</figure>",
"content right": "",
"copy": false,
"displayName": "Instructions",
"aliases": "Instructions",
"displaycode": true
}{
"catalog": [
{
"manifestID": "https://iiif.harvardartmuseums.org/manifests/object/299843"
},
{
"manifestID": "https://media.nga.gov/public/manifests/nga_highlights.json"
}
],
"windows": [
{
"manifestId": "https://media.nga.gov/public/manifests/nga_highlights.json",
"canvasIndex": 0
},
{
"manifestId": "https://iiif.harvardartmuseums.org/manifests/object/299843",
"canvasIndex": 4
}
]
}