Skip to content

Commit

Permalink
Correct work with edm4eic files from remote API
Browse files Browse the repository at this point in the history
  • Loading branch information
DraTeots committed Oct 19, 2024
1 parent f0a2410 commit e7c8342
Show file tree
Hide file tree
Showing 15 changed files with 224 additions and 39 deletions.
4 changes: 2 additions & 2 deletions firebird-ng/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions firebird-ng/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "firebird",
"version": "0.0.5",
"version": "0.1.23",
"scripts": {
"ng": "ng",
"serve": "ng serve",
Expand All @@ -11,7 +11,7 @@
"test": "ng test",
"test:headless": "ng test --browsers=ChromeHeadless --watch=false --code-coverage --progress=false"
},
"private": true,
"private": false,
"dependencies": {
"@angular/animations": "^17.3.12",
"@angular/cdk": "~17.3.10",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,25 @@
<mat-icon>{{ isNavConfigOpen ? 'close' : 'menu' }}</mat-icon>
</button>
<nav class="navbar navbar-expand-lg navbar-dark" id="main-top-navbar" *ngIf="isNavConfigOpen || !isSmallScreen">
<a class="navbar-brand" href="#"><img src="assets/firebird/firebird-simplified-circle.png" width="32" height="32" alt="App Logo"></a>
<button [matMenuTriggerFor]="menu" class="logo-button" aria-label="App Logo Button">
<img src="assets/firebird/firebird-simplified-circle.png" width="32" height="32" alt="App Logo">
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item>
<span><a href="https://github.com/eic/firebird" target="_blank">GitHub Repository</a></span>
</button>
<button mat-menu-item>
<span><a href="https://github.com/eic/firebird/issues" target="_blank">Submit ideas (or issues)</a></span>
</button>
<button mat-menu-item disabled>
<span>Firebird: {{packageVersion}}</span>
</button>
</mat-menu>


<ul class="navbar-nav">
<li class="nav-item"><a [routerLink]="['/config']" class="nav-link">Configure</a></li>
<li class="nav-item"><a [routerLink]="['/display']" class="nav-link">Display</a></li>
</ul>
</nav>
<router-outlet></router-outlet>

Original file line number Diff line number Diff line change
Expand Up @@ -16,3 +16,11 @@
top: 0;
padding-top: -3px;
}

.logo-button {
background: none;
border: none;
padding: 0;
margin: 0;
cursor: pointer;
}
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,10 @@ import {MatIcon} from "@angular/material/icon";
import {NgIf} from "@angular/common";
import {MatIconButton} from "@angular/material/button";
import {MatTooltip} from "@angular/material/tooltip";
import {MatMenu, MatMenuItem, MatMenuTrigger} from "@angular/material/menu";
import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
import packageInfo from '../../../../package.json';

