feat(annotations): Emit stroke color

box · Dec 14, 2020 · 182c3ba · 182c3ba
1 parent 0f8d7d9
commit 182c3ba
Show file tree

Hide file tree

Showing 7 changed files with 21 additions and 3 deletions.
diff --git a/src/lib/constants.js b/src/lib/constants.js
@@ -135,6 +135,7 @@ export const ANNOTATOR_EVENT = {
     fetch: 'annotationsfetched',
     error: 'annotationerror',
     scale: 'scaleannotations',
+    setStroke: 'annotations_stroke_set',
     setVisibility: 'annotations_visible_set',
 };
 

diff --git a/src/lib/viewers/BaseViewer.js b/src/lib/viewers/BaseViewer.js
@@ -997,6 +997,7 @@ class BaseViewer extends EventEmitter {
             initialMode: this.getInitialAnnotationMode(),
             intl: (options && options.intl) || intlUtil.createAnnotatorIntl(),
             modeButtons: ANNOTATION_BUTTONS,
+            stroke: { color: this.annotationModule.getColor() },
         });
 
         this.annotator = new this.annotatorConf.CONSTRUCTOR(annotatorOptions);

diff --git a/src/lib/viewers/__tests__/BaseViewer-test.js b/src/lib/viewers/__tests__/BaseViewer-test.js
@@ -1135,6 +1135,9 @@ describe('lib/viewers/BaseViewer', () => {
         };
 
         beforeEach(() => {
+            base.annotationModule.cache = {
+                get: jest.fn().mockReturnValue('#000'),
+            };
             base.options.viewer = { NAME: 'viewerName' };
             base.options.location = { locale: 'en-US' };
             base.options.showAnnotations = true;
@@ -1189,7 +1192,9 @@ describe('lib/viewers/BaseViewer', () => {
             base.createAnnotator();
 
             expect(base.options.boxAnnotations.getOptions).toBeCalled();
-            expect(base.createAnnotatorOptions).toBeCalledWith(expect.objectContaining(createOptionsArg));
+            expect(base.createAnnotatorOptions).toBeCalledWith(
+                expect.objectContaining({ ...createOptionsArg, stroke: { color: '#000' } }),
+            );
         });
 
         test('should use default intl lib if annotator options not present ', () => {

diff --git a/src/lib/viewers/doc/DocBaseViewer.js b/src/lib/viewers/doc/DocBaseViewer.js
@@ -1674,6 +1674,7 @@ class DocBaseViewer extends BaseViewer {
 
     handleAnnotationColorChange(color) {
         this.annotationModule.setColor(color);
+        this.annotator.emit(ANNOTATOR_EVENT.setStroke, { color });
         this.renderUI();
     }
 

diff --git a/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js b/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js
@@ -2946,17 +2946,21 @@ describe('src/lib/viewers/doc/DocBaseViewer', () => {
 
         describe('handleAnnotationColorChange', () => {
             beforeEach(() => {
+                docBase.annotator = {
+                    emit: jest.fn(),
+                };
                 docBase.annotationModule = {
                     setColor: jest.fn(),
                 };
                 docBase.renderUI = jest.fn();
             });
 
-            test('should call setColor and renderUI', () => {
+            test('should call setColor and renderUI, and emit color', () => {
                 const color = '#fff';
                 docBase.handleAnnotationColorChange(color);
 
                 expect(docBase.annotationModule.setColor).toBeCalledWith(color);
+                expect(docBase.annotator.emit).toBeCalledWith('annotations_stroke_set', { color: '#fff' });
                 expect(docBase.renderUI).toHaveBeenCalled();
             });
         });

diff --git a/src/lib/viewers/image/ImageViewer.js b/src/lib/viewers/image/ImageViewer.js
@@ -4,6 +4,7 @@ import AnnotationControlsFSM, { AnnotationInput, AnnotationState, stateModeMap }
 import ImageBaseViewer from './ImageBaseViewer';
 import ImageControls from './ImageControls';
 import {
+    ANNOTATOR_EVENT,
     CLASS_ANNOTATIONS_IMAGE_FTUX_CURSOR_SEEN,
     CLASS_INVISIBLE,
     DISCOVERABILITY_ATTRIBUTE,
@@ -554,6 +555,7 @@ class ImageViewer extends ImageBaseViewer {
 
     handleAnnotationColorChange(color) {
         this.annotationModule.setColor(color);
+        this.annotator.emit(ANNOTATOR_EVENT.setStroke, { color });
         this.renderUI();
     }
 

diff --git a/src/lib/viewers/image/__tests__/ImageViewer-test.js b/src/lib/viewers/image/__tests__/ImageViewer-test.js
@@ -709,17 +709,21 @@ describe('lib/viewers/image/ImageViewer', () => {
 
     describe('handleAnnotationColorChange', () => {
         beforeEach(() => {
+            image.annotator = {
+                emit: jest.fn(),
+            };
             image.annotationModule = {
                 setColor: jest.fn(),
             };
             image.renderUI = jest.fn();
         });
 
-        test('should call setColor and renderUI', () => {
+        test('should call setColor and renderUI, and emit color', () => {
             const color = '#fff';
             image.handleAnnotationColorChange(color);
 
             expect(image.annotationModule.setColor).toBeCalledWith(color);
+            expect(image.annotator.emit).toBeCalledWith('annotations_stroke_set', { color: '#fff' });
             expect(image.renderUI).toHaveBeenCalled();
         });
     });