Clipping restored via signals

Author: DraTeots

build.py

@@ -179,13 +179,13 @@ def main():
 
     # Next steps depend on mode
     mode = args.mode[0] if args.mode else ""
-    if mode in ["all", "build_ng", "build-ng"]:
+    if mode in ["all", "ng", "build_ng", "build-ng"]:
         build_ng(is_dry_run=args.dry_run)
 
     if mode in ["all", "test"]:
         test_all(is_dry_run=args.dry_run)
 
-    if mode in ["test_frontend", "test-frontend"]:
+    if mode in ["test_frontend", "ng", "test-frontend"]:
         test_frontend(is_dry_run=args.dry_run)
 
     if mode in ["test_backend", "test-backend"]:

firebird-ng/src/app/components/object-clipping/geometry-clipping.component.html renamed to firebird-ng/src/app/components/geometry-clipping/geometry-clipping.component.html

@@ -19,7 +19,7 @@
       >
         <mat-checkbox
           #clippingCheckbox
-          [checked]="clippingEnabled"
+          [checked]="clippingEnabled()"
           (click)="$event.stopPropagation()"
           (change)="toggleClipping($event)"
         >
@@ -30,7 +30,7 @@
       <div class="angle-presets">
           <button mat-icon-button style="box-shadow: var(--mat-sys-level2);"
             (click)="changeStartClippingAngle(0); changeOpeningClippingAngle(180)"
-            [disabled]="!clippingEnabled"
+            [disabled]="!clippingEnabled()"
             matTooltip="Half Horizontal (0°-180°)">
             <svg viewBox="0 0 24 24" style="width:24px;height:24px">
               <circle cx="12" cy="12" r="10" fill="#f0f0f0" stroke="#cccccc" stroke-width="1"/>
@@ -40,7 +40,7 @@
           </button>
           <button mat-icon-button style="box-shadow: var(--mat-sys-level2);"
             (click)=" changeStartClippingAngle(90); changeOpeningClippingAngle(180)"
-            [disabled]="!clippingEnabled"
+            [disabled]="!clippingEnabled()"
             matTooltip="Half Vertical (90°-180°)">
             <svg viewBox="0 0 24 24" style="width:24px;height:24px">
               <circle cx="12" cy="12" r="10" fill="#bec2ff" stroke="#cccccc" stroke-width="1"/>
@@ -49,7 +49,7 @@
           </button>
           <button mat-icon-button style="box-shadow: var(--mat-sys-level2);"
             (click)="changeStartClippingAngle(90); changeOpeningClippingAngle(90)"
-            [disabled]="!clippingEnabled"
+            [disabled]="!clippingEnabled()"
             matTooltip="Three Quarters (90°-90°)">
             <svg viewBox="0 0 24 24" style="width:24px;height:24px">
               <circle cx="12" cy="12" r="10" fill="#bec2ff" stroke="#cccccc" stroke-width="1"/>
@@ -63,12 +63,12 @@
     <button
       class="slider-btn"
       mat-menu-item
-      [disabled]="!clippingEnabled"
+      [disabled]="!clippingEnabled()"
     >
       <mat-slider min="0" max="360" step="1">
         <input
           matSliderThumb
-          [value]="openingAngle"
+          [value]="openingAngle()"
           (input)="onSliderInput($event, 'opening')"
           (valueChange)="changeOpeningClippingAngle($event)"
         />
@@ -79,28 +79,28 @@
       <input
         class="angle-value-input"
         type="number"
-        [value]="openingAngle"
-        [disabled]="!clippingEnabled"
+        [value]="openingAngle()"
+        [disabled]="!clippingEnabled()"
         (input)="openingAngle = $any($event.target).valueAsNumber"
         (change)="changeOpeningClippingAngle(openingAngle())"
       />
     </button>
 
 
-    <div class="preset-buttons" [class.disabled]="!clippingEnabled">
+    <div class="preset-buttons" [class.disabled]="!clippingEnabled()">
       <button mat-menu-item
               (click)="changeOpeningClippingAngle(90)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         90°
       </button>
       <button mat-menu-item
               (click)="changeOpeningClippingAngle(180)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         180°
       </button>
       <button mat-menu-item
               (click)="changeOpeningClippingAngle(270)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         270°
       </button>
     </div>
@@ -111,12 +111,12 @@
     <button
       class="slider-btn"
       mat-menu-item
-      [disabled]="!clippingEnabled"
+      [disabled]="!clippingEnabled()"
     >
       <mat-slider min="0" max="360" step="1">
         <input
           matSliderThumb
-          [value]="startAngle"
+          [value]="startAngle()"
           (input)="onSliderInput($event, 'start')"
           (valueChange)="changeStartClippingAngle($event)"
         />
@@ -127,33 +127,33 @@
       <input
         class="angle-value-input"
         type="number"
-        [value]="startAngle"
-        [disabled]="!clippingEnabled"
+        [value]="startAngle()"
+        [disabled]="!clippingEnabled()"
         (input)="startAngle = $any($event.target).valueAsNumber"
         (change)="changeStartClippingAngle(startAngle())"
       />
     </button>
 
 
