Reincorporate iiif gallery component back into main application #1472

K8Sewell · 2025-06-30T21:41:34Z

Summary

Returns @iiif/iiif-gallery-component back, from this commit in independent repository, into main UV application.

Related Issue

#1399

Screenshot

TODO

Merge Add archived note to README. IIIF-Commons/iiif-gallery-component#33 and archive component after this is finished.
Incorporate work in progress from Adds accessibility enhancements IIIF-Commons/iiif-gallery-component#1 (or open an issue to track) as a follow-up action.

vercel · 2025-06-30T21:41:38Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
universalviewer	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 3, 2025 7:18pm

demiankatz

Thanks, @K8Sewell, this is off to a good start. See below for a couple of minor suggestions that may lead to further simplifications.

Also, I'm seeing a more significant issue: something about this PR is making the entire UV shorter. If you open up the preview for this PR and the current example at https://universalviewer.dev, you'll notice that the UV is smaller here. I only noticed this because I was doing side-by-side comparisons of the gallery, and I saw that the thumbnail labels are visible on the dev branch but "below the fold" here (at least, on my small laptop screen they are). I can share screen shots if you can't reproduce this. My guess is that something in the gallery component's CSS is bleeding to a higher level and affecting the entire viewer. Let me know if you need help tracking down the culprit!

src/content-handlers/iiif/JQueryPlugins.ts

src/content-handlers/iiif/modules/uv-shared-module/css/mixins.less

…ery-component

demiankatz · 2025-07-01T16:44:53Z

package-lock.json

      "resolved": "https://registry.npmjs.org/@edsilv/http-status-codes/-/http-status-codes-1.0.3.tgz",
      "integrity": "sha512-HLK2FS5sZqxPqD53D6hhZxC6C8THTVwlyZDZ7J0iWsrB8JmMA69m/CQuNKZc1kki9WSVeck2fXna26NL0SE7cg=="
    },
