Altitude/AltitudeWeb
5
0
Fork 0
Code Issues 12 Pull Requests Actions Packages Projects Releases Wiki Activity

Add toggle for showing only intersecting particles

Browse Source
This commit is contained in:
stijn
2025-12-27 21:55:00 +01:00
parent b4fcbed781
commit 9b8c4891f4
4 changed files with 100 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/pages/particles/components/render-container/render-container.component.html
+19 -14
View File
@@ -8,12 +8,17 @@
</div>
<div class="button-row">
<button mat-mini-fab color="primary" (click)="resetCamera()"
matTooltip="Reset camera">
matTooltip="Reset camera">
<mat-icon>location_searching</mat-icon>
</button>
<button mat-mini-fab color="primary" (click)="toggleShowParticlesWhenIntersectingPlane()"
[matTooltip]="onlyIntersecting ? 'Show all particles' : 'Show only intersecting particles'">
<mat-icon>{{ onlyIntersecting ? 'visibility_off' : 'visibility' }}</mat-icon>
</button>
<button mat-mini-fab color="primary" (click)="togglePlaneLock()"
[matTooltip]="isPlaneLocked ? 'Unlock Plane' : 'Lock Plane'">
[matTooltip]="isPlaneLocked ? 'Unlock Plane' : 'Lock Plane'">
<mat-icon>{{ isPlaneLocked ? 'lock' : 'lock_open' }}</mat-icon>
</button>
</div>
@@ -21,33 +26,33 @@
@if (isPlaneLocked) {
<div class="plane-orientation-buttons">
<button mat-mini-fab color="warn" (click)="setPlaneOrientation(planeOrientations.VERTICAL_ABOVE)"
[class.active]="currentPlaneOrientation === planeOrientations.VERTICAL_ABOVE"
matTooltip="Vertical Above">
[class.active]="currentPlaneOrientation === planeOrientations.VERTICAL_ABOVE"
matTooltip="Vertical Above">
<mat-icon>arrow_upward</mat-icon>
</button>
<button mat-mini-fab color="warn" (click)="setPlaneOrientation(planeOrientations.VERTICAL_BELOW)"
[class.active]="currentPlaneOrientation === planeOrientations.VERTICAL_BELOW"
matTooltip="Vertical Below">
[class.active]="currentPlaneOrientation === planeOrientations.VERTICAL_BELOW"
matTooltip="Vertical Below">
<mat-icon>arrow_downward</mat-icon>
</button>
<button mat-mini-fab color="primary" (click)="setPlaneOrientation(planeOrientations.HORIZONTAL_FRONT)"
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_FRONT"
matTooltip="Horizontal Front">
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_FRONT"
matTooltip="Horizontal Front">
<mat-icon>arrow_forward</mat-icon>
</button>
<button mat-mini-fab color="primary" (click)="setPlaneOrientation(planeOrientations.HORIZONTAL_BEHIND)"
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_BEHIND"
matTooltip="Horizontal Behind">
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_BEHIND"
matTooltip="Horizontal Behind">
<mat-icon>arrow_back</mat-icon>
</button>
<button mat-mini-fab color="accent" (click)="setPlaneOrientation(planeOrientations.HORIZONTAL_RIGHT)"
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_RIGHT"
matTooltip="Horizontal Right">
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_RIGHT"
matTooltip="Horizontal Right">
<mat-icon>arrow_right</mat-icon>
</button>
<button mat-mini-fab color="accent" (click)="setPlaneOrientation(planeOrientations.HORIZONTAL_LEFT)"
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_LEFT"
matTooltip="Horizontal Left">
[class.active]="currentPlaneOrientation === planeOrientations.HORIZONTAL_LEFT"
matTooltip="Horizontal Left">
<mat-icon>arrow_left</mat-icon>
</button>
</div>
frontend/src/app/pages/particles/components/render-container/render-container.component.ts
+19 -9
View File
@@ -1,4 +1,4 @@
import {AfterViewInit, Component, ElementRef, OnDestroy, ViewChild} from '@angular/core';
import {AfterViewInit, Component, ElementRef, inject, OnDestroy, ViewChild} from '@angular/core';
import {MatMiniFabButton} from '@angular/material/button';
import {IntersectionPlaneService, PlaneOrientation} from '../../services/intersection-plane.service';
@@ -9,6 +9,7 @@ import {PlayerModelService} from '../../services/player-model.service';
import {InputHandlerService} from '../../services/input-handler.service';
import {FormsModule} from '@angular/forms';
import {MatFormField, MatInput, MatLabel} from '@angular/material/input';
import {ParticleManagerService} from '../../services/particle-manager.service';
@Component({
selector: 'app-render-container',
@@ -20,20 +21,18 @@ import {MatFormField, MatInput, MatLabel} from '@angular/material/input';
MatInput,
MatFormField,
MatLabel
],
],
templateUrl: './render-container.component.html',
styleUrl: './render-container.component.scss'
})
export class RenderContainerComponent implements AfterViewInit, OnDestroy {
@ViewChild('rendererContainer') rendererContainer!: ElementRef;
constructor(
private intersectionPlaneService: IntersectionPlaneService,
private playerModelService: PlayerModelService,
private inputHandlerService: InputHandlerService,
private rendererService: RendererService,
) {
}
private readonly intersectionPlaneService = inject(IntersectionPlaneService);
private readonly playerModelService = inject(PlayerModelService);
private readonly inputHandlerService = inject(InputHandlerService);
private readonly rendererService = inject(RendererService);
private readonly particleManagerService = inject(ParticleManagerService);
ngAfterViewInit(): void {
this.initializeScene();
@@ -99,6 +98,10 @@ export class RenderContainerComponent implements AfterViewInit, OnDestroy {
this.rendererService.resetCamera();
}
public toggleShowParticlesWhenIntersectingPlane(): void {
this.particleManagerService.onlyIntersectingParticles = !this.particleManagerService.onlyIntersectingParticles;
}
/**
* Get the current plane orientation
*/
@@ -106,6 +109,13 @@ export class RenderContainerComponent implements AfterViewInit, OnDestroy {
return this.intersectionPlaneService.getCurrentOrientation();
}
/**
* Retrieves the value indicating whether only intersecting particles are being considered.
*/
public get onlyIntersecting(): boolean {
return this.particleManagerService.onlyIntersectingParticles;
}
/**
* Set the plane orientation
*/