fix(annotations): handle scrollToAnnotation in Preview (#1214)

* fix(annotations): handle scrollToAnnotation in Preview * Add handler to handle the scrolltoannotation event. * Add override to PresentationViewer to setPage since we only show 1 page at a time. * fix(annotations): handle scrollToAnnotation in Preview * PR Feedback * fix(annotations): handle scrollToAnnotation in Preview * Updated handleScroll to call the annotators scroll method if id provided or pass the payload (string) to the method. * fix(annotations): handle scrollToAnnotation in Preview * PR Feedback * fix(annotations): handle scrollToAnnotation in Preview * Updated test
box · Jun 1, 2020 · ea523ae · ea523ae
1 parent 841cd5a
commit ea523ae
Show file tree

Hide file tree

Showing 4 changed files with 90 additions and 2 deletions.
diff --git a/src/lib/viewers/BaseViewer.js b/src/lib/viewers/BaseViewer.js
@@ -980,7 +980,7 @@ class BaseViewer extends EventEmitter {
         });
 
         // Add a custom listener to scroll to the specified annotation
-        this.addListener('scrolltoannotation', data => this.annotator.scrollToAnnotation(data));
+        this.addListener('scrolltoannotation', this.handleScrollToAnnotation);
 
         // Add a custom listener for events emmited by the annotator
         this.annotator.addListener('annotatorevent', this.handleAnnotatorEvents);
@@ -1023,6 +1023,18 @@ class BaseViewer extends EventEmitter {
         return permissions.can_annotate || permissions.can_create_annotations;
     }
 
+    /**
+     * Handles the 'scrolltoannotation' event and calls the annotator scroll method
+     * @param {string | Object} event - Annotation Event
+     * @param {string} event.id - Annotation Id
+     * @return {void}
+     */
+    handleScrollToAnnotation(event) {
+        const data = event && event.id ? event.id : event;
+
+        this.annotator.scrollToAnnotation(data);
+    }
+
     /**
      * Returns whether or not annotations are enabled for this viewer.
      *

diff --git a/src/lib/viewers/__tests__/BaseViewer-test.js b/src/lib/viewers/__tests__/BaseViewer-test.js
@@ -1180,7 +1180,7 @@ describe('lib/viewers/BaseViewer', () => {
             expect(base.annotator.init).to.be.calledWith(1.5);
             expect(base.addListener).to.be.calledWith('toggleannotationmode', sinon.match.func);
             expect(base.addListener).to.be.calledWith('scale', sinon.match.func);
-            expect(base.addListener).to.be.calledWith('scrolltoannotation', sinon.match.func);
+            expect(base.addListener).to.be.calledWith('scrolltoannotation', base.handleScrollToAnnotation);
             expect(base.annotator.addListener).to.be.calledWith('annotations_create', base.handleAnnotationCreateEvent);
             expect(base.annotator.addListener).to.be.calledWith('annotatorevent', sinon.match.func);
             expect(base.emit).to.be.calledWith('annotator', base.annotator);
@@ -1258,6 +1258,36 @@ describe('lib/viewers/BaseViewer', () => {
         });
     });
 
+    describe('handleScrollToAnnotation', () => {
+        it('should call the annotators scrollToAnnotation method if object provided', () => {
+            const scrollToAnnotationStub = sandbox.stub();
+
+            base.annotator = {
+                addListener: sandbox.stub(),
+                init: sandbox.stub(),
+                scrollToAnnotation: scrollToAnnotationStub,
+            };
+
+            base.handleScrollToAnnotation({ id: '123' });
+
+            expect(scrollToAnnotationStub).to.be.calledWith('123');
+        });
+
+        it('should call the annotators scrollToAnnotation if string provided', () => {
+            const scrollToAnnotationStub = sandbox.stub();
+
+            base.annotator = {
+                addListener: sandbox.stub(),
+                init: sandbox.stub(),
+                scrollToAnnotation: scrollToAnnotationStub,
+            };
+
+            base.handleScrollToAnnotation('123');
+
+            expect(scrollToAnnotationStub).to.be.calledWith('123');
+        });
+    });
+
     describe('areAnnotationsEnabled()', () => {
         beforeEach(() => {
             stubs.getViewerOption = sandbox

diff --git a/src/lib/viewers/doc/PresentationViewer.js b/src/lib/viewers/doc/PresentationViewer.js
@@ -2,6 +2,7 @@ import throttle from 'lodash/throttle';
 import DocBaseViewer from './DocBaseViewer';
 import PresentationPreloader from './PresentationPreloader';
 import { CLASS_INVISIBLE } from '../../constants';
+import { getProp } from '../../util';
 import './Presentation.scss';
 
 const WHEEL_THROTTLE = 200;
@@ -124,6 +125,15 @@ class PresentationViewer extends DocBaseViewer {
         return hasXOverflow || hasYOverflow;
     }
 
+    /**
+     * @override
+     */
+    handleScrollToAnnotation(data) {
+        this.setPage(getProp(data, 'target.location.value', 1));
+
+        super.handleScrollToAnnotation(data);
+    }
+
     //--------------------------------------------------------------------------
     // Protected
     //--------------------------------------------------------------------------

diff --git a/src/lib/viewers/doc/__tests__/PresentationViewer-test.js b/src/lib/viewers/doc/__tests__/PresentationViewer-test.js
@@ -489,4 +489,40 @@ describe('lib/viewers/doc/PresentationViewer', () => {
             expect(result.last.id).to.equal(1);
         });
     });
+
+    describe('handleScrollToAnnotation', () => {
+        let setPageStub;
+        let scrollToAnnotationStub;
+
+        beforeEach(() => {
+            setPageStub = sandbox.stub(presentation, 'setPage');
+            scrollToAnnotationStub = sandbox.stub();
+        });
+
+        it('should call setPage is location value provided', () => {
+            const mockPartialAnnotation = { id: '123', target: { location: { value: 5 } } };
+
+            presentation.annotator = {
+                scrollToAnnotation: scrollToAnnotationStub,
+            };
+
+            presentation.handleScrollToAnnotation(mockPartialAnnotation);
+
+            expect(setPageStub).to.be.calledWith(5);
+            expect(scrollToAnnotationStub).to.be.calledWith(mockPartialAnnotation.id);
+        });
+
+        it('should call setPage with 1 if location not provided', () => {
+            const mockPartialAnnotation = { id: '123' };
+
+            presentation.annotator = {
+                scrollToAnnotation: scrollToAnnotationStub,
+            };
+
+            presentation.handleScrollToAnnotation(mockPartialAnnotation);
+
+            expect(setPageStub).to.be.calledWith(1);
+            expect(scrollToAnnotationStub).to.be.calledWith('123');
+        });
+    });
 });