components/tool-panel/tool-panel.component.ts

0001 import { Component } from '@angular/core';
0002 import { NgIf } from '@angular/common';
0003 import { MatIcon } from '@angular/material/icon';
0004 import { ViewOptionsComponent } from '../view-options/view-options.component';
0005 import { ThreeService } from '../../services/three.service';
0006 import {MatIconButton} from "@angular/material/button";
0007 import {MatTooltip} from "@angular/material/tooltip";
0008
0009 @Component({
0010     selector: 'app-tool-panel',
0011   imports: [
0012     NgIf,
0013     MatIcon,
0014     ViewOptionsComponent,
0015     MatIconButton,
0016     MatTooltip,
0017
0018   ],
0019     templateUrl: './tool-panel.component.html',
0020     styleUrls: ['./tool-panel.component.scss']
0021 })
0022 export class ToolPanelComponent {
0023   isCollapsed = false;
0024
0025   /** Factor to zoom by. */
0026   private zoomFactor = 1.1;
0027   /** Whether camera is orthographic or perspective. */
0028   private orthographicView = false;
0029
0030   constructor(
0031     private threeService: ThreeService // no more EventDisplayService
0032   ) {}
0033
0034   /**
0035    * Zoom in or out around the orbit controls target.
0036    * Use OrbitControls or direct camera logic from threeService.
0037    */
0038   private zoomTo(factor: number): void {
0039     const controls = this.threeService.controls;
0040     const camera = this.threeService.camera;
0041     // Basic logic: move camera closer/farther from controls.target
0042     const newPos = camera.position.clone().sub(controls.target).multiplyScalar(factor).add(controls.target);
0043     camera.position.copy(newPos);
0044     controls.update();
0045   }
0046
0047   onLeftClick(event: MouseEvent, action: string) {
0048     // Only respond to left-button
0049     if (event.button === 0) {
0050       if (action === 'zoomIn') {
0051         this.zoomIn();
0052       } else if (action === 'zoomOut') {
0053         this.zoomOut();
0054       }
0055     }
0056   }
0057
0058   zoomIn() {
0059     this.zoomTo(1 / this.zoomFactor);
0060   }
0061
0062   zoomOut() {
0063     this.zoomTo(this.zoomFactor);
0064   }
0065
0066   clearZoom() {
0067     // If you had logic for continuous zoom while mouse is held, you can clear it here
0068   }
0069
0070   togglePanel() {
0071     this.isCollapsed = !this.isCollapsed;
0072   }
0073
0074   /**
0075    * Switch between orthographic and perspective camera.
0076    * You can define a method in ThreeService to do the actual swap or toggling.
0077    */
0078   switchMainView() {
0079     this.orthographicView = !this.orthographicView;
0080     this.threeService.toggleOrthographicView(this.orthographicView);
0081   }
0082 }