2025-12-27 20:55:00 +00:00
|
|
|
import {AfterViewInit, Component, ElementRef, inject, OnDestroy, ViewChild} from '@angular/core';
|
2025-06-22 17:23:54 +00:00
|
|
|
import {MatMiniFabButton} from '@angular/material/button';
|
2025-07-15 19:48:23 +00:00
|
|
|
|
2025-06-22 17:23:54 +00:00
|
|
|
import {IntersectionPlaneService, PlaneOrientation} from '../../services/intersection-plane.service';
|
|
|
|
|
import {MatIcon} from '@angular/material/icon';
|
|
|
|
|
import {MatTooltip} from '@angular/material/tooltip';
|
|
|
|
|
import {RendererService} from '../../services/renderer.service';
|
|
|
|
|
import {PlayerModelService} from '../../services/player-model.service';
|
|
|
|
|
import {InputHandlerService} from '../../services/input-handler.service';
|
2025-06-22 21:24:06 +00:00
|
|
|
import {FormsModule} from '@angular/forms';
|
|
|
|
|
import {MatFormField, MatInput, MatLabel} from '@angular/material/input';
|
2025-12-27 20:55:00 +00:00
|
|
|
import {ParticleManagerService} from '../../services/particle-manager.service';
|
2025-06-22 17:23:54 +00:00
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
|
selector: 'app-render-container',
|
|
|
|
|
imports: [
|
|
|
|
|
MatIcon,
|
|
|
|
|
MatMiniFabButton,
|
|
|
|
|
MatTooltip,
|
2025-06-22 21:24:06 +00:00
|
|
|
FormsModule,
|
|
|
|
|
MatInput,
|
|
|
|
|
MatFormField,
|
|
|
|
|
MatLabel
|
2025-12-27 20:55:00 +00:00
|
|
|
],
|
2025-06-22 17:23:54 +00:00
|
|
|
templateUrl: './render-container.component.html',
|
|
|
|
|
styleUrl: './render-container.component.scss'
|
|
|
|
|
})
|
|
|
|
|
export class RenderContainerComponent implements AfterViewInit, OnDestroy {
|
|
|
|
|
@ViewChild('rendererContainer') rendererContainer!: ElementRef;
|
|
|
|
|
|
2025-12-27 20:55:00 +00:00
|
|
|
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);
|
2025-06-22 17:23:54 +00:00
|
|
|
|
|
|
|
|
ngAfterViewInit(): void {
|
|
|
|
|
this.initializeScene();
|
|
|
|
|
this.animate();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Clean up resources when component is destroyed
|
|
|
|
|
*/
|
|
|
|
|
ngOnDestroy(): void {
|
|
|
|
|
if (this.rendererService.renderer) {
|
|
|
|
|
this.inputHandlerService.cleanup(this.rendererService.renderer.domElement);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Initialize the 3D scene and all related components
|
|
|
|
|
*/
|
|
|
|
|
private initializeScene(): void {
|
|
|
|
|
this.rendererService.initializeRenderer(this.rendererContainer);
|
2025-06-22 18:17:02 +00:00
|
|
|
this.playerModelService.loadSkinTexture('/public/img/skins/steve.png')
|
2025-06-22 17:53:27 +00:00
|
|
|
.then(() => {
|
|
|
|
|
// Then create the player model with the texture applied
|
|
|
|
|
this.playerModelService.createPlayerModel();
|
|
|
|
|
});
|
2025-06-22 17:23:54 +00:00
|
|
|
this.intersectionPlaneService.createIntersectionPlane();
|
|
|
|
|
this.inputHandlerService.initializeInputHandlers(this.rendererService.renderer.domElement);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Animation loop
|
|
|
|
|
*/
|
|
|
|
|
private animate(): void {
|
|
|
|
|
requestAnimationFrame(this.animate.bind(this));
|
|
|
|
|
this.intersectionPlaneService.updatePlaneOrientation(this.rendererService.camera);
|
|
|
|
|
this.rendererService.render();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Get whether the plane is locked
|
|
|
|
|
*/
|
|
|
|
|
public get isPlaneLocked(): boolean {
|
|
|
|
|
return this.intersectionPlaneService.isPlaneLocked();
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-22 21:24:06 +00:00
|
|
|
public set opacity(opacity: number) {
|
|
|
|
|
this.intersectionPlaneService.currentOpacity = opacity;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
public get opacity(): number {
|
|
|
|
|
return this.intersectionPlaneService.currentOpacity;
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-22 17:23:54 +00:00
|
|
|
/**
|
|
|
|
|
* Toggle the plane locked state
|
|
|
|
|
*/
|
|
|
|
|
public togglePlaneLock(): void {
|
|
|
|
|
const newLockedState = !this.isPlaneLocked;
|
|
|
|
|
this.intersectionPlaneService.setPlaneLocked(newLockedState);
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-22 18:53:11 +00:00
|
|
|
public resetCamera(): void {
|
|
|
|
|
this.rendererService.resetCamera();
|
|
|
|
|
}
|
|
|
|
|
|
2025-12-27 20:55:00 +00:00
|
|
|
public toggleShowParticlesWhenIntersectingPlane(): void {
|
|
|
|
|
this.particleManagerService.onlyIntersectingParticles = !this.particleManagerService.onlyIntersectingParticles;
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-22 17:23:54 +00:00
|
|
|
/**
|
|
|
|
|
* Get the current plane orientation
|
|
|
|
|
*/
|
|
|
|
|
public get currentPlaneOrientation(): PlaneOrientation {
|
|
|
|
|
return this.intersectionPlaneService.getCurrentOrientation();
|
|
|
|
|
}
|
|
|
|
|
|
2025-12-27 20:55:00 +00:00
|
|
|
/**
|
|
|
|
|
* Retrieves the value indicating whether only intersecting particles are being considered.
|
|
|
|
|
*/
|
|
|
|
|
public get onlyIntersecting(): boolean {
|
|
|
|
|
return this.particleManagerService.onlyIntersectingParticles;
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-22 17:23:54 +00:00
|
|
|
/**
|
|
|
|
|
* Set the plane orientation
|
|
|
|
|
*/
|
|
|
|
|
public setPlaneOrientation(orientation: PlaneOrientation): void {
|
|
|
|
|
this.intersectionPlaneService.setPlaneOrientation(orientation);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* Get all available plane orientations
|
|
|
|
|
*/
|
|
|
|
|
public get planeOrientations(): typeof PlaneOrientation {
|
|
|
|
|
return PlaneOrientation;
|
|
|
|
|
}
|
|
|
|
|
}
|