view-options/cartesian-grid-config/cartesian-grid-config.component.ts

0001 import { Component, Inject, OnInit } from '@angular/core';
0002 import {
0003   MatDialogRef,
0004   MAT_DIALOG_DATA,
0005   MatDialogActions,
0006   MatDialogTitle,
0007   MatDialogContent
0008 } from '@angular/material/dialog';
0009 import { SceneHelpersService } from '../../../services/scene-helpers.service';
0010 import { Vector3 } from 'three';
0011 import {MatCheckbox} from "@angular/material/checkbox";
0012 import {MatMenuItem} from "@angular/material/menu";
0013 import {MatSlider, MatSliderThumb} from "@angular/material/slider";
0014 import {MatButton} from "@angular/material/button";
0015
0016 @Component({
0017     selector: 'app-cartesian-grid-config',
0018     templateUrl: './cartesian-grid-config.component.html',
0019     styleUrls: ['./cartesian-grid-config.component.scss'],
0020     imports: [
0021         MatCheckbox,
0022         MatMenuItem,
0023         MatSlider,
0024         MatSliderThumb,
0025         MatDialogActions,
0026         MatButton,
0027         MatDialogTitle,
0028         MatDialogContent,
0029         // relevant Angular + Material modules
0030     ]
0031 })
0032 export class CartesianGridConfigComponent implements OnInit {
0033   showCartesianGrid!: boolean;
0034   scale!: number;
0035
0036   // Example internal config:
0037   gridConfig = {
0038     showXY: true,
0039     showYZ: true,
0040     showZX: true,
0041     xDistance: 1000,
0042     yDistance: 1000,
0043     zDistance: 1000,
0044     sparsity: 2,
0045   };
0046
0047   // Current "origin" or "cartesianPos" if you want that logic
0048   cartesianPos = new Vector3();
0049
0050   constructor(
0051     @Inject(MAT_DIALOG_DATA)
0052     public data: { gridVisible: boolean; scale: number },
0053     private dialogRef: MatDialogRef<CartesianGridConfigComponent>,
0054     private sceneHelpers: SceneHelpersService
0055   ) {}
0056
0057   ngOnInit(): void {
0058     // init local states from data
0059     this.showCartesianGrid = this.data.gridVisible;
0060     this.scale = this.data.scale;
0061   }
0062
0063   onClose() {
0064     this.dialogRef.close();
0065   }
0066
0067   onSave(xStr: string, yStr: string, zStr: string) {
0068     // Shift the grid by new origin
0069     const xNum = Number(xStr);
0070     const yNum = Number(yStr);
0071     const zNum = Number(zStr);
0072
0073     const shift = new Vector3(
0074       xNum - this.cartesianPos.x,
0075       yNum - this.cartesianPos.y,
0076       zNum - this.cartesianPos.z
0077     );
0078     this.sceneHelpers.translateCartesianGrid(shift);
0079     this.cartesianPos.set(xNum, yNum, zNum);
0080     // Optionally update the main show/hide
0081     this.sceneHelpers.setShowCartesianGrid(this.showCartesianGrid, this.scale, this.gridConfig);
0082
0083     this.dialogRef.close();
0084   }
0085
0086   shiftCartesianGridByPointer() {
0087     // replicate your old “click-based shifting”
0088     this.sceneHelpers.shiftCartesianGridByPointer();
0089     this.dialogRef.close();
0090   }
0091
0092   // Then for toggling planes or adjusting distances:
0093   showXYPlanes(value: boolean) {
0094     this.gridConfig.showXY = value;
0095     this.applyGridConfig();
0096   }
0097   showYZPlanes(value: boolean) {
0098     this.gridConfig.showYZ = value;
0099     this.applyGridConfig();
0100   }
0101   showZXPlanes(value: boolean) {
0102     this.gridConfig.showZX = value;
0103     this.applyGridConfig();
0104   }
0105
0106   addXYPlanes(event: Event) {
0107     const inputVal = Number((event.target as HTMLInputElement).value);
0108     this.gridConfig.zDistance = inputVal;
0109     this.applyGridConfig();
0110   }
0111   // etc. for XDistance, YDistance, etc.
0112
0113   applyGridConfig() {
0114     // Actually update the group in scene
0115     this.sceneHelpers.setShowCartesianGrid(this.showCartesianGrid, this.scale, this.gridConfig);
0116   }
0117
0118   calcPlanes(dist: number) {
0119     // Some logic to compute how many planes
0120     return Math.max(
0121       0,
0122       1 + 2 * Math.floor((dist * 10) / (this.scale * this.gridConfig.sparsity))
0123     );
0124   }
0125 }