Merge pull request #794 from girder/overlay-mouse-events

girder · Mar 15, 2022 · 36614ef · 36614ef
2 parents f120116 + 804517b
commit 36614ef
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 2 deletions.
diff --git a/girder_annotation/girder_large_image_annotation/web_client/views/imageViewerWidget/geojs.js b/girder_annotation/girder_large_image_annotation/web_client/views/imageViewerWidget/geojs.js
@@ -395,6 +395,17 @@ var GeojsImageViewerWidgetExtension = function (viewer) {
                     overlayLayer.id(overlay.id);
                     overlayLayer.gcs(proj);
                     this.trigger('g:drawOverlayAnnotation', overlay, overlayLayer);
+                    const featureEvents = geo.event.feature;
+                    overlayLayer.geoOn(
+                        [
+                            featureEvents.mouseclick,
+                            featureEvents.mouseoff,
+                            featureEvents.mouseon,
+                            featureEvents.mouseover,
+                            featureEvents.mouseout
+                        ],
+                        (evt) => this._onMouseFeature(evt, annotation.elements().get(overlay.id), overlayLayer)
+                    );
                     this.viewer.scheduleAnimationFrame(this.viewer.draw, true);
                 }).fail((response) => {
                     console.error(`There was an error overlaying image with ID ${overlayItemId}`);
@@ -632,6 +643,7 @@ var GeojsImageViewerWidgetExtension = function (viewer) {
                     const overlayLayers = this.viewer.layers().filter(
                         (layer) => layer.id() === overlay.id);
                     _.each(overlayLayers, (layer) => {
+                        this.trigger('g:removeOverlayAnnotation', overlay, layer);
                         this.viewer.deleteLayer(layer);
                     });
                 });
@@ -785,14 +797,13 @@ var GeojsImageViewerWidgetExtension = function (viewer) {
             };
         },
 
-        _onMouseFeature: function (evt) {
+        _onMouseFeature: function (evt, overlay, overlayLayer) {
             var properties = evt.data.properties || {};
             var eventType;
 
             if (!this._eventTypes) {
                 this._setEventTypes();
             }
-
             if (properties.element && properties.annotation) {
                 eventType = this._eventTypes[evt.event];
 
@@ -804,6 +815,13 @@ var GeojsImageViewerWidgetExtension = function (viewer) {
                         evt
                     );
                 }
+            } else if (overlay && overlayLayer) {
+                // handle events for overlay layers like pixelmaps
+                eventType = this._eventTypes[evt.event];
+                if (eventType) {
+                    const overlayEventType = eventType + 'Overlay';
+                    this.trigger(overlayEventType, overlay, overlayLayer, evt);
+                }
             }
         }
     });

diff --git a/girder_annotation/test_annotation/web_client_specs/geojsSpec.js b/girder_annotation/test_annotation/web_client_specs/geojsSpec.js
@@ -323,6 +323,33 @@ $(function () {
             });
         });
 
+        it('fires overlay event', function() {
+            const eventType = window.geo.event.feature.mouseclick;
+            const mockEvent = {
+                event: eventType,
+                data: {}
+            };
+            const mockOverlay = overlayAnnotation.elements().models[0] || {};
+            const mockLayer = viewer.viewer.createLayer('osm');
+            var mouseclick = false;
+            runs(function () {
+                function handleOverlayEvent() {
+                    mouseclick = true;
+                }
+
+                viewer.on('g:mouseClickAnnotationOverlay', handleOverlayEvent);
+                viewer._onMouseFeature(mockEvent, mockOverlay, mockLayer);
+            });
+
+            waitsFor(function () {
+                return mouseclick;
+            }, 'event to be fired');
+
+            runs(function () {
+                viewer.viewer.deleteLayer(mockLayer);
+            });
+        });
+
         it('mouse reset events', function () {
             var mousereset, context = {};
             runs(function () {