From b3dd251a1e7a122afb42e09490031152a66edfbc Mon Sep 17 00:00:00 2001 From: Sumedha Pramod Date: Wed, 26 Jul 2017 13:24:44 -0700 Subject: [PATCH] Fix: Add clickHandlers back for all enabled annotation modes (#248) - click handlers were moved into docBase which meant that the image point annotation button no longer had a handler associated with it - annotationmodeclickhandler not overwritten in ImageBaseViewer --- src/lib/viewers/BaseViewer.js | 13 +++++-- src/lib/viewers/__tests__/BaseViewer-test.js | 27 +++++++++++++ src/lib/viewers/doc/DocBaseViewer.js | 14 ------- .../doc/__tests__/DocBaseViewer-test.js | 27 ------------- src/lib/viewers/image/ImageBaseViewer.js | 7 ++-- .../image/__tests__/ImageBaseViewer-test.js | 39 +++++++++++++++++++ .../image/__tests__/ImageViewer-test.js | 4 +- 7 files changed, 82 insertions(+), 49 deletions(-) diff --git a/src/lib/viewers/BaseViewer.js b/src/lib/viewers/BaseViewer.js index e02a12ae7..25d0041d4 100644 --- a/src/lib/viewers/BaseViewer.js +++ b/src/lib/viewers/BaseViewer.js @@ -767,9 +767,16 @@ class BaseViewer extends EventEmitter { * @param {string} mode - Target annotation mode * @return {Function|null} Click handler */ - /* eslint-disable no-unused-vars */ - getAnnotationModeClickHandler(mode) {} - /* eslint-enable no-unused-vars */ + getAnnotationModeClickHandler(mode) { + if (!mode || !this.isAnnotatable(mode)) { + return null; + } + + const eventName = `toggle${mode}annotationmode`; + return () => { + this.emit(eventName); + }; + } /** * Disables viewer controls diff --git a/src/lib/viewers/__tests__/BaseViewer-test.js b/src/lib/viewers/__tests__/BaseViewer-test.js index 22bf4cee0..cf5e54a47 100644 --- a/src/lib/viewers/__tests__/BaseViewer-test.js +++ b/src/lib/viewers/__tests__/BaseViewer-test.js @@ -843,4 +843,31 @@ describe('lib/viewers/BaseViewer', () => { expect(buttonEl.classList.contains(constants.CLASS_HIDDEN)).to.be.false; }); }); + + describe('getAnnotationModeClickHandler()', () => { + beforeEach(() => { + stubs.isAnnotatable = sandbox.stub(base, 'isAnnotatable').returns(false); + }); + + it('should return null if you cannot annotate', () => { + const handler = base.getAnnotationModeClickHandler('point'); + expect(stubs.isAnnotatable).to.be.called; + expect(handler).to.equal(null); + }); + + it('should return the toggle point mode handler', () => { + stubs.isAnnotatable.returns(true); + sandbox.stub(base, 'emit'); + base.annotator = { + togglePointAnnotationHandler: () => {} + }; + + const handler = base.getAnnotationModeClickHandler('point'); + expect(stubs.isAnnotatable).to.be.called; + expect(handler).to.be.a('function'); + + handler(event); + expect(base.emit).to.have.been.calledWith('togglepointannotationmode'); + }); + }); }); diff --git a/src/lib/viewers/doc/DocBaseViewer.js b/src/lib/viewers/doc/DocBaseViewer.js index fcb87f280..495f0bc96 100644 --- a/src/lib/viewers/doc/DocBaseViewer.js +++ b/src/lib/viewers/doc/DocBaseViewer.js @@ -442,20 +442,6 @@ class DocBaseViewer extends BaseViewer { this.pdfViewer.currentScaleValue = newScale; } - /** - * @inheritdoc - */ - getAnnotationModeClickHandler(mode) { - if (!mode || !this.isAnnotatable(mode)) { - return null; - } - - const eventName = `toggle${mode}annotationmode`; - return () => { - this.emit(eventName); - }; - } - /** * Handles keyboard events for document viewer. * diff --git a/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js b/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js index 4dfa92c0f..a0d52ce55 100644 --- a/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js +++ b/src/lib/viewers/doc/__tests__/DocBaseViewer-test.js @@ -699,33 +699,6 @@ describe('src/lib/viewers/doc/DocBaseViewer', () => { }); }); - describe('getPointModeClickHandler()', () => { - beforeEach(() => { - stubs.isAnnotatable = sandbox.stub(docBase, 'isAnnotatable').returns(false); - }); - - it('should return null if you cannot annotate', () => { - const handler = docBase.getAnnotationModeClickHandler('point'); - expect(stubs.isAnnotatable).to.be.called; - expect(handler).to.equal(null); - }); - - it('should return the toggle point mode handler', () => { - stubs.isAnnotatable.returns(true); - sandbox.stub(docBase, 'emit'); - docBase.annotator = { - togglePointAnnotationHandler: () => {} - }; - - const handler = docBase.getAnnotationModeClickHandler('point'); - expect(stubs.isAnnotatable).to.be.called; - expect(handler).to.be.a('function'); - - handler(event); - expect(docBase.emit).to.have.been.calledWith('togglepointannotationmode'); - }); - }); - describe('onKeyDown()', () => { beforeEach(() => { stubs.previousPage = sandbox.stub(docBase, 'previousPage'); diff --git a/src/lib/viewers/image/ImageBaseViewer.js b/src/lib/viewers/image/ImageBaseViewer.js index af6fcb226..d0d9fa609 100644 --- a/src/lib/viewers/image/ImageBaseViewer.js +++ b/src/lib/viewers/image/ImageBaseViewer.js @@ -347,15 +347,16 @@ class ImageBaseViewer extends BaseViewer { /** * @inheritdoc */ - getPointModeClickHandler() { - if (!this.isAnnotatable('point')) { + getAnnotationModeClickHandler(mode) { + if (!mode || !this.isAnnotatable(mode)) { return null; } + const eventName = `toggle${mode}annotationmode`; return () => { this.imageEl.classList.remove(CSS_CLASS_ZOOMABLE); this.imageEl.classList.remove(CSS_CLASS_PANNABLE); - this.emit('togglepointannotationmode'); + this.emit(eventName); }; } diff --git a/src/lib/viewers/image/__tests__/ImageBaseViewer-test.js b/src/lib/viewers/image/__tests__/ImageBaseViewer-test.js index c007a3355..ce04b7272 100644 --- a/src/lib/viewers/image/__tests__/ImageBaseViewer-test.js +++ b/src/lib/viewers/image/__tests__/ImageBaseViewer-test.js @@ -26,6 +26,12 @@ describe('lib/viewers/image/ImageBaseViewer', () => { imageBase = new ImageBaseViewer(containerEl); imageBase.containerEl = containerEl; imageBase.imageEl = document.createElement('div'); + + event = { + preventDefault: sandbox.stub(), + stopPropagation: sandbox.stub(), + touches: [0, 0] + }; }); afterEach(() => { @@ -38,6 +44,7 @@ describe('lib/viewers/image/ImageBaseViewer', () => { imageBase = null; stubs = {}; + event = {}; }); describe('destroy()', () => { @@ -468,6 +475,38 @@ describe('lib/viewers/image/ImageBaseViewer', () => { }); }); + describe('getAnnotationModeClickHandler()', () => { + beforeEach(() => { + stubs.isAnnotatable = sandbox.stub(imageBase, 'isAnnotatable').returns(false); + }); + + it('should return null if you cannot annotate', () => { + const handler = imageBase.getAnnotationModeClickHandler('point'); + expect(stubs.isAnnotatable).to.be.called; + expect(handler).to.equal(null); + }); + + it('should return the toggle point mode handler', () => { + stubs.isAnnotatable.returns(true); + stubs.emitter = sandbox.stub(imageBase, 'emit'); + imageBase.annotator = { + togglePointAnnotationHandler: () => {} + }; + imageBase.imageEl.classList.add(CSS_CLASS_PANNABLE); + imageBase.imageEl.classList.add(CSS_CLASS_ZOOMABLE); + + const handler = imageBase.getAnnotationModeClickHandler('point'); + expect(stubs.isAnnotatable).to.be.called; + expect(handler).to.be.a('function'); + + handler(event); + + expect(imageBase.imageEl).to.not.have.class(CSS_CLASS_PANNABLE); + expect(imageBase.imageEl).to.not.have.class(CSS_CLASS_ZOOMABLE); + expect(imageBase.emit).to.have.been.calledWith('togglepointannotationmode'); + }); + }); + describe('finishLoading()', () => { beforeEach(() => { imageBase.loaded = false; diff --git a/src/lib/viewers/image/__tests__/ImageViewer-test.js b/src/lib/viewers/image/__tests__/ImageViewer-test.js index 967af9271..c34e9fa78 100644 --- a/src/lib/viewers/image/__tests__/ImageViewer-test.js +++ b/src/lib/viewers/image/__tests__/ImageViewer-test.js @@ -587,7 +587,7 @@ describe('lib/viewers/image/ImageViewer', () => { describe('getPointModeClickHandler()', () => { it('should do nothing if not annotatable', () => { sandbox.stub(image, 'isAnnotatable').returns(false); - const handler = image.getPointModeClickHandler(); + const handler = image.getAnnotationModeClickHandler('point'); expect(handler).to.be.null; }); @@ -601,7 +601,7 @@ describe('lib/viewers/image/ImageViewer', () => { image.imageEl.classList.add(CSS_CLASS_PANNABLE); sandbox.stub(image, 'isAnnotatable').returns(true); - const handler = image.getPointModeClickHandler(); + const handler = image.getAnnotationModeClickHandler('point'); expect(handler).to.be.a('function'); handler(event);