From 71aea4b541c96721c3587ae0ff1896db65830aed Mon Sep 17 00:00:00 2001
From: Sumedha Pramod <pramods@umich.edu>
Date: Wed, 16 May 2018 15:39:13 -0700
Subject: [PATCH] Fix: Hiding annotations for the image viewer (#189)

---
 src/controllers/AnnotationModeController.js   |  2 +
 .../AnnotationModeController-test.js          |  1 +
 .../__tests__/HighlightModeController-test.js |  3 +-
 src/image/ImageAnnotator.js                   | 38 ++++++++-----------
 4 files changed, 20 insertions(+), 24 deletions(-)

diff --git a/src/controllers/AnnotationModeController.js b/src/controllers/AnnotationModeController.js
index 144f683e3..636c110dd 100644
--- a/src/controllers/AnnotationModeController.js
+++ b/src/controllers/AnnotationModeController.js
@@ -432,6 +432,8 @@ class AnnotationModeController extends EventEmitter {
 
         const pageThreads = this.threads[pageNum].all() || [];
         pageThreads.forEach((thread, index) => {
+            thread.hideDialog();
+
             // Sets the annotatedElement if the thread was fetched before the
             // dependent document/viewer finished loading
             if (!thread.annotatedElement) {
diff --git a/src/controllers/__tests__/AnnotationModeController-test.js b/src/controllers/__tests__/AnnotationModeController-test.js
index 2554ff1fe..2a7e92040 100644
--- a/src/controllers/__tests__/AnnotationModeController-test.js
+++ b/src/controllers/__tests__/AnnotationModeController-test.js
@@ -504,6 +504,7 @@ describe('controllers/AnnotationModeController', () => {
             controller.threads[1].insert(stubs.thread);
             controller.threads[2].insert(stubs.thread);
 
+            stubs.threadMock.expects('hideDialog').once();
             stubs.threadMock.expects('show').once();
             controller.renderPage(1);
             expect(stubs.thread.annotatedElement).to.equal('el');
diff --git a/src/controllers/__tests__/HighlightModeController-test.js b/src/controllers/__tests__/HighlightModeController-test.js
index 2341c8b74..d10531cbb 100644
--- a/src/controllers/__tests__/HighlightModeController-test.js
+++ b/src/controllers/__tests__/HighlightModeController-test.js
@@ -16,7 +16,8 @@ describe('controllers/HighlightModeController', () => {
             location: { page: 1 },
             type: TYPES.highlight,
             show: () => {},
-            addListener: () => {}
+            addListener: () => {},
+            hideDialog: () => {}
         };
         stubs.threadMock = sandbox.mock(stubs.thread);
     });
diff --git a/src/image/ImageAnnotator.js b/src/image/ImageAnnotator.js
index 2bba4151a..a99acb8ce 100644
--- a/src/image/ImageAnnotator.js
+++ b/src/image/ImageAnnotator.js
@@ -13,12 +13,7 @@ class ImageAnnotator extends Annotator {
     // Abstract Implementations
     //--------------------------------------------------------------------------
 
-    /**
-     * Determines the annotated element in the viewer
-     *
-     * @param {HTMLElement} containerEl - Container element for the viewer
-     * @return {HTMLElement} Annotated element in the viewer
-     */
+    /** @inheritdoc */
     getAnnotatedEl(containerEl) {
         return containerEl.querySelector(ANNOTATED_ELEMENT_SELECTOR);
     }
@@ -86,16 +81,7 @@ class ImageAnnotator extends Annotator {
         return location;
     }
 
-    /**
-     * Creates the proper type of thread, adds it to in-memory map, and returns
-     * it.
-     *
-     * @override
-     * @param {Object} annotations - Annotations in thread
-     * @param {Object} location - Location object
-     * @param {string} [type] - Optional annotation type
-     * @return {AnnotationThread} Created annotation thread
-     */
+    /** @inheritdoc */
     createAnnotationThread(annotations, location, type) {
         let thread;
 
@@ -122,13 +108,7 @@ class ImageAnnotator extends Annotator {
         return thread;
     }
 
-    /**
-     * Orient annotations to the correct scale and orientation of the annotated document.
-     *
-     * @private
-     * @param {Object} data - Scale and orientation values needed to orient annotations.
-     * @return {void}
-     */
+    /** @inheritdoc */
     scaleAnnotations(data) {
         this.setScale(data.scale);
         this.rotateAnnotations(data.rotationAngle, data.pageNum);
@@ -167,6 +147,18 @@ class ImageAnnotator extends Annotator {
             util.showElement(pointAnnotateButton);
         }
     }
+
+    /** @inheritdoc */
+    bindDOMListeners() {
+        this.annotatedElement.addEventListener('mouseup', this.hideAnnotations);
+        super.bindDOMListeners();
+    }
+
+    /** @inheritdoc */
+    unbindDOMListeners() {
+        this.annotatedElement.removeEventListener('mouseup', this.hideAnnotations);
+        super.bindDOMListeners();
+    }
 }
 
 export default ImageAnnotator;