diff --git a/packages/frontend-2/components/viewer/models/Card.vue b/packages/frontend-2/components/viewer/models/Card.vue index 166c7fe2d..d98580311 100644 --- a/packages/frontend-2/components/viewer/models/Card.vue +++ b/packages/frontend-2/components/viewer/models/Card.vue @@ -10,6 +10,7 @@ @focusin="highlightObject" @focusout="unhighlightObject" @click="selectObject" + @dblclick="zoomToModel" @keydown.enter="selectObject" > { } } +const zoomToModel = () => { + if (modelObjectIds.value.length > 0) { + zoom(modelObjectIds.value) + } +} + const removeModel = async (modelId: string) => { const builder = SpeckleViewer.ViewerRoute.resourceBuilder() for (const loadedResource of resourceItems.value) { diff --git a/packages/frontend-2/components/viewer/models/VirtualTreeItem.vue b/packages/frontend-2/components/viewer/models/VirtualTreeItem.vue index 548f76739..9692aaaee 100644 --- a/packages/frontend-2/components/viewer/models/VirtualTreeItem.vue +++ b/packages/frontend-2/components/viewer/models/VirtualTreeItem.vue @@ -5,6 +5,7 @@ class="group flex items-center w-full p-1 pr-2 cursor-pointer text-left justify-between" :class="[getItemBackgroundClass(), getItemOpacityClass()]" @click="handleItemClick($event)" + @dblclick="handleItemDoubleClick()" @mouseenter="handleItemMouseEnter()" @mouseleave="handleItemMouseLeave()" @focusin="handleItemMouseEnter()" @@ -65,7 +66,8 @@ import { import { useSelectionUtilities, useFilterUtilities, - useHighlightedObjectsUtilities + useHighlightedObjectsUtilities, + useCameraUtilities } from '~~/lib/viewer/composables/ui' import { useInjectedViewerState } from '~~/lib/viewer/composables/setup' import type { UnifiedVirtualItem } from '~~/lib/viewer/composables/tree' @@ -83,6 +85,7 @@ const { objects: selectedObjects } = useSelectionUtilities() const { hideObjects, showObjects, isolateObjects, unIsolateObjects } = useFilterUtilities() const { highlightObjects, unhighlightObjects } = useHighlightedObjectsUtilities() +const { zoom } = useCameraUtilities() const { viewer: { @@ -146,6 +149,11 @@ const handleItemClick = (event: MouseEvent | KeyboardEvent) => { emit('item-click', props.item, event) } +const handleItemDoubleClick = () => { + if (!rawSpeckleData.value?.id) return + zoom([rawSpeckleData.value.id]) +} + const handleItemMouseEnter = () => { if (!rawSpeckleData.value) return highlightObjects(getTargetObjectIds(rawSpeckleData.value))