diff --git a/src/events.js b/src/events.js index 7a657959..dd0f95f0 100644 --- a/src/events.js +++ b/src/events.js @@ -18,6 +18,8 @@ const EVENTS = { ROI_DRAWN: `${PROJECT_NAME}_roi_drawn`, /** Triggered when a ROI was selected. */ ROI_SELECTED: `${PROJECT_NAME}_roi_selected`, + /** Triggered when a ROI was double clicked. */ + ROI_DOUBLE_CLICKED: `${PROJECT_NAME}_roi_double_clicked`, /** Triggered when a ROI was modified. */ ROI_MODIFIED: `${PROJECT_NAME}_roi_modified`, /** Triggered when a viewport move has started. */ diff --git a/src/viewer.js b/src/viewer.js index 1cb42c32..f171ce46 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -1371,6 +1371,68 @@ class VolumeImageViewer { }) }) + let clickEvent = null + this[_map].on('dblclick', (event) => { + clickEvent = 'dblclick' + this[_map].forEachFeatureAtPixel( + event.pixel, + (feature) => { + const correctFeature = feature.values_?.features?.[0] || feature + console.debug('dblclick feature id:', correctFeature) + if (correctFeature?.getId()) { + publish( + this[_map].getTargetElement(), + EVENT.ROI_SELECTED, + this._getROIFromFeature( + correctFeature, + this[_pyramid].metadata, + this[_affine] + ) + ) + publish( + this[_map].getTargetElement(), + EVENT.ROI_DOUBLE_CLICKED, + this._getROIFromFeature( + correctFeature, + this[_pyramid].metadata, + this[_affine] + ) + ) + } + clickEvent = null + }, + { hitTolerance: 1 } + ) + }) + this[_map].on('click', (event) => { + if (clickEvent === 'dblclick') { + event.preventDefault() + event.stopPropagation() + return + } + clickEvent = 'click' + this[_map].forEachFeatureAtPixel( + event.pixel, + (feature) => { + const correctFeature = feature.values_?.features?.[0] || feature + console.debug('click feature id:', correctFeature) + if (correctFeature?.getId()) { + publish( + this[_map].getTargetElement(), + EVENT.ROI_SELECTED, + this._getROIFromFeature( + correctFeature, + this[_pyramid].metadata, + this[_affine] + ) + ) + } + clickEvent = null + }, + { hitTolerance: 1 } + ) + }) + view.fit(this[_projection].getExtent(), { size: this[_map].getSize() }) /** @@ -2500,15 +2562,18 @@ class VolumeImageViewer { const container = this[_map].getTargetElement() this[_interactions].select.on('select', (e) => { - publish( - container, - EVENT.ROI_SELECTED, - this._getROIFromFeature( - e.selected[0], - this[_pyramid].metadata, - this[_affine] + console.debug('select roi') + if (e.selected[0]?.getId()) { + publish( + container, + EVENT.ROI_SELECTED, + this._getROIFromFeature( + e.selected[0], + this[_pyramid].metadata, + this[_affine] + ) ) - ) + } }) this[_map].addInteraction(this[_interactions].select) @@ -3362,33 +3427,31 @@ class VolumeImageViewer { let selectedAnnotation = null this[_map].on('singleclick', (e) => { - if (e != null) { - if (selectedAnnotation != null) { - selectedAnnotation.set('selected', 0) - selectedAnnotation = null - } - const container = this[_map].getTargetElement() - this[_map].forEachFeatureAtPixel( - e.pixel, - (feature) => { - if (feature != null) { - feature.set('selected', 1) - selectedAnnotation = feature - publish( - container, - EVENT.ROI_SELECTED, - _getROIFromFeature(feature) - ) - return true - } - return false - }, - { - hitTolerance: 1, - layerFilter: (layer) => (layer instanceof PointsLayer) - } - ) + if (selectedAnnotation !== null) { + selectedAnnotation.set('selected', 0) + selectedAnnotation = null } + const container = this[_map].getTargetElement() + this[_map].forEachFeatureAtPixel( + e.pixel, + (feature) => { + if (feature != null) { + feature.set('selected', 1) + selectedAnnotation = feature + publish( + container, + EVENT.ROI_SELECTED, + _getROIFromFeature(feature) + ) + return true + } + return false + }, + { + hitTolerance: 1, + layerFilter: (layer) => (layer instanceof PointsLayer) + } + ) }) }