Viewer recommendations for book-like objects / IA BookReader alternative

Omeka S Modules
1

Hi, my institution is working with a collection of fanzines we would like to display in Omeka S, but have been struggling a bit to find an appropriate viewer or viewer configuration for these items.

Ideally, we are interested in “flipbook”-style functionality similar to IA BookReader. Don’t necessarily need the page-turning animation – but would really like to have a two-page spread display; ability to navigate between pages using the keyboard; and for the initial page display to be somewhat readable without extensive zooming.

However, it looks like the IA BookReader plugin from Omeka Classic has not been adapted as an Omeka S module.

I know in theory Universal Viewer is very configurable, but I’ve had difficulty finding documentation on its various options or how we might achieve similar functionality with UV or another Omeka S-compatible viewer.

Can anyone recommend a viewer or viewer configuration that has worked particularly well for book-like objects in Omeka S?

2

Indeed, the main issue with Universal viewer is the fact that there is no more official version since a while and the old documentation disappeared.
You can try module Mirador, that integrates Mirador and where the config is simple.

3

We used the Universal Viewer in Omeka Classic and the configuration is difficult. I put it together mostly through trial and error but I think the results work well for a book display. The project was Orson Welles on the Air which displayed the texts from his radio plays as well as the audio. We tried the IA BookReader as well but the overall functionality of IIIF made us finally go that route. Be happy to share the config file if you’re interested.

4

Sharing the config file would be incredibly helpful! The viewer on your site looks great.

5

Yes, the config of Universal Viewer may be complex, and that’s why on Omeka S I divided the plugin in three modules : Iiif Server, Image Server and the viewer (universal viewer, mirador, etc.).

6

Here is the config.json file. Not sure where it belongs for Omeka-S.