-    "node_modules/@edsilv/jquery-plugins": {


I notice that removing the gallery component seems to have also removed the dependency on the jquery plugins. We should double-check that there is not code in the gallery component that depends on these, or else we may need to explicitly add this back as a direct dependency of UV.

I've added it as a direct dependency for now. I'm still investigating if it is essential to operations. Will hopefully have some more clear information on that soon.

I believe that it is currently essential -- at very least, when I search for the first of the plugins (the checkboxButton function), I see that the gallery component uses it when multi-select is enabled. The problem is that I don't think anyone knows how to enable multi-selection functionality in order to properly test this.

Regardless, this is not the only plugin that is used, nor are the plugins used exclusively in GalleryComponent -- for example, the horizontalMargins plugin is used in quite a few places, including OpenSeadragonCenterPanel and HeaderPanel.

Looks to me like getting rid of this dependency would be quite a bit of work. For now, leaving it as an explicit dependency makes sense to me so we don't forget about it.

K8Sewell · 2025-07-01T21:43:16Z

Thanks, @K8Sewell, this is off to a good start. See below for a couple of minor suggestions that may lead to further simplifications.

Also, I'm seeing a more significant issue: something about this PR is making the entire UV shorter. If you open up the preview for this PR and the current example at https://universalviewer.dev, you'll notice that the UV is smaller here. I only noticed this because I was doing side-by-side comparisons of the gallery, and I saw that the thumbnail labels are visible on the dev branch but "below the fold" here (at least, on my small laptop screen they are). I can share screen shots if you can't reproduce this. My guess is that something in the gallery component's CSS is bleeding to a higher level and affecting the entire viewer. Let me know if you need help tracking down the culprit!

Thanks so much for taking a look! I'm seeing matching sizes since I've made a few edits and may have resolved the 'too short' issue but will double check this in the newly built preview as soon as it's available.

One major difference I'm working on resolving is that the 'loading' icon displays differently on this branch than it does in dev and I'm still investigating the cause but all other issues are mostly wrapped. Thanks again for your time! Will update as soon as I've got parity.

demiankatz · 2025-07-02T17:32:27Z

Thanks for the merge, @K8Sewell -- the test diffs are much more readable now!

I've also discovered that the height problem still exists, but it has nothing to do with this PR. It appears that if I right click the preview link and open it in a new tab, it renders at the correct height... but if I left click it and navigate to it in the present tab, it comes out shorter. I have no idea what would be causing this, but I'm seeing the same behavior on multiple PRs, so I don't think you need to worry about chasing it down here.

Let me know if you need any help with the loading icon or the jQuery plugin investigation; I might be able to do something before tomorrow's stand-up (maybe early tomorrow morning) if you need me to.

demiankatz · 2025-07-02T19:20:12Z

src/content-handlers/iiif/modules/uv-shared-module/css/iiif-gallery-component.less

+          background: none;
+          position: relative;
+
+          &.loading {


Is it possible that we just want to remove this entirely and let the default .loading styles apply? Or have you already tried that?

Found the culprit. The variable assigned to loader-black-bg was different in the iiif-gallery-component repo. By bringing over the one from the repo and adding it to the variables got this loading icon working in parity with dev.

Looks good to me now!

K8Sewell · 2025-07-02T20:30:56Z

Thanks for the merge, @K8Sewell -- the test diffs are much more readable now!

I've also discovered that the height problem still exists, but it has nothing to do with this PR. It appears that if I right click the preview link and open it in a new tab, it renders at the correct height... but if I left click it and navigate to it in the present tab, it comes out shorter. I have no idea what would be causing this, but I'm seeing the same behavior on multiple PRs, so I don't think you need to worry about chasing it down here.

Let me know if you need any help with the loading icon or the jQuery plugin investigation; I might be able to do something before tomorrow's stand-up (maybe early tomorrow morning) if you need me to.

I'm glad to hear the height discrepancy is at least reproducible. Thanks for finding that!

I did find that the @edsilv/jquery-plugins is utilized in at least one place in UV - and that is in the esbuild.mjs but I cannot find it referenced anywhere else so I'm not 100% convinced it is essential. However, because I found it there I've kept the addition of this package as a dependency but I'm certainly open to exploring more.

LanieOkorodudu · 2025-07-03T10:18:43Z

I've been following the discussion, and I’ll wait for @demiankatz final thoughts in light of @K8Sewell last message before proceeding with the final testing.

demiankatz

Thanks for the progress, @K8Sewell, I think we're nearly done here. See below for one question.

demiankatz · 2025-07-03T12:13:33Z

src/content-handlers/iiif/modules/uv-shared-module/css/styles.less

+  .iiif-gallery-component .main {
+    overflow: auto;
+    overflow-x: hidden;
+  }


Is this necessary? It looks to me like these styles are already defined in iiif-gallery-component.less. Is there a reason they need to be reasserted here?

These styles were broken out into the separate styles.less file in the iiif-gallery-component repo so I was attempting to follow the style delineated logic of certain kinds of style properties living in the styles.less file instead of the component specific file, without realizing that these styles were duplicated. Thank you so much for catching that! I think to follow the pattern they should live here and this section should be updated with similar kinds of styles (positional, size, display, etc.) that currently live in the component specific style file. Would that be a better solution than removing them from here? Am also supportive of consolidating.

Also, to note, this style logic isn't applied consistently in the other component specific style files so perhaps better decision going forward is to compartmentalize. I'm open to suggestion on implementation.

I think I favor consolidation -- if we have an entire less file dedicated to the gallery component, I'd rather see gallery-related styles in there than external to it; makes it easier to find all of the related code if we need to. But if you have a counter-argument, I'm happy to hear it! :-)

LanieOkorodudu · 2025-07-04T10:18:41Z

Tested everything and checked the file changes, looks good to me! Leaving it with @demiankatz now for his final thoughts. Thanks a lot @K8Sewell for the awesome work!

demiankatz

Looks good to me as well!

demiankatz · 2025-07-04T11:02:43Z

I've archived the gallery component and opened #1488 to track the unresolved accessibility issue.

Reincorporate iiif gallery component back into main application

1f55bf0

K8Sewell marked this pull request as ready for review June 30, 2025 21:44

K8Sewell mentioned this pull request Jun 30, 2025

Decide which additional repositories need updates (eg manifesto, manifold, external components etc) #1399

Closed

demiankatz requested changes Jul 1, 2025

View reviewed changes

src/content-handlers/iiif/JQueryPlugins.ts Outdated Show resolved Hide resolved

src/content-handlers/iiif/modules/uv-shared-module/css/mixins.less Outdated Show resolved Hide resolved

demiankatz added this to DEV EX Community Sprint May-July 2025 Jul 1, 2025

demiankatz moved this to IN TESTING in DEV EX Community Sprint May-July 2025 Jul 1, 2025

erinburnand mentioned this pull request Jul 1, 2025

Evaluate and maintain external repositories #1380

Open

3 tasks

Merge branch 'dev' into issue-1399-dependency-consolidation-iiif-gall…

e5e0c98

…ery-component

vercel bot deployed to Preview – universalviewer July 1, 2025 16:43 View deployment

demiankatz reviewed Jul 1, 2025

View reviewed changes

K8Sewell added 4 commits July 1, 2025 16:26

Adds test for gallery component

5c2f3d3

Remove not needed code

aeb66b7

Add dependency

844708e

Resolve merge conflicts

b3ec225

vercel bot deployed to Preview – universalviewer July 1, 2025 21:40 View deployment

Fix merge conflict

d2fa32e

vercel bot deployed to Preview – universalviewer July 1, 2025 21:49 View deployment

K8Sewell marked this pull request as draft July 2, 2025 13:10

Fast forward and resolve merge conflicts

e734ab4

vercel bot deployed to Preview – universalviewer July 2, 2025 16:47 View deployment

Adjust loading icon

a560f59

vercel bot deployed to Preview – universalviewer July 2, 2025 18:55 View deployment

demiankatz reviewed Jul 2, 2025

View reviewed changes

Restore expected loading icon

194fb50

vercel bot deployed to Preview – universalviewer July 2, 2025 20:21 View deployment

K8Sewell marked this pull request as ready for review July 2, 2025 20:26

demiankatz requested changes Jul 3, 2025

View reviewed changes

K8Sewell added 2 commits July 3, 2025 14:16

Resolve merge conflicts

87bd753

Remove duplicated styles

3f93b95

vercel bot deployed to Preview – universalviewer July 3, 2025 19:18 View deployment

demiankatz approved these changes Jul 4, 2025

View reviewed changes

demiankatz merged commit 2dbe8fe into dev Jul 4, 2025
6 checks passed

github-project-automation bot moved this from IN TESTING to COMPLETED in DEV EX Community Sprint May-July 2025 Jul 4, 2025

demiankatz deleted the issue-1399-dependency-consolidation-iiif-gallery-component branch July 4, 2025 10:58

Uh oh!

Reincorporate iiif gallery component back into main application #1472

Reincorporate iiif gallery component back into main application #1472

Uh oh!

Conversation

K8Sewell commented Jun 30, 2025 • edited by demiankatz Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Related Issue

Screenshot

Uh oh!

vercel bot commented Jun 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

demiankatz left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

K8Sewell commented Jul 1, 2025

Uh oh!

demiankatz commented Jul 2, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

K8Sewell commented Jul 2, 2025

Uh oh!

LanieOkorodudu commented Jul 3, 2025

Uh oh!

demiankatz left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

LanieOkorodudu commented Jul 4, 2025

Uh oh!

demiankatz left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

demiankatz commented Jul 4, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

K8Sewell commented Jun 30, 2025 •

edited by demiankatz

Loading

vercel bot commented Jun 30, 2025 •

edited

Loading