From fc1c376ced7ffc06b80ec72b4f7762f5c55427b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Wed, 29 Oct 2025 13:39:45 +0100 Subject: [PATCH] style: :art: Ran prettier format --- src/AnnotationControl/annotationPanel.css | 29 +++++++--- src/AnnotationControl/annotationPanel.js | 59 ++++++++++---------- src/MeasurementControl/measurementsPanel.css | 8 +-- src/MeasurementControl/measurementsPanel.js | 37 ++++++------ 4 files changed, 70 insertions(+), 63 deletions(-) diff --git a/src/AnnotationControl/annotationPanel.css b/src/AnnotationControl/annotationPanel.css index 484fb8a..d564f91 100644 --- a/src/AnnotationControl/annotationPanel.css +++ b/src/AnnotationControl/annotationPanel.css @@ -346,8 +346,7 @@ img.button-icon[src$='/annotation.svg'] { flex: 0 0 18px; } - -.pv-menu-list_annotations-panel{ +.pv-menu-list_annotations-panel { display: flex; flex-direction: column; align-items: center; @@ -367,7 +366,7 @@ img.button-icon[src$='/annotation.svg'] { color: #ffffff; border: 1px solid #555; border-radius: 4px; - cursor: pointer; + cursor: pointer; transition: background-color 0.2s ease, transform 0.1s ease; @@ -385,8 +384,15 @@ img.button-icon[src$='/annotation.svg'] { background-color: #8f8f8f; } */ -#labelToggleContainer { margin: 8px 0 6px; padding-left: 4px; } -#labelToggleContainer .labels-legend { font-size: 13px; color: #ddd; margin-bottom: 4px; } +#labelToggleContainer { + margin: 8px 0 6px; + padding-left: 4px; +} +#labelToggleContainer .labels-legend { + font-size: 13px; + color: #ddd; + margin-bottom: 4px; +} .toggle-group { display: flex; @@ -398,12 +404,17 @@ img.button-icon[src$='/annotation.svg'] { .toggle-group button { flex: 1; padding: 6px 15px; - background: #A7A9AA; + background: #a7a9aa; color: #3d3c3c; border: 0; cursor: pointer; font-weight: 300; - transition: background .2s; + transition: background 0.2s; +} +.toggle-group button:not(:last-child) { + border-right: 1px solid #555; +} +.toggle-group button.active { + background: #c7c9ca; + color: #000; } -.toggle-group button:not(:last-child) { border-right: 1px solid #555; } -.toggle-group button.active { background: #C7C9CA; color: #000; } \ No newline at end of file diff --git a/src/AnnotationControl/annotationPanel.js b/src/AnnotationControl/annotationPanel.js index 7087f7d..170bd58 100644 --- a/src/AnnotationControl/annotationPanel.js +++ b/src/AnnotationControl/annotationPanel.js @@ -38,7 +38,6 @@ export function initAnnotationsPanel(viewer) { listContainerDiv.className = 'auto' panel.appendChild(listContainerDiv) - // Insert after measurement panel but before tools, or at end if not found const measurements = document.querySelector('.measurements-panel') if (measurements) { @@ -72,42 +71,42 @@ export function initAnnotationsPanel(viewer) { // --- Add Show/Hide labels toggle group --- const panelEl = - targetContainer.closest('.pv-menu-list_annotations-panel') || - targetContainer.parentElement; + targetContainer.closest('.pv-menu-list_annotations-panel') || + targetContainer.parentElement if (!panelEl.querySelector('#labelToggleContainer')) { - const controls = document.createElement('div'); - controls.id = 'labelToggleContainer'; - controls.innerHTML = ` + const controls = document.createElement('div') + controls.id = 'labelToggleContainer' + controls.innerHTML = `

Show/Hide saved locations

- `; - // Insert before list of annotations - panelEl.insertBefore(controls, targetContainer); - - // show/hide all annotations - const setLabelsVisible = (visible) => { - const cont = document.getElementById('potree_annotation_container'); - if (cont) cont.style.display = visible ? '' : 'none'; - }; - - const showBtn = controls.querySelector('#showLabelsBtn'); - const hideBtn = controls.querySelector('#hideLabelsBtn'); - - showBtn.addEventListener('click', () => { - setLabelsVisible(true); - showBtn.classList.add('active'); - hideBtn.classList.remove('active'); - }); - - hideBtn.addEventListener('click', () => { - setLabelsVisible(false); - hideBtn.classList.add('active'); - showBtn.classList.remove('active'); - }); + ` + // Insert before list of annotations + panelEl.insertBefore(controls, targetContainer) + + // show/hide all annotations + const setLabelsVisible = (visible) => { + const cont = document.getElementById('potree_annotation_container') + if (cont) cont.style.display = visible ? '' : 'none' + } + + const showBtn = controls.querySelector('#showLabelsBtn') + const hideBtn = controls.querySelector('#hideLabelsBtn') + + showBtn.addEventListener('click', () => { + setLabelsVisible(true) + showBtn.classList.add('active') + hideBtn.classList.remove('active') + }) + + hideBtn.addEventListener('click', () => { + setLabelsVisible(false) + hideBtn.classList.add('active') + showBtn.classList.remove('active') + }) } if (!targetContainer) { diff --git a/src/MeasurementControl/measurementsPanel.css b/src/MeasurementControl/measurementsPanel.css index f22b094..b931d82 100644 --- a/src/MeasurementControl/measurementsPanel.css +++ b/src/MeasurementControl/measurementsPanel.css @@ -277,7 +277,7 @@ flex-direction: row; align-items: center; margin-top: 10px; - cursor: pointer; + cursor: pointer; border-radius: 4px; } .tool-with-label:hover { @@ -285,7 +285,7 @@ } .tool-with-label:hover img { - filter: brightness(1.7); + filter: brightness(1.7); } .tool-with-label:hover .tool-label { @@ -297,7 +297,5 @@ margin-top: 2px; margin-left: 4px; color: #aaa; - pointer-events: none; + pointer-events: none; } - - diff --git a/src/MeasurementControl/measurementsPanel.js b/src/MeasurementControl/measurementsPanel.js index d4e9454..3021108 100644 --- a/src/MeasurementControl/measurementsPanel.js +++ b/src/MeasurementControl/measurementsPanel.js @@ -663,32 +663,31 @@ export function initMeasurementsPanel(viewer) { 'sphere_distances.svg': 'Sphere volume', 'profile.svg': '2D height profile', 'reset_tools.svg': 'Remove all' - }; + } - const toolIcons = existingTools.querySelectorAll('img'); - toolIcons.forEach(img => { - const src = img.getAttribute('src'); - const file = src.split('/').pop(); // extract icon name - const baseName = file.replace(/\.[^/.]+$/, ''); + const toolIcons = existingTools.querySelectorAll('img') + toolIcons.forEach((img) => { + const src = img.getAttribute('src') + const file = src.split('/').pop() // extract icon name + const baseName = file.replace(/\.[^/.]+$/, '') if (toolDescriptions[file]) { - const wrapper = document.createElement('div'); - wrapper.className = 'tool-with-label'; - wrapper.id = `tool-wrapper-${baseName}`; + const wrapper = document.createElement('div') + wrapper.className = 'tool-with-label' + wrapper.id = `tool-wrapper-${baseName}` - wrapper.addEventListener('click', () => img.click()); + wrapper.addEventListener('click', () => img.click()) - img.parentNode.insertBefore(wrapper, img); - wrapper.appendChild(img); + img.parentNode.insertBefore(wrapper, img) + wrapper.appendChild(img) - const label = document.createElement('span'); - label.className = 'tool-label'; - label.textContent = toolDescriptions[file]; - label.id = `label-${file.replace(/\.[^/.]+$/, '')}`; - wrapper.appendChild(label); + const label = document.createElement('span') + label.className = 'tool-label' + label.textContent = toolDescriptions[file] + label.id = `label-${file.replace(/\.[^/.]+$/, '')}` + wrapper.appendChild(label) } - }); - + }) // Move measurement options UI into our tools host if (toolsHost) {