Add `Viewer` plugin support #183

wykhuh · 2024-03-13T21:08:29Z

@adamjarling @mathewjordan These are changes I made Clover in order to support plugins. The two parts that I changed for the annotation plugin was to give the plugin access to the Image Viewer Controls and Information Panel.

wykhuh · 2024-04-19T21:16:43Z

@adamjarling @mathewjordan I updated plugins to Clover 2.7.5.

…ations

mathewjordan

🥇 Overall, this looks pretty good to me. I'll chat through it with @adamjarling now that I grok it well enough. If there are changes, I think they will be pretty minimal and mostly organizational.

mathewjordan · 2024-05-22T13:44:04Z

build/build.mjs

+  'annotation-helpers': {
+    lib: {
+      name: "CloverIIIFAnnotationHelpers",
+      entry: "./src/lib/annotation-helpers.ts",
+      fileName: "index",
+    },
+  },
+  'openseadragon-helpers': {
+    lib: {
+      name: "CloverIIIFOpenseadragonHelpers",
+      entry: "./src/lib/openseadragon-helpers.ts",
+      fileName: "index",


This might bloat over time. I wonder if we should try to consolidate all helpers under a single export?

I consolidated the helpers in a single export

mathewjordan · 2024-05-22T13:44:42Z

build/root.mjs

+  parseAnnotationTarget,
+  createOpenSeadragonRect


Again, maybe we work to consolidate at some point? Perhaps if this reaches a count of three.

mathewjordan · 2024-05-22T13:48:39Z

src/components/Image/Controls/Controls.tsx

+  function renderPlugins() {
+    return plugins
+      .filter((plugin) => plugin.imageViewer?.menu)
+      .map((plugin, i) => {
+        const PluginComponent = plugin.imageViewer?.menu
+          ?.component as unknown as React.ElementType;
+        return (
+          <PluginComponent
+            key={i}
+            {...plugin?.imageViewer?.menu?.componentProps}
+            activeManifest={activeManifest}
+            canvas={canvas}
+            viewerConfigOptions={configOptions}
+            openSeadragonViewer={openSeadragonViewer}
+            useViewerDispatch={useViewerDispatch}
+            useViewerState={useViewerState}
+          ></PluginComponent>
+        );
+      });
+  }


👍 I think this makes sense to me!

mathewjordan · 2024-05-22T13:51:48Z

src/context/viewer-context.tsx

+export type PluginConfig = {
+  id: string;
+  imageViewer?: {
+    menu?: {
+      component: React.ElementType;
+      componentProps?: Record<string, unknown>;
+    };
+  };
+  informationPanel?: {
+    component: React.ElementType;
+    componentProps?: Record<string, unknown>;
+    label: InternationalString;
+  };
+};


I'll talk with @adamjarling about this. We'll want to make sure this naming convention is rock solid. I think imageViewer could be canvas to make it more generic and applicable at some point to Video/Audio and eventually 3D.

adamjarling · 2024-05-22T15:33:55Z

src/types/plugins.ts

+export interface PluginInformationPanel {
+  annotations?: Annotation[];
+  activeManifest: string;
+  canvas: CanvasNormalized;
+  viewerConfigOptions: ViewerConfigOptions;
+  openSeadragonViewer: OpenSeadragon.Viewer | null;
+  useViewerDispatch: () => ViewerContextStore;
+  useViewerState: () => ViewerContextStore;
+}


Maybe extend PluginInformationPanel here?

export interface PluginInformationPanel extends Plugin { annotations?: Annotation[]; }

Agree here.

I added extend to PluginInformationPanel.

adamjarling · 2024-05-22T15:41:31Z

src/index.tsx

+  parseAnnotationTarget,
+  type AnnotationTargetExtended,
+  createOpenSeadragonRect,
+  type Plugin,
+  type PluginInformationPanel,


I also wonder if there's cleaner way to handle these exports, or group or title them to clarify their context to future consumers of the package? Related toroot.mjs and root.umd.js as well.

adamjarling · 2024-05-22T15:50:49Z

@wykhuh @mathewjordan Should we add some documentation?

wykhuh · 2024-05-22T16:50:05Z

@wykhuh @mathewjordan Should we add some documentation?

@adamjarling I was going to add documentation after y'all looked the PR. I wanted us to figure out the api for plugins before writing the documentation.

Another thing to think about: will Clover website have a page that lists the custom displays and plugins that are available for Clover?

wykhuh · 2024-05-22T17:29:25Z

@mathewjordan @adamjarling You two have edit access to my forked repo, so feel free to make edits and commits to this branch.

mathewjordan

A few notes:

Add plugins docs in Viewer
Consolidate helpers under one export

  'helpers': {
    lib: {
      name: "CloverIIIFHelpers",
      entry: "./src/lib/index.ts", // pile them through here
      fileName: "index",
    },
  }

Rename imageViewer.menu to imageViewer.controls
If you'd like, add a Plugins page under Composing in the documentation nav
Adam's note about extending types where possible

mathewjordan · 2024-05-23T16:23:03Z

src/context/viewer-context.tsx

+export type PluginConfig = {
+  id: string;
+  imageViewer?: {
+    menu?: {


Suggested change

menu?: {

controls?: {

I changed it to imageViewer.controls

mathewjordan · 2024-05-23T16:31:40Z

src/types/plugins.ts

+export interface PluginInformationPanel {
+  annotations?: Annotation[];
+  activeManifest: string;
+  canvas: CanvasNormalized;
+  viewerConfigOptions: ViewerConfigOptions;
+  openSeadragonViewer: OpenSeadragon.Viewer | null;
+  useViewerDispatch: () => ViewerContextStore;
+  useViewerState: () => ViewerContextStore;
+}


Agree here.

wykhuh · 2024-05-24T16:08:11Z

@mathewjordan @adamjarling I mage the suggested changes. I also add plugin docs to the viewer page. Could you review the docs to see if it makes sense?

mathewjordan · 2024-05-24T16:20:53Z

@mathewjordan @adamjarling I mage the suggested changes. I also add plugin docs to the viewer page. Could you review the docs to see if it makes sense?

Sure thing.

mathewjordan

Looks great to me. See my one comment about consolidating helpers in the top level index.

mathewjordan · 2024-05-24T18:37:18Z

src/index.tsx

+  parseAnnotationTarget,
+  type AnnotationTargetExtended,
+  createOpenSeadragonRect,
+  type Plugin,
+  type PluginInformationPanel,


Should we also export the consolidated Helpers here?

@mathewjordan I exported a consolidated helpers.

wykhuh force-pushed the feature/clippings-clover branch 2 times, most recently from 0432892 to fda5703 Compare April 18, 2024 19:56

wykhuh force-pushed the feature/clippings-clover branch 2 times, most recently from 7f3be2b to 0c880fa Compare May 2, 2024 19:27

wykhuh added 22 commits May 20, 2024 12:26

update .gitignore

baf3c4a

add plugins to Viewer

15ac0ec

refactor getAnnotationResources to handle external annotation pages

eb03da7

refactor parseAnnotationTarget to handle FragmentSelector

98fdeae

add ignoreAnnotationOverlaysLabels to not add overlays to annotations

a4a3f96

add infomation panel to plugins

2836f71

export annotation and helpers

0528f09

fix - add try catch to getAnnotationResources

366e081

refactor plugin component and info panel to have same props

451dd05

add Plugin typescript type

1088534

add menu section to plugins props

e951790

refactor plugin info panel so the panel can be shown or hidden

6350c7d

update build process to include annotation and openseadragon helpers

d83498b

update types for plugins

d535797

improve error handling - add console.log, ErrorFallback, try...catch

04fb1b2

fix - handle cases when annotation have no body for formatPluginAnnot…

b20633f

…ations

update gitignore

a421b1b

remove annotations from plugins

6331e93

add imageViewer property to plugin config

c769703

fix linting issues

dd2e097

Update package-lock.json

8148cac

delete unneeded code

5f44adb

wykhuh force-pushed the feature/clippings-clover branch from 0c880fa to 5f44adb Compare May 20, 2024 21:26

mathewjordan changed the title ~~add plugin support~~ Add Viewer plugin support May 21, 2024

mathewjordan reviewed May 22, 2024

View reviewed changes

adamjarling reviewed May 22, 2024

View reviewed changes

mathewjordan self-requested a review May 23, 2024 16:32

mathewjordan requested changes May 23, 2024

View reviewed changes

wykhuh added 7 commits May 23, 2024 12:03

reorganize exporting as helper functions

3c450e9

rename imageViewer.menu to imageViewer.controls

70980ed

update PluginInformationPanel type

1ac9988

simplify props passed to plugin components

63300f8

reorganize exporting as helper functions

9efd5ea

add documentation for plugins

6ea8b8d

add plugins to viewer docs

448c383

mathewjordan self-requested a review May 24, 2024 18:32

mathewjordan reviewed May 24, 2024

View reviewed changes

consolidate helpers export

2be1c8c

mathewjordan self-requested a review May 28, 2024 21:13

mathewjordan approved these changes May 28, 2024

View reviewed changes

mathewjordan merged commit fd6e959 into samvera-labs:main May 28, 2024
1 check passed

mathewjordan deleted the feature/clippings-clover branch May 28, 2024 21:14

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add `Viewer` plugin support #183

Add `Viewer` plugin support #183

wykhuh commented Mar 13, 2024

wykhuh commented Apr 19, 2024

mathewjordan left a comment

mathewjordan May 22, 2024

wykhuh May 24, 2024

mathewjordan May 22, 2024

mathewjordan May 22, 2024

mathewjordan May 22, 2024

adamjarling May 22, 2024 •

edited

Loading

mathewjordan May 23, 2024

wykhuh May 24, 2024

adamjarling May 22, 2024 •

edited

Loading

adamjarling commented May 22, 2024

wykhuh commented May 22, 2024 •

edited

Loading

wykhuh commented May 22, 2024

mathewjordan left a comment

mathewjordan May 23, 2024

wykhuh May 24, 2024

mathewjordan May 23, 2024

wykhuh commented May 24, 2024

mathewjordan commented May 24, 2024

mathewjordan left a comment

mathewjordan May 24, 2024

wykhuh May 24, 2024

Add Viewer plugin support #183

Add Viewer plugin support #183

Conversation

wykhuh commented Mar 13, 2024

wykhuh commented Apr 19, 2024

mathewjordan left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

adamjarling May 22, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

adamjarling May 22, 2024 • edited Loading

Choose a reason for hiding this comment

adamjarling commented May 22, 2024

wykhuh commented May 22, 2024 • edited Loading

wykhuh commented May 22, 2024

mathewjordan left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

wykhuh commented May 24, 2024

mathewjordan commented May 24, 2024

mathewjordan left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Add `Viewer` plugin support #183

Add `Viewer` plugin support #183

adamjarling May 22, 2024 •

edited

Loading

adamjarling May 22, 2024 •

edited

Loading

wykhuh commented May 22, 2024 •

edited

Loading