diff --git a/src/tools/Tools.vue b/src/tools/Tools.vue index 51755b6..27171f2 100644 --- a/src/tools/Tools.vue +++ b/src/tools/Tools.vue @@ -53,11 +53,30 @@ function centerCamera() { let selectionEnabled = ref(false); let selectedMaterials: Array = [] let hasListener = false; +let ignoreClickFrom: [number, number] | null = null; +let selectionMoveListener = (event: MouseEvent) => { + if (!selectionEnabled.value) return; + ignoreClickFrom = [event.clientX, event.clientY]; +}; let selectionListener = (event: MouseEvent) => { - if (!selectionEnabled.value) return; + if (!selectionEnabled.value) { + ignoreClickFrom = undefined; + return; + } + if (ignoreClickFrom) { + let [x, y] = ignoreClickFrom; + if (Math.abs(event.clientX - x) > 5 || Math.abs(event.clientY - y) > 5) { + ignoreClickFrom = undefined; + return; + } + ignoreClickFrom = undefined; + } let viewer: ModelViewerElement = props.refSData.viewer; + // FIXME: Clicking near edges does not work... + // FIXME: Clicking with ORTHO camera does not work... const material = viewer.materialFromPoint(event.clientX, event.clientY); + console.log(material) if (material === null) return; const wasSelected = selectedMaterials.find((m) => m === material) !== undefined; if (wasSelected) { @@ -85,7 +104,8 @@ function toggleSelection() { selectionEnabled.value = !selectionEnabled.value; if (selectionEnabled.value) { if (!hasListener) { - viewer.addEventListener('click', selectionListener); + viewer.addEventListener('mouseup', selectionListener); + viewer.addEventListener('mousedown', selectionMoveListener); // Avoid clicking when dragging hasListener = true; } for (let material of selectedMaterials) { diff --git a/src/viewer/ModelViewerWrapper.vue b/src/viewer/ModelViewerWrapper.vue index c59e329..6cb28a3 100644 --- a/src/viewer/ModelViewerWrapper.vue +++ b/src/viewer/ModelViewerWrapper.vue @@ -1,6 +1,6 @@