"Mirador is a configurable, extensible, and easy-to-integrate image viewer, which enables image annotation and comparison of images from repositories dispersed around the world. Mirador has been optimized to display resources from repositories that support the International Image Interoperability Framework (IIIF) API's. Mirador provides several workspaces for comparing image-based resources, suitable for use in both cultural heritage and research settings."
WissKI offers the possibility to integrate the Mirador viewer to display IIIF Images. The installation and configuration of Mirador is complex and if you are only looking for a performant viewer, using IIPMooViewer might be sufficient.
- WissKI IIP Image View module and it's dependencies are installed.
- WissKI Mirador Integration library is at root-dir /libraries/wisski-mirador-integration.
- Entities with an iip-image-field .
Open a terminal at your project-dir and install the Viewfield module via
composer require 'drupal/viewfield:3.x-dev@dev'
or click a Add new module and paste the link to the Viewfield development version in the field Add from a URL and click Continue.
Navigate to Manage Extend, enable Viewfield, WissKI Mirador Integration and click Install. Go to Manage Configuration WissKI IIIF Setting (Wisski) and enter your iiif-server-uri . If you like you can add a Licence or an Attribution.
Add annotation pathbuilder
Go to Manage Configuration Pathbuilders (WissKI Section) and click + Add Pathbuilder. Name it i. e. Annotations. Now add a group i. e. Annotation with the fields ID, JSON File, and Annotation Entity (See Figure 1 for an example pathbuilder ).
Field type of the JSON File has to be Text (plain, long).
Create Mirador block
Navigate to Manage Structure Views and click + Add view, enter a mirador-block-name as View name. In View Settings, select Wisski Entity as Show:. In Block Settings, check Create a block and enter a block-title . In Block Display Settings, switch the Display format to WissKI Mirador. Click Save and edit.
You're now at the Block configuration page. In the Format section, click at Settings and check Enable Annotations. As Entity type for annotations, enter wisski_individual. Fill the Bundle for annotations with corresponding machine name of the bundle on Edit page of the fresh created Annotation Bundle (at Manage Structure WissKI Entities and Bundles) and the fields with the machine names of the fields displayed at the Manage fields tab (see figure 2 for example matching).
Click Add next to Filter Criteria check Bundle/Group and Add and configure filter criteria. Set the Operator to Is equal to and check your wisski-entity . Add a second Filter Criteria and check the iip-image-field of your wisski-entity , submit with Add and configure filter criteria. Set the Operator to Is not empty and hit Apply.
Unfold the Advanced section by click on Advanced. Click Add next to Contextual Filters. Check Entity Id and submit with Add and configure contextual filters. In section When the filter value is NOT available, select Provide default value and select Raw value from URL as Type. Choose 3 as Path component. Apply. Click Save.
Place block as Viewfield
Navigate to Manage Structure WissKI Entities and Bundles and click on the desired wisski-entity . Click on Manage fields tab and + Add field. Select Viewfield in Add a new field type, enter a viewfield-label and Save and continue. Switch to the Edit tab and check the mirador-block-name under Allowed views and Block as Allowed display types. In the Default value section, select the mirador-block-name as View and Block as Display. Submit with Save settings.
Navigate back to WissKI Navigate wisski-entity and click on your wisski-individual . You should see your newly added Viewfield at the bottom of the page. If not, open the Edit menu and check if the View is your mirador-block-name and Display is set to Block.
You can add more IIIF Images by clicking on the + sign at the top left corner and click on Add Resource. Enter a link to a IIIF manifest in the Resource location field and click add.
To add annotations unfold the mirador menu by clicking on the hamburger icon in the top left corner, after that on the annotations icon and on the + button. Choose an annotation form (rectangle, circle etc.), annotate the image, enter a description and click Save.