-    <div class="preset-buttons" [class.disabled]="!clippingEnabled">
+    <div class="preset-buttons" [class.disabled]="!clippingEnabled()">
       <button mat-menu-item
               (click)="changeStartClippingAngle(0)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         0°
       </button>
       <button mat-menu-item
               (click)="changeStartClippingAngle(90)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         90°
       </button>
       <button mat-menu-item
               (click)="changeStartClippingAngle(180)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         180°
       </button>
       <button mat-menu-item
               (click)="changeStartClippingAngle(270)"
-              [disabled]="!clippingEnabled">
+              [disabled]="!clippingEnabled()">
         270°
       </button>
     </div>

firebird-ng/src/app/components/object-clipping/geometry-clipping.component.scss renamed to firebird-ng/src/app/components/geometry-clipping/geometry-clipping.component.scss

@@ -28,7 +28,7 @@ import {FormsModule} from "@angular/forms";
 
 
 @Component({
-  selector: 'app-custom-object-clipping',
+  selector: 'app-geometry-clipping',
   templateUrl: './geometry-clipping.component.html',
   styleUrls: ['./geometry-clipping.component.scss'],
   imports: [

firebird-ng/src/app/components/object-clipping/geometry-clipping.component.test.ts renamed to firebird-ng/src/app/components/geometry-clipping/geometry-clipping.component.test.ts

@@ -24,7 +24,7 @@
     <app-custom-event-selector></app-custom-event-selector>
 
     <!-- Toggle for clipping geometries -->
-    <app-custom-object-clipping></app-custom-object-clipping>
+    <app-geometry-clipping></app-geometry-clipping>
 
     <app-object-raycast></app-object-raycast>
 

firebird-ng/src/app/components/object-clipping/geometry-clipping.component.ts renamed to firebird-ng/src/app/components/geometry-clipping/geometry-clipping.component.ts

@@ -14,7 +14,7 @@ import {SceneTreeComponent} from '../../components/scene-tree/scene-tree.compone
 import {ShellComponent} from '../../components/shell/shell.component';
 import {ToolPanelComponent} from '../../components/tool-panel/tool-panel.component';
 import {EventSelectorComponent} from '../../components/event-selector/event-selector.component';
-import {GeometryClippingComponent} from '../../components/object-clipping/geometry-clipping.component';
+import {GeometryClippingComponent} from '../../components/geometry-clipping/geometry-clipping.component';
 import {PhoenixThreeFacade} from "../../utils/phoenix-three-facade";
 
 import {MatSnackBar} from '@angular/material/snack-bar';
@@ -127,15 +127,15 @@ export class MainDisplayComponent implements OnInit, AfterViewInit, OnDestroy {
     private controller: GameControllerService,
     private snackBar: MatSnackBar,
     public  eventDisplay: EventDisplayService,
-    private userConfig: ConfigService,
+    private config: ConfigService,
     private serverConfig: ServerConfigService,
   ) {
-    userConfig.addConfig(this.geometryUrl);
-    userConfig.addConfig(this.geometryFastAndUgly);
-    userConfig.addConfig(this.geometryCutListName);
-    userConfig.addConfig(this.dexJsonEventSource);
-    userConfig.addConfig(this.rootEventSource);
-    userConfig.addConfig(this.rootEventRange);
+    config.addConfig(this.geometryUrl);
+    config.addConfig(this.geometryFastAndUgly);
+    config.addConfig(this.geometryCutListName);
+    config.addConfig(this.dexJsonEventSource);
+    config.addConfig(this.rootEventSource);
+    config.addConfig(this.rootEventRange);
   }
 
 
@@ -355,7 +355,7 @@ export class MainDisplayComponent implements OnInit, AfterViewInit, OnDestroy {
     // We set loadingDex=false to be safe
     this.loadingDex.set(false);
 
-    let dexUrl = this.userConfig.getConfig<string>('events.dexEventsSource')?.value;
+    let dexUrl = this.config.getConfig<string>('events.dexEventsSource')?.value;
 
     if (!dexUrl || dexUrl.trim().length === 0) {
       console.log("[main-display]: No event data source specified. Skip loadDexData.");
@@ -383,13 +383,13 @@ export class MainDisplayComponent implements OnInit, AfterViewInit, OnDestroy {
 
   private initRootData() {
     let url = (
-      this.userConfig.getConfig<string>('events.rootEventSource')
-      ?? this.userConfig.createConfig('events.rootEventSource', '')
+      this.config.getConfig<string>('events.rootEventSource')
+      ?? this.config.createConfig('events.rootEventSource', '')
     ).subject.getValue();
 
     let eventRange = (
-      this.userConfig.getConfig<string>('events.rootEventRange')
-      ?? this.userConfig.createConfig('events.rootEventRange', '')
+      this.config.getConfig<string>('events.rootEventRange')
+      ?? this.config.createConfig('events.rootEventRange', '')
     ).subject.getValue();
 
 
@@ -429,10 +429,7 @@ export class MainDisplayComponent implements OnInit, AfterViewInit, OnDestroy {
 
 
   private initGeometry() {
-    const url = (
-      this.userConfig.getConfig<string>('geometry.selectedGeometry')
-      ?? this.userConfig.createConfig('geometry.selectedGeometry', '')
-    ).value;
+    const url = (this.config.getConfigOrCreate<string>('geometry.selectedGeometry', '')).value;
 
     if (!url || url.trim().length === 0) {
       console.log("[main-display]: No geometry specified. Skip loadGeometry ");