components/view-options/view-options.component.ts

0001 import {
0002   Component,
0003   type OnInit,
0004   type OnDestroy,
0005   ViewChild,
0006 } from '@angular/core';
0007 import { PresetView } from 'phoenix-event-display';
0008 import {MatCheckbox, MatCheckboxChange} from '@angular/material/checkbox';
0009 import {EventDisplayService} from "phoenix-ui-components";
0010 import { MatDialog } from '@angular/material/dialog';
0011 import { CartesianGridConfigComponent } from './cartesian-grid-config/cartesian-grid-config.component';
0012 import { Subscription } from 'rxjs';
0013 import { Vector3 } from 'three';
0014 import {MatMenu, MatMenuItem, MatMenuTrigger} from '@angular/material/menu';
0015 import {NgForOf, NgIf} from "@angular/common";
0016 import {MenuToggleComponent} from "../menu-toggle/menu-toggle.component";
0017 import {MatIcon} from "@angular/material/icon";
0018
0019 @Component({
0020   selector: 'app-custom-view-options',
0021   templateUrl: './view-options.component.html',
0022   styleUrls: ['./view-options.component.scss'],
0023   imports: [
0024     MatMenu,
0025     MatCheckbox,
0026     MatMenuItem,
0027     NgForOf,
0028     MenuToggleComponent,
0029     MatMenuTrigger,
0030     NgIf,
0031     MatIcon
0032   ],
0033   standalone: true
0034 })
0035 export class ViewOptionsComponent implements OnInit, OnDestroy {
0036   @ViewChild(MatMenuTrigger) trigger!: MatMenuTrigger;
0037   showCartesianGrid: boolean = false;
0038   scale: number = 3000;
0039   views!: PresetView[];
0040   show3DPoints!: boolean;
0041   origin: Vector3 = new Vector3(0, 0, 0);
0042   sub!: Subscription;
0043
0044   constructor(
0045     private eventDisplay: EventDisplayService,
0046     private dialog: MatDialog,
0047   ) {}
0048
0049   ngOnInit(): void {
0050     this.views = this.eventDisplay.getUIManager().getPresetViews();
0051     this.sub = this.eventDisplay
0052       .getThreeManager()
0053       .originChanged.subscribe((intersect) => {
0054         this.origin = intersect;
0055       });
0056   }
0057
0058   openCartesianGridConfigDialog() {
0059     this.dialog.open(CartesianGridConfigComponent, {
0060       data: {
0061         gridVisible: this.showCartesianGrid,
0062         scale: this.scale,
0063       },
0064       position: {
0065         bottom: '5rem',
0066         left: '3rem',
0067       },
0068     });
0069   }
0070
0071   displayView($event: any, view: PresetView) {
0072     $event.stopPropagation();
0073     this.eventDisplay.getUIManager().displayView(view);
0074   }
0075
0076   setAxis(change: MatCheckboxChange) {
0077     const value = change.checked;
0078     this.eventDisplay.getUIManager().setShowAxis(value);
0079   }
0080
0081   setEtaPhiGrid(change: MatCheckboxChange) {
0082     const value = change.checked;
0083     this.eventDisplay.getUIManager().setShowEtaPhiGrid(value);
0084   }
0085
0086   setCartesianGrid(change: MatCheckboxChange) {
0087     this.showCartesianGrid = change.checked;
0088     this.eventDisplay
0089       .getUIManager()
0090       .setShowCartesianGrid(this.showCartesianGrid, this.scale);
0091   }
0092
0093   showLabels(change: MatCheckboxChange) {
0094     this.eventDisplay.getUIManager().showLabels(change.checked);
0095   }
0096
0097   show3DMousePoints(change: MatCheckboxChange) {
0098     this.show3DPoints = change.checked;
0099     this.eventDisplay.getUIManager().show3DMousePoints(this.show3DPoints);
0100   }
0101
0102   toggleShowDistance(change: MatCheckboxChange) {
0103     this.trigger.closeMenu();
0104     this.eventDisplay.getUIManager().show3DDistance(change.checked);
0105   }
0106
0107   ngOnDestroy(): void {
0108     this.sub.unsubscribe();
0109   }
0110 }