Catalog should display a Leaflet viewer for Mosaics

[tpendragon]

Reasoning

Since MapSets will have both rasters and scanned maps if we want to share a single metadata record (which we do), then users need to be able to see both visualizations of the data.

Decision

We're going to implement a "band" over the top of the FIggy iframe to select between the mosaic and the UV. The mosaic option should only appear if the item can render a mosaic view.

Options

1. Add some sort of "toggle" to the viewer iFrame
2. Adjust the catalog to render two viewers.
3. ??

[tpendragon]

We're going to talk about this during this maintenance week and decide on a path forward.

[tpendragon]

We think the best strategy is going to be a "band" at the top of the viewer which lets people swap between UV/Leaflet. @sdellis is going to make a mockup of the display for us.

We only add the band if there are two options.

[tpendragon]

Production example:

https://catalog.princeton.edu/catalog/99125464907006421 and https://figgy.princeton.edu/catalog/f97e8e8b-5bfe-466e-8c67-e17be912033e

[sdellis]

Example design:

[tpendragon]

That looks great! Do you feel comfortable implementing the design in Figgy? If not, do you have the html/css used?

[sdellis]

@tpendragon Here's the HTML/CSS: https://codepen.io/sdellis/pen/OJzgdzd The CSS-only approach was proving to be complicated. I was getting annoyed and ended up implementing it with some vanilla JS. Hope that's ok.

My only question with implementing in Figgy is how do we know when we have a map mosaic and create an extra tab. Is there a list of viewers that the static uv.html page has access to for a given resource? And if there is only a Default view are we going to display the viewer with a single tab, or display how it's currently displayed (no tabs).

[tpendragon]

@sdellis The viewer is rendered in https://github.com/pulibrary/figgy/blob/0d947325d7722be8dbe842dfa471154b2da1f2f5/app/controllers/viewer_controller.rb#L8 with the layout at https://github.com/pulibrary/figgy/blob/main/app/views/layouts/viewer_layout.html.erb, the view at https://github.com/pulibrary/figgy/blob/main/app/views/viewer/index.html.erb and the JS initialized at https://github.com/pulibrary/figgy/blob/main/app/javascript/packs/viewer.js and https://github.com/pulibrary/figgy/blob/main/app/javascript/viewer/uv_manager.js.

The current Mosaic viewer was implemented in https://github.com/pulibrary/figgy/pull/4958/files, which has some JS for initializing leaflet and a check to see if it should render that looks like this: https://github.com/pulibrary/figgy/blob/7081cf1b40a0961aad4bfaaa9e23112cb10fbf8c/app/views/catalog/_leaflet_tile_viewer_default.html.erb.

I think we should only show tabs if there's a mosaic, to prevent changing the UI for our other resources.

[tpendragon]

In thinking about this I think you'll need some way for JS to ask if a given ID has a mosaic. Maybe @eliotjordan has some ideas? For manifests we query the manifest and check the response.

[sdellis]

@tpendragon can we do something similar for the Mosaic viewer (leaflet)? Perhaps query the service_url and check the response?

[tpendragon]

Maybe? I suspect it'd be pretty slow the first time, but worth a shot.