From 6f25a4d9498134715aa3eb3dd8d64b69d280647a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Wed, 29 Oct 2025 12:14:51 +0100 Subject: [PATCH 01/11] refactor($48): :lipstick: Made the Accepted filtering more intuitive --- src/AcceptedFiltering/threePanels.css | 16 +++++++++------- src/AcceptedFiltering/threePanels.js | 4 ++-- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/src/AcceptedFiltering/threePanels.css b/src/AcceptedFiltering/threePanels.css index e83b9e6..8dbde01 100644 --- a/src/AcceptedFiltering/threePanels.css +++ b/src/AcceptedFiltering/threePanels.css @@ -128,22 +128,24 @@ align-items: center; margin: 3px 0; font-size: 13px; - color: #ddd; /* visible text */ + color: #ddd; } -/* Color boxes */ +/* Color boxes → now circles */ #accepted_legend .legend-color { - width: 16px; - height: 16px; - border: 1px solid #777; - margin-right: 8px; - border-radius: 2px; + width: 20px; + height: 8px; + border-radius: 4px; /* pill shape */ + margin-left: 6px; } #accepted_legend .legend-color.accepted { background-color: #fff; + border: #0008; + box-shadow: 0 0 4px 1px #fff8; } #accepted_legend .legend-color.not-accepted { background-color: #000; + box-shadow: 0 0 4px 1px #fff8; } diff --git a/src/AcceptedFiltering/threePanels.js b/src/AcceptedFiltering/threePanels.js index 249df0f..e39cf65 100644 --- a/src/AcceptedFiltering/threePanels.js +++ b/src/AcceptedFiltering/threePanels.js @@ -299,12 +299,12 @@ function ensureAcceptedLegend() { legend.style.display = 'none' legend.innerHTML = `
+ Accepted points displayed as:
- Accepted points
+ Not accepted points displayed as:
- Not accepted points
` list.appendChild(legend) From 02fc74b1f69174573a168936d01b41ba9daddcad Mon Sep 17 00:00:00 2001 From: Kleinc Date: Wed, 29 Oct 2025 12:25:35 +0100 Subject: [PATCH 02/11] refactor(#48): :recycle: Make measurements tools more intuitive Write out name of each measurement tool and move measurements and saved positions above appearance --- src/MeasurementControl/measurementsPanel.css | 30 ++++++++++++++ src/MeasurementControl/measurementsPanel.js | 42 +++++++++++++++++++- 2 files changed, 71 insertions(+), 1 deletion(-) diff --git a/src/MeasurementControl/measurementsPanel.css b/src/MeasurementControl/measurementsPanel.css index 96f735f..f22b094 100644 --- a/src/MeasurementControl/measurementsPanel.css +++ b/src/MeasurementControl/measurementsPanel.css @@ -271,3 +271,33 @@ border-top: 1px solid #303a3f; padding-top: 10px; } + +.tool-with-label { + display: flex; + flex-direction: row; + align-items: center; + margin-top: 10px; + cursor: pointer; + border-radius: 4px; +} +.tool-with-label:hover { + box-shadow: 0 0 5px #fff8; +} + +.tool-with-label:hover img { + filter: brightness(1.7); +} + +.tool-with-label:hover .tool-label { + color: #fff; +} + +.tool-label { + font-size: 14px; + margin-top: 2px; + margin-left: 4px; + color: #aaa; + pointer-events: none; +} + + diff --git a/src/MeasurementControl/measurementsPanel.js b/src/MeasurementControl/measurementsPanel.js index 6b70ac2..9051705 100644 --- a/src/MeasurementControl/measurementsPanel.js +++ b/src/MeasurementControl/measurementsPanel.js @@ -29,7 +29,7 @@ export function initMeasurementsPanel(viewer) { panel.appendChild(toolsHostDiv) panel.appendChild(listContainerDiv) // Insert before filters/tools if possible, else append at end - const tools = document.getElementById('menu_tools') + const tools = document.getElementById('menu_appearance') if (tools) { menu.insertBefore(panel, tools) menu.insertBefore(header, panel) @@ -650,6 +650,46 @@ export function initMeasurementsPanel(viewer) { toolsHost.appendChild(existingTools) } + // After tools are moved into `toolsHost` + const toolDescriptions = { + 'angle.png': 'Measure angle', + 'point.svg': 'Add point', + 'distance.svg': 'Measure distance', + 'height.svg': 'Measure height', + 'circle.svg': 'Circle', + 'azimuth.svg': 'Azimuth', + 'area.svg': 'Area', + 'volume.svg': 'Volume', + '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(/\.[^/.]+$/, ''); + + if (toolDescriptions[file]) { + const wrapper = document.createElement('div'); + wrapper.className = 'tool-with-label'; + wrapper.id = `tool-wrapper-${baseName}`; + + wrapper.addEventListener('click', () => img.click()); + + 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); + } + }); + + // Move measurement options UI into our tools host if (toolsHost) { const measOptions = document.getElementById('measurement_options_show') From 1aba790259a7e2ac0bdccbf096622c86303012b6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Wed, 29 Oct 2025 12:29:42 +0100 Subject: [PATCH 03/11] refactor(#48): :lipstick: Collapsed some panels for a better visual representation --- src/potreeViewer.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/potreeViewer.js b/src/potreeViewer.js index ad7a0dc..1cddfcb 100644 --- a/src/potreeViewer.js +++ b/src/potreeViewer.js @@ -58,10 +58,10 @@ export async function createPotreeViewer( viewer.loadGUI(() => { viewer.setLanguage('en') - $('#menu_appearance').next().show() - $('#menu_tools').next().show() - $('#menu_scene').next().show() - $('#menu_filters').next().show() + $('#menu_appearance').next().hide() + $('#menu_tools').next().hide() + $('#menu_scene').next().hide() + $('#menu_filters').next().hide() viewer.toggleSidebar() // Store the last used elevation gradient From 500894b3fd0e95fe926983a901ca82c4af9d7cd0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Wed, 29 Oct 2025 12:37:39 +0100 Subject: [PATCH 04/11] refactor(#48): :fire: Remove the menu_filter panel in the sidebar --- src/potreeViewer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/potreeViewer.js b/src/potreeViewer.js index 1cddfcb..86e1d1b 100644 --- a/src/potreeViewer.js +++ b/src/potreeViewer.js @@ -61,7 +61,7 @@ export async function createPotreeViewer( $('#menu_appearance').next().hide() $('#menu_tools').next().hide() $('#menu_scene').next().hide() - $('#menu_filters').next().hide() + $('#menu_filters').remove() viewer.toggleSidebar() // Store the last used elevation gradient From 9e1a69c06cc3ceac8799053a851c10124e907fb9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Wed, 29 Oct 2025 13:35:20 +0100 Subject: [PATCH 05/11] feat(#48): :sparkles: Added hide/show button for saved positions --- src/AcceptedFiltering/threePanels.css | 1 + src/AnnotationControl/annotationPanel.css | 81 +++++++++++++-------- src/AnnotationControl/annotationPanel.js | 44 ++++++++++- src/MeasurementControl/measurementsPanel.js | 2 +- 4 files changed, 97 insertions(+), 31 deletions(-) diff --git a/src/AcceptedFiltering/threePanels.css b/src/AcceptedFiltering/threePanels.css index 8dbde01..4acff68 100644 --- a/src/AcceptedFiltering/threePanels.css +++ b/src/AcceptedFiltering/threePanels.css @@ -7,6 +7,7 @@ #btnTHUFilter { display: flex; width: 100%; + justify-content: center; margin: 6px 0 10px; padding: 10px 10px; font-size: 13px; diff --git a/src/AnnotationControl/annotationPanel.css b/src/AnnotationControl/annotationPanel.css index 13a3b2e..484fb8a 100644 --- a/src/AnnotationControl/annotationPanel.css +++ b/src/AnnotationControl/annotationPanel.css @@ -27,8 +27,8 @@ img.button-icon[src$='/annotation.svg'] { padding: 8px; border-radius: 4px; border: 1px solid #404a50; - background: #2f383d; - color: #cfd5d8; + background: #636262; + color: #636262; font-family: inherit; font-size: 12px; line-height: 1.3; @@ -44,10 +44,6 @@ img.button-icon[src$='/annotation.svg'] { margin-top: 6px; } -.annotation-add-button { - margin: 10px 0; -} - .annotation-empty { opacity: 0.6; padding: 10px; @@ -350,37 +346,64 @@ img.button-icon[src$='/annotation.svg'] { flex: 0 0 18px; } + +.pv-menu-list_annotations-panel{ + display: flex; + flex-direction: column; + align-items: center; + overflow: hidden; +} + /* Add button */ .annotation-add-button { - background: linear-gradient(180deg, #f6f6f6 0%, #e9e9e9 100%); - color: #222; - padding: 8px 16px; - min-width: 140px; - height: 38px; display: block; - margin: 12px auto; - border-radius: 6px; + justify-content: center; + width: 80%; + margin: 20px 0 10px; + padding: 10px 10px; font-size: 13px; - font-weight: 700; - box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset; - border: 1px solid #cfcfcf; - cursor: pointer; - text-align: center; -} -.annotation-add-button .add-label { - color: #222; - font-weight: 700; + font-weight: 500; + background-color: #636262; + color: #ffffff; + border: 1px solid #555; + border-radius: 4px; + cursor: pointer; + transition: + background-color 0.2s ease, + transform 0.1s ease; } + .annotation-add-button:hover { - background: linear-gradient(180deg, #f3f3f3 0%, #e2e2e2 100%); - border-color: #bfbfbf; + background-color: #8f8f8f; } -.annotation-add-button:active { +/* .annotation-add-button:active { transform: translateY(1px); - background: linear-gradient(180deg, #e9e9e9 0%, #dbdbdb 100%); + background: linear-gradient(180deg, #8f8f8f 0%, #8f8f8f 100%); box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.06); +} */ +/* .annotation-add-button:focus { + background-color: #8f8f8f; +} */ + +#labelToggleContainer { margin: 8px 0 6px; padding-left: 4px; } +#labelToggleContainer .labels-legend { font-size: 13px; color: #ddd; margin-bottom: 4px; } + +.toggle-group { + display: flex; + width: 265px; + border: 1px solid black; + border-radius: 4px; + overflow: hidden; } -.annotation-add-button:focus { - outline: 2px solid rgba(100, 100, 100, 0.12); - outline-offset: 2px; +.toggle-group button { + flex: 1; + padding: 6px 15px; + background: #A7A9AA; + color: #3d3c3c; + border: 0; + cursor: pointer; + font-weight: 300; + transition: background .2s; } +.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 cffe313..7087f7d 100644 --- a/src/AnnotationControl/annotationPanel.js +++ b/src/AnnotationControl/annotationPanel.js @@ -31,13 +31,14 @@ export function initAnnotationsPanel(viewer) { header.appendChild(headerSpan) const panel = document.createElement('div') - panel.className = 'pv-menu-list annotations-panel' + panel.className = 'pv-menu-list_annotations-panel' const listContainerDiv = document.createElement('div') listContainerDiv.id = 'annotations_list' 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) { @@ -68,6 +69,47 @@ export function initAnnotationsPanel(viewer) { targetContainer = panel.querySelector('#annotations_list') } } + + // --- Add Show/Hide labels toggle group --- + const panelEl = + targetContainer.closest('.pv-menu-list_annotations-panel') || + targetContainer.parentElement; + + if (!panelEl.querySelector('#labelToggleContainer')) { + 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'); + }); + } + if (!targetContainer) { console.warn( 'Annotations list container not found and dynamic injection failed' diff --git a/src/MeasurementControl/measurementsPanel.js b/src/MeasurementControl/measurementsPanel.js index 9051705..d4e9454 100644 --- a/src/MeasurementControl/measurementsPanel.js +++ b/src/MeasurementControl/measurementsPanel.js @@ -653,7 +653,7 @@ export function initMeasurementsPanel(viewer) { // After tools are moved into `toolsHost` const toolDescriptions = { 'angle.png': 'Measure angle', - 'point.svg': 'Add point', + 'point.svg': 'Inspect point', 'distance.svg': 'Measure distance', 'height.svg': 'Measure height', 'circle.svg': 'Circle', 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 06/11] 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) { From 1ead61bbe4ffd16a281588d0ea260eaf8749a2c7 Mon Sep 17 00:00:00 2001 From: Kleinc Date: Wed, 29 Oct 2025 14:03:57 +0100 Subject: [PATCH 07/11] style(#48): :lipstick: Fix spacing in elevation control --- src/AcceptedFiltering/threePanels.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/AcceptedFiltering/threePanels.css b/src/AcceptedFiltering/threePanels.css index 4acff68..95b812e 100644 --- a/src/AcceptedFiltering/threePanels.css +++ b/src/AcceptedFiltering/threePanels.css @@ -150,3 +150,11 @@ background-color: #000; box-shadow: 0 0 4px 1px #fff8; } + +#gradient_repeat_option fieldset { + margin: 15px 0px 12px 0px !important; +} + +#gradient_repeat_option fieldset legend { + margin: 0px 0px 5px 0px !important; +} From be4bf5f81a30dbfacebe45a99bf96f865004f71c Mon Sep 17 00:00:00 2001 From: Kleinc Date: Wed, 29 Oct 2025 14:45:54 +0100 Subject: [PATCH 08/11] style(#48): :lipstick: Remove unecessary lines and code commented out --- src/AnnotationControl/annotationPanel.css | 11 ++--------- 1 file changed, 2 insertions(+), 9 deletions(-) diff --git a/src/AnnotationControl/annotationPanel.css b/src/AnnotationControl/annotationPanel.css index d564f91..f250dba 100644 --- a/src/AnnotationControl/annotationPanel.css +++ b/src/AnnotationControl/annotationPanel.css @@ -356,7 +356,6 @@ img.button-icon[src$='/annotation.svg'] { /* Add button */ .annotation-add-button { display: block; - justify-content: center; width: 80%; margin: 20px 0 10px; padding: 10px 10px; @@ -375,14 +374,6 @@ img.button-icon[src$='/annotation.svg'] { .annotation-add-button:hover { background-color: #8f8f8f; } -/* .annotation-add-button:active { - transform: translateY(1px); - background: linear-gradient(180deg, #8f8f8f 0%, #8f8f8f 100%); - box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.06); -} */ -/* .annotation-add-button:focus { - background-color: #8f8f8f; -} */ #labelToggleContainer { margin: 8px 0 6px; @@ -411,9 +402,11 @@ img.button-icon[src$='/annotation.svg'] { font-weight: 300; transition: background 0.2s; } + .toggle-group button:not(:last-child) { border-right: 1px solid #555; } + .toggle-group button.active { background: #c7c9ca; color: #000; From 385185cd06a1ec07b4b97f8aa8cc403937b0623b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marie=20Wahlstr=C3=B8m?= Date: Thu, 30 Oct 2025 14:25:27 +0100 Subject: [PATCH 09/11] Update src/MeasurementControl/measurementsPanel.css Add more padding Co-authored-by: Adrian Haabpiht Solberg --- src/MeasurementControl/measurementsPanel.css | 1 + 1 file changed, 1 insertion(+) diff --git a/src/MeasurementControl/measurementsPanel.css b/src/MeasurementControl/measurementsPanel.css index b931d82..a848631 100644 --- a/src/MeasurementControl/measurementsPanel.css +++ b/src/MeasurementControl/measurementsPanel.css @@ -279,6 +279,7 @@ margin-top: 10px; cursor: pointer; border-radius: 4px; + padding: 4px; } .tool-with-label:hover { box-shadow: 0 0 5px #fff8; From 73059dec1e990f47b7bcca065896be2df875b0f1 Mon Sep 17 00:00:00 2001 From: Kleinc Date: Fri, 31 Oct 2025 14:21:04 +0100 Subject: [PATCH 10/11] refactor(#48): :recycle: Remove unecessary code, make annotations always visble when pressing "add a location" --- src/AnnotationControl/annotationPanel.js | 12 ++++++++++++ src/potreeViewer.js | 3 --- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/src/AnnotationControl/annotationPanel.js b/src/AnnotationControl/annotationPanel.js index 170bd58..684094d 100644 --- a/src/AnnotationControl/annotationPanel.js +++ b/src/AnnotationControl/annotationPanel.js @@ -988,6 +988,18 @@ export function initAnnotationsPanel(viewer) { annotationHeader.nextElementSibling.style.display = '' } } + // Ensure annotation labels are shown when starting to add a location. + // The "Show" button will be shown as active and reveals Potree's annotation container. + try { + const showBtn = document.getElementById('showLabelsBtn') + const hideBtn = document.getElementById('hideLabelsBtn') + if (showBtn) showBtn.classList.add('active') + if (hideBtn) hideBtn.classList.remove('active') + const cont = document.getElementById('potree_annotation_container') + if (cont) cont.style.display = '' + } catch (e) { + console.warn('Could not enable annotation labels on add', e) + } // Capture current camera view (position) at the moment the user clicks Add let camPos = null try { diff --git a/src/potreeViewer.js b/src/potreeViewer.js index 0b13435..5479902 100644 --- a/src/potreeViewer.js +++ b/src/potreeViewer.js @@ -55,9 +55,6 @@ export async function createPotreeViewer( viewer.loadGUI(() => { viewer.setLanguage('en') - $('#menu_appearance').next().hide() - $('#menu_tools').next().hide() - $('#menu_scene').next().hide() $('#menu_filters').remove() viewer.toggleSidebar() From 1d5c5dedc1ed5c87ead242b1697f7fcdc889374d Mon Sep 17 00:00:00 2001 From: Kleinc Date: Sun, 2 Nov 2025 10:09:25 +0100 Subject: [PATCH 11/11] refactor(#48): :recycle: Make elevation control button and accepted filter button more intuitive --- src/Filter/filter.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/Filter/filter.js b/src/Filter/filter.js index cdea1f8..981b6a8 100644 --- a/src/Filter/filter.js +++ b/src/Filter/filter.js @@ -189,6 +189,10 @@ function ensureElevationButton(hooks) { btn.type = 'button' btn.textContent = 'Activate elevation control' btn.addEventListener('click', () => { + const elevBtn = byId('btnDoElevationControl') + const accBtn = byId('doAcceptedFiltering') + if (elevBtn) elevBtn.style.display = 'none' + if (accBtn) accBtn.style.display = '' switchMode('elevation', hooks?.onActivateElevation, hooks) }) btns.appendChild(btn) @@ -283,6 +287,10 @@ function ensureAcceptedButton(hooks) { btn.type = 'button' btn.textContent = 'Activate accepted filter' btn.addEventListener('click', () => { + const accBtn = byId('doAcceptedFiltering') + const elevBtn = byId('btnDoElevationControl') + if (accBtn) accBtn.style.display = 'none' + if (elevBtn) elevBtn.style.display = '' switchMode('accepted', hooks?.onActivateAccepted, hooks) }) btns.appendChild(btn)