@Component({
selector: 'app-nav-config',
Expand All @@ -14,14 +18,27 @@ import {MatTooltip} from "@angular/material/tooltip";
MatIcon,
NgIf,
MatIconButton,
MatTooltip
MatTooltip,
MatMenu,
MatMenuItem,
MatMenuTrigger
],
templateUrl: './nav-config.component.html',
styleUrl: './nav-config.component.scss'
})
export class NavConfigComponent {
isNavConfigOpen: boolean = false;
isSmallScreen: boolean = window.innerWidth < 992;
packageVersion: string;

constructor(private matIconRegistry: MatIconRegistry,
private domSanitizer: DomSanitizer) {
this.matIconRegistry.addSvgIcon(
'github',
this.domSanitizer.bypassSecurityTrustResourceUrl('assets/icons/github-mark-white.svg')
);
this.packageVersion = packageInfo.version;
}

@HostListener('window:resize', ['$event'])
onResize(event: any) {
Expand Down
24 changes: 5 additions & 19 deletions firebird-ng/src/app/pages/input-config/input-config.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,10 @@
<div class="container mt-3">
<h2 class="card-title">Configure geometry pipeline</h2>

<img src="../../../assets/diagrams/geometry-pipeline.svg" alt="geometry-pipeline">
<!-- Geometry Pipeline diagram -->
<img src="../assets/diagrams/geometry-pipeline.svg" alt="geometry-pipeline">

<form >
<form>

<div class="card mt-4">
<div class="card-body">
Expand Down Expand Up @@ -85,11 +86,11 @@ <h6>Merge geometries if possible</h6>
<h5 class="card-title">Server API Configuration</h5>
<div class="form-check custom-control custom-switch mt-4">
<input class="custom-control-input" type="checkbox" id="serverUseApiCheckbox" [formControl]="serverUseApi">
<label class="custom-control-label" for="serverUseApiCheckbox">Use local backend</label>
<label class="custom-control-label" for="serverUseApiCheckbox">Use specific backend</label>
</div>
<div class="form-row align-items-center">
<div class="col-auto">
<h6 class="mb-0">API URL:</h6>
<h6 class="mb-0">Base API URL:</h6>
</div>
<div class="col">
<input class="form-control" type="text" placeholder="Enter API URL: http://localhost:5454" [formControl]="serverApiUrl" [disabled]="!serverUseApi.value">
Expand All @@ -98,21 +99,6 @@ <h6 class="mb-0">API URL:</h6>
</div>
</div>


<!-- <div class="card mt-4">-->
<!-- <div class="card-body">-->
<!-- <h5 class="card-title">Rendering</h5>-->
<!-- <div class="mt-4">-->
<!-- <h6>Debug menu</h6>-->
<!-- <a href="https://discourse.threejs.org/t/webgl-drawcalls/24476">drawcalls</a> significantly improving the performance.-->
<!-- <div class="form-check custom-control custom-switch">-->
<!-- <input class="custom-control-input" type="checkbox" checked="checked" disabled>-->
<!-- <label class="custom-control-label" for="geoPostEnabled">Enabled</label>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->

<div class="mt-4 text-center">
<button type="button" class="btn btn-lg btn-primary" [routerLink]="['/display']">DISPLAY</button>
</div>
Expand Down
29 changes: 25 additions & 4 deletions firebird-ng/src/app/pages/main-display/main-display.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ import {DataModelPainter} from "../../painters/data-model-painter";
import {AppComponent} from "../../app.component";
import {ToolPanelComponent} from "../../components/tool-panel/tool-panel.component";
import {NavConfigComponent} from "../../components/nav-config/nav-config.component";
import {UrlService} from "../../services/url.service";


// import { LineMaterial } from 'three/addons/lines/LineMaterial.js';
Expand All @@ -57,7 +58,7 @@ import {NavConfigComponent} from "../../components/nav-config/nav-config.compone
@Component({
selector: 'app-test-experiment',
templateUrl: './main-display.component.html',
imports: [PhoenixUIModule, IoOptionsComponent, MatSlider, MatIcon, MatButton, MatSliderThumb, DecimalPipe, MatTooltip, MatFormField, MatSelect, MatOption, NgForOf, AngularSplitModule, SceneTreeComponent, NgClass, MatIconButton, DisplayShellComponent, AppComponent, RouterOutlet, RouterLink, ToolPanelComponent, NavConfigComponent, NgIf],
imports: [PhoenixUIModule, IoOptionsComponent, MatSlider, MatIcon, MatButton, MatSliderThumb, DecimalPipe, MatTooltip, MatFormField, MatSelect, MatOption, NgForOf, AngularSplitModule, SceneTreeComponent, NgClass, MatIconButton, DisplayShellComponent, ToolPanelComponent, NavConfigComponent, NgIf],
standalone: true,
styleUrls: ['./main-display.component.scss']
})
Expand Down Expand Up @@ -121,7 +122,9 @@ export class MainDisplayComponent implements OnInit, AfterViewInit {
private route: ActivatedRoute,
private settings: UserConfigService,
private dataService: DataModelService,
private elRef: ElementRef, private renderer2: Renderer2,
private elRef: ElementRef,
private renderer2: Renderer2,
private urlService: UrlService,
private _snackBar: MatSnackBar) {
this.threeFacade = new PhoenixThreeFacade(this.eventDisplay);
}
Expand Down Expand Up @@ -443,6 +446,7 @@ export class MainDisplayComponent implements OnInit, AfterViewInit {

ngOnInit() {
let eventSource = this.settings.trajectoryEventSource.value;
eventSource = this.urlService.resolveDownloadUrl(eventSource);
let eventConfig = {eventFile: "https://firebird-eic.org/py8_all_dis-cc_beam-5x41_minq2-100_nevt-5.evt.json.zip", eventType: "zip"};
if( eventSource != "no-events" && !eventSource.endsWith("edm4hep.json")) {
let eventType = eventSource.endsWith("zip") ? "zip" : "json";
Expand Down Expand Up @@ -641,10 +645,24 @@ export class MainDisplayComponent implements OnInit, AfterViewInit {

this.dataService.loadEdm4EicData().then(data => {
this.updateSceneTreeComponent();
console.log("loaded data model");
console.log("loadEdm4EicData data:");
console.log(data);
})
if(data == null) {
console.warn("DataService.loadEdm4EicData() Received data is null or undefined");
return;
}

if(data.entries?.length ?? 0 > 0) {
this.painter.setThreeSceneParent(openThreeManager.sceneManager.getEventData());
this.painter.setEntry(data.entries[0]);
this.painter.paint(this.currentTime);
this.updateSceneTreeComponent();
} else {
console.warn("DataService.loadEdm4EicData() Received data had no entries");
console.log(data);
}
})
//
this.dataService.loadDexData().then(data => {
this.updateSceneTreeComponent();
if(data == null) {
Expand All @@ -653,8 +671,10 @@ export class MainDisplayComponent implements OnInit, AfterViewInit {
}

if(data.entries?.length ?? 0 > 0) {
this.painter.setThreeSceneParent(openThreeManager.sceneManager.getEventData());
this.painter.setEntry(data.entries[0]);
this.painter.paint(this.currentTime);
this.updateSceneTreeComponent();
} else {
console.warn("DataService.loadDexData() Received data had no entries");
console.log(data);
Expand Down Expand Up @@ -878,6 +898,7 @@ export class MainDisplayComponent implements OnInit, AfterViewInit {
exitTimedDisplay() {
this.stopAnimation();
this.rewindTime();
this.painter.paint(null);
this.animateEventAfterLoad = false;
if(this.trackInfos) {
for (let trackInfo of this.trackInfos) {
Expand Down
119 changes: 119 additions & 0 deletions firebird-ng/src/app/painters/box-tracker-hit-simple.painter.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
import {
Object3D,
Mesh,
BoxGeometry,
MeshBasicMaterial,
Color,
} from 'three';
import { ComponentPainter } from './component-painter';
import { BoxTrackerHitComponent } from '../model/box-tracker-hit.component';
import { EntryComponent } from '../model/entry-component';

/**
* Alternative Painter class for rendering BoxTrackerHitComponent using individual Meshes.
*/
export class BoxTrackerHitSimplePainter extends ComponentPainter {
/** Array of Mesh objects representing hits */
private hitMeshes: Mesh[] = [];

private boxComponent: BoxTrackerHitComponent;

/**
* Constructs a new BoxTrackerHitAlternativePainter.
*
* @param parentNode - The Object3D node where the hit meshes will be added.
* @param component - The BoxTrackerHitComponent containing the hit data.
*/
constructor(parentNode: Object3D, component: EntryComponent) {
super(parentNode, component);

// Runtime type check
if (component.type !== BoxTrackerHitComponent.type) {
throw new Error('Invalid component type for BoxTrackerHitAlternativePainter');
}

this.boxComponent = component as BoxTrackerHitComponent;

// Create a bright random color for this component collection
const hue = Math.random();
const randomColor = new Color().setHSL(hue, 1, 0.5); // Bright color

// Create a material with the random color
const material = new MeshBasicMaterial({ color: randomColor });

// Create a mesh for each hit using the same material
this.createHitMeshes(material);
}

/**
* Creates Mesh instances for each hit and adds them to the parent node.
*
* @param material - The material to use for the hit meshes.
*/
private createHitMeshes(material: MeshBasicMaterial): void {
for (const hit of this.boxComponent.hits) {
// Create geometry for the box
const geometry = new BoxGeometry(10,10,10
// hit.dimensions[0],
// hit.dimensions[1],
// hit.dimensions[2]
);

// Create the mesh
const mesh = new Mesh(geometry, material);

// Set position
mesh.position.set(hit.position[0], hit.position[1], hit.position[2]);

// Store the hit time
mesh.userData['appearanceTime'] = hit.time[0];

// Initially make the mesh invisible
mesh.visible = false;

// Add the mesh to the parent node and to the array
this.parentNode.add(mesh);
this.hitMeshes.push(mesh);
}
}

/**
* Paint method to update the visibility of the hits based on time.
*
* @param time - The current time in nanoseconds or null for static rendering.
*/
public paint(time: number | null): void {
for (const mesh of this.hitMeshes) {
if (time !== null) {
// Show the mesh if its appearance time is less than or equal to the current time
mesh.visible = mesh.userData['appearanceTime'] <= time;
} else {
// In static mode, make all meshes visible
mesh.visible = true;
}
}
}

/**
* Dispose of resources used by the painter.
*/
override dispose(): void {
for (const mesh of this.hitMeshes) {
// Dispose of geometry and material
mesh.geometry.dispose();

// Dispose of the material only if it's not shared with other meshes
if (mesh.material instanceof MeshBasicMaterial) {
mesh.material.dispose();
}

// Remove the mesh from the parent node
this.parentNode.remove(mesh);
}

// Clear the array
this.hitMeshes = [];

super.dispose();
}
}
6 changes: 3 additions & 3 deletions firebird-ng/src/app/painters/component-painter.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ export type ComponentPainterConstructor = new (node: Object3D, component: EntryC
export abstract class ComponentPainter {

/** Constructor is public since we can instantiate directly */
constructor(protected node: Object3D, protected component: EntryComponent) {}
constructor(protected parentNode: Object3D, protected component: EntryComponent) {}

/** Gets the `type` identifier for the component this class works with */
public get componentType() {
Expand All @@ -26,8 +26,8 @@ export abstract class ComponentPainter {
/** Dispose method to clean up resources */
public dispose(): void {
// Remove node from the scene
if (this.node) {
disposeNode(this.node);
if (this.parentNode) {
disposeNode(this.parentNode);
}
}
}
Loading

0 comments on commit e7c8342

Please sign in to comment.