Skip to content

feat: show annotations from job to user#172

Open
FilipVrubel wants to merge 1 commit into
release/v3from
dev-vrubel
Open

feat: show annotations from job to user#172
FilipVrubel wants to merge 1 commit into
release/v3from
dev-vrubel

Conversation

@FilipVrubel
Copy link
Copy Markdown
Collaborator

  • After a job completes, its output annotations are fetched and drawn on a Canvas2D overlay on the slide (read-only, non-interactive)
  • _captureAnnotation now posts directly to MDS via scope.annotations.create() instead of polling for an ID
  • string inputs render as textarea
  • Known limitation: overlay is read-only, not part of the OSDAnnotations system.

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented May 19, 2026

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 8927dbc2-cbac-40c1-bc49-0989f37257fc

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch dev-vrubel

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a JobResultsOverlay class to render job results on the OpenSeadragon viewer and updates the analyze-dev plugin to fetch, decode, and display these results upon job completion. It also refactors the annotation capture logic to create annotations directly in the MDS and adds support for multi-line string inputs. The review feedback suggests optimizing performance by parallelizing annotation fetching, improving code readability with declarative array methods, and refactoring the shape-drawing logic into a strategy pattern for better extensibility.

Comment on lines +242 to +261
const allShapes = [];
for (const key of annotationKeys) {
const collectionId = job.outputs[key];
if (!collectionId) {
console.log('[analyze] no collection ID for output key', key);
continue;
}
try {
const result = await scope.collections.queryItems(collectionId, {});
if (!result?.items?.length) {
console.log('[analyze] empty collection for key', key);
continue;
}
console.log('[analyze] fetched', result.items.length, 'annotations for key', key);
const decoded = await this._empaiaConvertor.decode({ items: result.items, presets: [] });
if (decoded?.objects) allShapes.push(...decoded.objects.filter(Boolean));
} catch (e) {
console.warn('[analyze] failed to fetch/decode annotations for key', key, e);
}
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The loop for fetching and decoding annotations runs sequentially for each annotation key. Since these are independent network requests, they can be parallelized using Promise.all to improve performance, especially when there are multiple annotation outputs.

            const promises = annotationKeys.map(async (key) => {
                const collectionId = job.outputs[key];
                if (!collectionId) {
                    console.log('[analyze] no collection ID for output key', key);
                    return [];
                }
                try {
                    const result = await scope.collections.queryItems(collectionId, {});
                    if (!result?.items?.length) {
                        console.log('[analyze] empty collection for key', key);
                        return [];
                    }
                    console.log('[analyze] fetched', result.items.length, 'annotations for key', key);
                    const decoded = await this._empaiaConvertor.decode({ items: result.items, presets: [] });
                    return decoded?.objects?.filter(Boolean) || [];
                } catch (e) {
                    console.warn('[analyze] failed to fetch/decode annotations for key', key, e);
                    return [];
                }
            });
            const allShapes = (await Promise.all(promises)).flat();

Comment on lines +88 to +92
state.objects = [];
for (const [, job] of this._jobStore) {
if (String(job.viewerId) !== String(viewerId)) continue;
for (const obj of job.fabricObjects) state.objects.push(obj);
}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The implementation of _syncObjects can be made more concise and declarative by using array methods like filter and flatMap. This improves readability.

        state.objects = Array.from(this._jobStore.values())
            .filter(job => String(job.viewerId) === String(viewerId))
            .flatMap(job => job.fabricObjects);

return tiledImage.imageToViewerElementCoordinates(new OpenSeadragon.Point(x, y));
}

_drawShape(ctx, decoded, color, tiledImage) {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The _drawShape method uses a long if/else if chain to handle different shape types. For better maintainability and extensibility, consider refactoring this into a strategy pattern, for example by using a map of factoryID to drawing functions. Each drawing function could be a separate private method on the class.

@Aiosa
Copy link
Copy Markdown
Member

Aiosa commented May 19, 2026

The annotation integration should rely either on annotations module api, or use the flex renderer tile sources to render annotations as overlays. Not implementing new custom approach.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants