feat(drawing): Add DrawingManager for ImageAnnotator

src/image/ImageAnnotator.ts

@@ -4,6 +4,7 @@ import PopupManager from '../popup/PopupManager';
 import { getAnnotation, getRotation } from '../store';
 import { centerRegion, getTransformedShape, isRegion, RegionCreationManager, RegionManager } from '../region';
 import { CreatorStatus, getCreatorStatus } from '../store/creator';
+import { DrawingManager, getShape, isDrawing } from '../drawing';
 import { Manager } from '../common/BaseManager';
 import { scrollToLocation } from '../utils/scroll';
 import './ImageAnnotator.scss';
@@ -49,6 +50,9 @@ export default class ImageAnnotator extends BaseAnnotator {
 
         if (this.managers.size === 0) {
             this.managers.add(new PopupManager({ referenceEl }));
+            if (this.isFeatureEnabled('drawing')) {
+                this.managers.add(new DrawingManager({ referenceEl }));
+            }
             this.managers.add(new RegionManager({ referenceEl }));
             this.managers.add(new RegionCreationManager({ referenceEl }));
         }
@@ -112,8 +116,16 @@ export default class ImageAnnotator extends BaseAnnotator {
             return;
         }
 
+        let shape = null;
         if (isRegion(annotation)) {
-            const transformedShape = getTransformedShape(annotation.target.shape, rotation);
+            // eslint-disable-next-line prefer-destructuring
+            shape = annotation.target.shape;
+        } else if (isDrawing(annotation)) {
+            shape = getShape(annotation.target.path_groups);
+        }
+
+        if (shape) {
+            const transformedShape = getTransformedShape(shape, rotation);
 
             scrollToLocation(this.annotatedEl, referenceEl, {
                 offsets: centerRegion(transformedShape),

src/image/__tests__/ImageAnnotator-test.ts

@@ -1,9 +1,11 @@
+import DrawingManager from '../../drawing/DrawingManager';
 import ImageAnnotator, { CSS_IS_DRAWING_CLASS } from '../ImageAnnotator';
 import PopupManager from '../../popup/PopupManager';
 import RegionCreationManager from '../../region/RegionCreationManager';
 import RegionManager from '../../region/RegionManager';
 import { Annotation } from '../../@types';
 import { CreatorStatus, fetchAnnotationsAction, setStatusAction } from '../../store';
+import { annotations as drawings } from '../../drawing/__mocks__/drawingData';
 import { annotations as regions } from '../../region/__mocks__/data';
 import { scrollToLocation } from '../../utils/scroll';
 
@@ -98,6 +100,18 @@ describe('ImageAnnotator', () => {
             expect(managerIterator.next().value).toBeInstanceOf(RegionCreationManager);
         });
 
+        test('should create DrawingManager is feature is enabled', () => {
+            annotator.destroy();
+            annotator = getAnnotator({ features: { drawing: true } });
+            const managers = annotator.getManagers(getParent(), getImage());
+            const managerIterator = managers.values();
+
+            expect(managerIterator.next().value).toBeInstanceOf(PopupManager);
+            expect(managerIterator.next().value).toBeInstanceOf(DrawingManager);
+            expect(managerIterator.next().value).toBeInstanceOf(RegionManager);
+            expect(managerIterator.next().value).toBeInstanceOf(RegionCreationManager);
+        });
+
         test('should destroy any existing managers if they are not present in the annotated element', () => {
             mockManager.exists.mockReturnValue(false);
             annotator.managers = new Set([mockManager]);
@@ -220,13 +234,21 @@ describe('ImageAnnotator', () => {
 
             annotator.annotatedEl = getParent();
             annotator.store.dispatch(fetchAnnotationsAction.fulfilled(payload, 'test', undefined));
+            annotator.store.dispatch(
+                fetchAnnotationsAction.fulfilled({ ...payload, entries: drawings as Annotation[] }, 'test', undefined),
+            );
         });
 
         test('should call scrollToLocation for region annotations', () => {
             annotator.scrollToAnnotation('anno_1');
             expect(scrollToLocation).toHaveBeenCalledWith(getParent(), getImage(), { offsets: { x: 15, y: 15 } });
         });
 
+        test('should call scrollToLocation for drawing anntotations', () => {
+            annotator.scrollToAnnotation('drawing_anno_1');
+            expect(scrollToLocation).toHaveBeenCalledWith(getParent(), getImage(), { offsets: { x: 16, y: 16 } });
+        });
+
         test('should do nothing if the annotation id is undefined or not available in the store', () => {
             annotator.scrollToAnnotation('nonsense');
             expect(scrollToLocation).not.toHaveBeenCalled();