{
"options": {
    "leftPanelEnabled": false,
    "minWidthBreakPoint": 610,
    "overrideFullScreen": false,
    "pagingEnabled": true,
    "pessimisticAccessControl": false,
    "preserveViewport": false,
    "rightPanelEnabled": true,
    "searchWithinEnabled": true,
    "theme": "uv-en-GB-theme",
    "useArrowKeysToNavigate": true
  },
  "modules": {
    "dialogue": {
      "content": {
        "close": "Close"
      }
    },
    "downloadDialogue": {
      "options": {
        "confinedImageSize": 1000
      },
      "content": {
        "currentViewAsJpg": "Current view (jpg)",
        "download": "Download",
        "editSettings": "Edit Settings",
        "entireDocument": "Entire document ({0})",
        "entireFileAsOriginal": "Entire file ({0})",
        "noneAvailable": "No download options are available.",
        "pagingNote": "Please turn off Two Page View for additional options.",
        "preview": "Preview",
        "title": "Download",
        "wholeImageHighRes": "Whole image high res ({0})",
        "wholeImageLowResAsJpg": "Whole image low res (jpg)"
      }
    },
    "embedDialogue": {
      "options": {
        "embedTemplate": "<div class=\"uv\" data-locale=\"{0}\" data-config=\"{1}\" data-uri=\"{2}\" data-collectionindex=\"{3}\" data-manifestindex=\"{4}\" data-sequenceindex=\"{5}\" data-canvasindex=\"{6}\" data-zoom=\"{7}\" data-rotation=\"{8}\" style=\"width:{9}px; height:{10}px; background-color: #000\"></div><script type=\"text/javascript\" id=\"embedUV\" src=\"{11}\"></script><script type=\"text/javascript\">/* wordpress fix */</script>"
      },
      "content": {
        "customSize": "Custom Size",
        "height": "Height",
        "instructions": "To embed this item in your own website, copy and paste the code below:",
        "title": "Embed",
        "width": "Width"
      }
    },
    "footerPanel": {
      "options": {
        "downloadEnabled": false,
        "embedEnabled": false,
        "fullscreenEnabled": true,
        "minimiseButtons": false
      },
      "content": {
        "download": "Download",
        "embed": "Embed",
        "exitFullScreen": "Exit Full Screen",
        "fullScreen": "Full Screen"
      }
    },
    "genericDialogue": {
      "content": {
        "emptyValue": "please enter a value.",
        "invalidNumber": "Please enter a valid number.",
        "noMatches": "No matches were found.",
        "ok": "OK",
        "pageNotFound": "This item does not contain a page with the number you entered. Try switching the numbering mode to 'image'.",
        "refresh": "Refresh"
      }
    },
    "helpDialogue": {
      "content": {
        "text": "placeholder text",
        "title": "Help"
      }
    },
    "moreInfoRightPanel": {
      "options": {
        "panelAnimationDuration": 250,
        "panelCollapsedWidth": 30,
        "panelExpandedWidth": 255,
        "panelOpen": false,
        "textLimit": 4,
        "textLimitType": "lines"
      },
      "content": {
        "attribution": "Attribution",
        "collapse": "Collapse More Information",
        "collapseFull": "Collapse Gallery",
        "description": "Description",
        "expand": "Expand More Information",
        "expandFull": "Expand Gallery",
        "holdingText": "Your module goes here!",
        "less": "less",
        "license": "License",
        "more": "more",
        "noData": "No data to display",
        "title": "More Information"
      }
    },
    "pagingHeaderPanel": {
      "options": {
        "localeToggleEnabled": false,
        "pageModeEnabled": true,
        "pagingToggleEnabled": true
      },
      "content": {
        "close": "Close",
        "emptyValue": "Please enter a value",
        "first": "First",
        "firstImage": "First Image",
        "firstPage": "First Page",
        "folio": "Folio",
        "go": "Go",
        "help": "Help",
        "image": "Image",
        "last": "Last",
        "lastImage": "Last Image",
        "lastPage": "Last Page",
        "next": "Next",
        "nextImage": "Next Image",
        "nextPage": "Next Page",
        "of": "of {0}",
        "oneUp": "Single page view",
        "page": "Page",
        "previous": "Previous",
        "previousImage": "Previous Image",
        "previousPage": "Previous Page",
        "settings": "Settings",
        "twoUp": "Two page view"
      }
    },
    "seadragonCenterPanel": {
      "options": {
        "animationTime": 0.025,
        "autoHideControls": true,
        "blendTime": 0,
        "constrainDuringPan": false,
        "controlsFadeAfterInactive": 1500,
        "controlsFadeDelay": 250,
        "controlsFadeLength": 250,
        "defaultZoomLevel": 0,
        "immediateRender": false,
        "maxZoomLevel": 10,
        "navigatorPosition": "BOTTOM_RIGHT",
        "pageGap": 0.01,
        "showHomeControl": false,
        "showNavigator": true,
        "trimAttributionCount": 150,
        "visibilityRatio": 0.5
      },
      "content": {
        "acknowledgements": "Attribution",
        "goHome": "Go Home",
        "imageUnavailable": "Image Unavailable",
        "next": "Next",
        "previous": "Previous",
        "rotateRight": "Rotate Right",
        "zoomIn": "Zoom In",
        "zoomOut": "Zoom Out"
      }
    },
    "searchFooterPanel": {
      "options": {
        "elideDetailsTermsCount": 20,
        "elideResultsTermsCount": 10,
        "pageModeEnabled": true
      },
      "content": {
        "clearSearch": "Clear Search",
        "defaultLabel": "-",
        "displaying": "Displaying {0} {1} of {2}",
        "enterKeyword": "Enter Keyword",
        "image": "image",
        "imageCaps": "Image",
        "instanceFound": "1 instance of '{0}' found",
        "instancesFound": "{0} instances of '{1}' found",
        "nextResult": "Next Result",
        "page": "page",
        "pageCaps": "Page",
        "previousResult": "Previous Result",
        "resultFoundFor": "result found for",
        "resultsFoundFor": "results found for",
        "searchWithin": "Search within this item:"
      }
    },
    "settingsDialogue": {
      "content": {
        "locale": "Locale",
        "pagingEnabled": "Two Page View",
        "preserveViewport": "Preserve Zoom",
        "title": "Settings",
        "website": "<a href='https://github.com/universalviewer/universalviewer'>more info</a>"
      }
    },
    "treeViewLeftPanel": {
      "options": {
        "panelOpen": false,
        "elideCount": 40,
        "galleryThumbHeight": 320,
        "galleryThumbWidth": 200,
        "oneColThumbHeight": 320,
        "oneColThumbWidth": 200,
        "pageModeEnabled": true,
        "panelAnimationDuration": 250,
        "panelCollapsedWidth": 30,
        "panelExpandedWidth": 255,
        "thumbsEnabled": true,
        "thumbsExtraHeight": 8,
        "thumbsImageFadeInDuration": 300,
        "thumbsLoadRange": 15,
        "treeEnabled": true,
        "twoColThumbHeight": 150,
        "twoColThumbWidth": 90
      },
      "content": {
        "collapse": "Collapse Contents",
        "collapseFull": "Collapse Gallery",
        "date": "date",
        "expand": "Expand Contents",
        "expandFull": "Expand Gallery",
        "index": "Index",
        "sortBy": "Sort By:",
        "thumbnails": "Thumbnails",
        "title": "Contents",
        "volume": "volume"
      }
    },
    "clickThroughDialogue": {
      "content": {
        "viewTerms": "Read Full Terms and Conditions"
      }
    },
    "loginDialogue": {
      "content": {
        "login": "Login"
      }
    }
  },
  "localisation": {
    "label": "English (GB)",
    "locales": [
      {
        "name": "cy-GB",
        "label": "Cymraeg"
      },
      {
        "name": "en-GB",
        "label": "English (GB)"
      }
    ]
  },
  "content": {
    "authCORSError": "Your browser does not support CORS, please upgrade to view this content.",
    "canvasIndexOutOfRange": "Canvas index out of range.",
    "degradedResourceMessage": "Please log in to view at full quality.",
    "degradedResourceLogin": "log in"
  }
}
1 Like
7

Thank you for sharing! Much appreciated.

8

Thanks for sharing this - the UV configuration is working great on our site.

What are you using to serve your IIIF manifest? We are using the IIIF Server and Image Server Omeka modules and having a little trouble getting the modules to produce a manifest that will work for what we want in Universal Viewer. I’m sure we don’t have our items and IIIF server set up quite right, but if you could provide IIIF Server module config details and a quick overview of how your items are structured in Omeka that would be a huge help.

Thanks in advance.

9

Answering my own question for the next person who comes along: we needed to configure our IIIF Server module in Omeka to use “paged” behavior. Once we made that setting, most of the book-like features we were looking for in UV activated.

10

This topic was automatically closed 250 days after the last reply. New replies are no longer allowed.