diff --git a/src/lib/constants.js b/src/lib/constants.js index a954f70ee..8aa237a16 100644 --- a/src/lib/constants.js +++ b/src/lib/constants.js @@ -1,4 +1,5 @@ export const CLASS_ACTIVE = 'bp-is-active'; +export const CLASS_ANNOTATIONS_CREATE_DRAWING = 'bp-annotations-create--drawing'; export const CLASS_ANNOTATIONS_CREATE_HIGHLIGHT = 'bp-annotations-create--highlight'; export const CLASS_ANNOTATIONS_CREATE_REGION = 'bp-annotations-create--region'; export const CLASS_ANNOTATIONS_DISCOVERABLE = 'bp-annotations-discoverable'; diff --git a/src/lib/viewers/BaseViewer.js b/src/lib/viewers/BaseViewer.js index 9533981b6..db56c60dc 100644 --- a/src/lib/viewers/BaseViewer.js +++ b/src/lib/viewers/BaseViewer.js @@ -19,6 +19,7 @@ import { } from '../util'; import { ANNOTATOR_EVENT, + CLASS_ANNOTATIONS_CREATE_DRAWING, CLASS_ANNOTATIONS_CREATE_HIGHLIGHT, CLASS_ANNOTATIONS_CREATE_REGION, CLASS_ANNOTATIONS_DISCOVERABLE, @@ -49,6 +50,7 @@ const VIEWER_STATUSES = { }; const ANNOTATION_CLASSES = { + [AnnotationMode.DRAWING]: CLASS_ANNOTATIONS_CREATE_DRAWING, [AnnotationMode.HIGHLIGHT]: CLASS_ANNOTATIONS_CREATE_HIGHLIGHT, [AnnotationMode.REGION]: CLASS_ANNOTATIONS_CREATE_REGION, }; diff --git a/src/lib/viewers/__tests__/BaseViewer-test.js b/src/lib/viewers/__tests__/BaseViewer-test.js index ec16bcf9f..4982ee6a2 100644 --- a/src/lib/viewers/__tests__/BaseViewer-test.js +++ b/src/lib/viewers/__tests__/BaseViewer-test.js @@ -1797,6 +1797,7 @@ describe('lib/viewers/BaseViewer', () => { }); [ + [AnnotationMode.DRAWING, constants.CLASS_ANNOTATIONS_CREATE_DRAWING], [AnnotationMode.REGION, constants.CLASS_ANNOTATIONS_CREATE_REGION], [AnnotationMode.HIGHLIGHT, constants.CLASS_ANNOTATIONS_CREATE_HIGHLIGHT], ].forEach(([mode, className]) => { @@ -1807,7 +1808,7 @@ describe('lib/viewers/BaseViewer', () => { }); }); - [AnnotationMode.NONE, AnnotationMode.HIGHLIGHT].forEach(mode => { + [AnnotationMode.NONE, AnnotationMode.HIGHLIGHT, AnnotationMode.DRAWING].forEach(mode => { test(`should remove create region class if discoverability is enabled and mode is ${mode}`, () => { base.options.enableAnnotationsDiscoverability = true; base.processAnnotationModeChange(mode); diff --git a/src/lib/viewers/doc/_annotations.scss b/src/lib/viewers/doc/_annotations.scss index 80b493f1f..b193176fc 100644 --- a/src/lib/viewers/doc/_annotations.scss +++ b/src/lib/viewers/doc/_annotations.scss @@ -9,6 +9,12 @@ } } +@mixin bp-annotations-disable-drawing-targets { + .ba-DrawingAnnotations-list.is-listening .ba-DrawingTarget { + pointer-events: none; + } +} + @mixin bp-annotations-disable-highlight-targets { .ba-HighlightList .ba-HighlightSvg.is-listening .ba-HighlightTarget-rect { pointer-events: none; diff --git a/src/lib/viewers/doc/_docBase.scss b/src/lib/viewers/doc/_docBase.scss index 2f3b86945..90a7256e4 100644 --- a/src/lib/viewers/doc/_docBase.scss +++ b/src/lib/viewers/doc/_docBase.scss @@ -354,17 +354,15 @@ $thumbnail-sidebar-width: 226px; } } - &.bp-annotations-create--highlight { + &.bp-annotations-create--highlight, + &.bp-annotations-create--region { @include bp-annotations-create-base; + @include bp-annotations-disable-drawing-targets; @include bp-annotations-disable-highlight-targets; @include bp-annotations-disable-region-targets; } &.bp-annotations-create--region { - @include bp-annotations-create-base; - @include bp-annotations-disable-highlight-targets; - @include bp-annotations-disable-region-targets; - &.bp-annotations-ftux-document-cursor-seen { .ba-PopupCursor { display: none;