pages/input-config/input-config.component.html

0001 <app-shell>
0002   <div centralPane class="fixed-width-page-content">
0003     <form>
0004
0005       <mat-card class="config-card">
0006         <mat-card-title>Select Geometry and Events</mat-card-title>
0007         <mat-card-content>
0008           <div class="section">
0009             <h3>Examples:</h3>
0010             <p>Select file with the geometry</p>
0011             <firebird-resource-select
0012               #premadeGeometry
0013               [options]="quickLinkTitles"
0014               label="Premade configurations"
0015               (valueChange)="onPresetChange($event)">
0016             </firebird-resource-select>
0017           </div>
0018
0019           <div class="section">
0020             <h3>Geometry</h3>
0021             <p>Select file with the geometry</p>
0022             <firebird-resource-select
0023               #geometrySelect
0024               [options]="geometryOptions"
0025               label="Geometry source">
0026             </firebird-resource-select>
0027           </div>
0028
0029           <div class="section">
0030             <h3>Event Source: JSON</h3>
0031             <firebird-resource-select
0032               #dexJsonSelect
0033               [options]="trajectoryOptions"
0034               label="Load events from JSON files. Such files can be generated with 'pyrobird convert', merge or other tools">
0035             </firebird-resource-select>
0036           </div>
0037
0038           <div class="section">
0039             <h3>EDM4EIC Event Source:</h3>
0040             <p>Select file with EDM4EIC data</p>
0041             <firebird-resource-select
0042               #edm4eicSelect
0043               [options]="edm4eicOptions"
0044               label="Load EDM4EIC .root Edm4Eic (this operation requires backend to be running)">
0045             </firebird-resource-select>
0046             <p>Event range to load (e.g. "0", "0,1,2", "0-5").
0047               It is recommended to load 1-10 events at a time. Not more!
0048             </p>
0049             <mat-form-field appearance="fill" class="full-width">
0050               <input matInput type="text" placeholder="0-5" [formControl]="rootEventRange">
0051             </mat-form-field>
0052           </div>
0053         </mat-card-content>
0054
0055         <div class="action-buttons">
0056           <button type="button" mat-raised-button [routerLink]="['/display']">DISPLAY</button>
0057         </div>
0058
0059       </mat-card>
0060
0061
0062
0063
0064       <mat-card class="config-card">
0065       <mat-card-title>Configure Geometry Pipeline</mat-card-title>
0066       <mat-card-content>
0067         <img src="assets/diagrams/geometry-pipeline.svg" alt="Geometry Pipeline" style="width:100%;"/>
0068
0069         <!-- ROOT Geometry Optimization -->
0070         <div class="subsection">
0071           <h3>ROOT Geometry Optimization</h3>
0072           <div class="section">
0073             <h4>Leave only central detector</h4>
0074             <p>(Remove Beamline, Far Forward and Backward)</p>
0075             <mat-slide-toggle [formControl]="onlyCentralDetector">Enabled</mat-slide-toggle>
0076           </div>
0077           <div class="section">
0078             <h4>Optimize detectors</h4>
0079             <p>(Remove parts such as glue, pixels, some layers, etc)</p>
0080             <mat-slide-toggle checked disabled>Enabled</mat-slide-toggle>
0081           </div>
0082         </div>
0083
0084         <!-- Geometry Config -->
0085         <div class="subsection">
0086           <h3>Geometry Config</h3>
0087           <div class="section">
0088             Config selector placeholder
0089           </div>
0090         </div>
0091
0092         <!-- WebGL Geometry Optimization -->
0093         <div class="subsection">
0094           <h3>WebGL Geometry Optimization</h3>
0095           <div class="section">
0096             <h4>Merge geometries if possible</h4>
0097             <p>
0098               Merging geometries significantly improves performance by reducing the number of
0099               <a href="https://discourse.threejs.org/t/webgl-drawcalls/24476" target="_blank">drawcalls</a>.
0100             </p>
0101             <mat-slide-toggle checked disabled>Enabled</mat-slide-toggle>
0102           </div>
0103         </div>
0104       </mat-card-content>
0105     </mat-card>
0106
0107       <mat-card class="config-card">
0108         <mat-card-title>Server API Configuration</mat-card-title>
0109         <mat-card-content>
0110           <mat-slide-toggle [formControl]="serverUseApi">Use specific backend</mat-slide-toggle>
0111           <div class="api-url">
0112             <mat-form-field appearance="fill" class="full-width">
0113               <mat-label>Base API URL</mat-label>
0114               <input matInput type="text" placeholder="Enter API URL: http://localhost:5454"
0115                      [formControl]="serverApiUrl" [disabled]="!serverUseApi.value">
0116             </mat-form-field>
0117           </div>
0118         </mat-card-content>
0119       </mat-card>
0120
0121       <mat-accordion class="details-accordion">
0122         <mat-expansion-panel>
0123           <mat-expansion-panel-header>
0124             <mat-panel-title>
0125               Backend Details
0126             </mat-panel-title>
0127           </mat-expansion-panel-header>
0128           <table class="details-table">
0129             <thead>
0130             <tr>
0131               <th>Property</th>
0132               <th>Value</th>
0133             </tr>
0134             </thead>
0135             <tbody>
0136             <tr>
0137               <td>Served by Pyrobird</td>
0138               <td>{{ firebirdConfig.servedByPyrobird ? 'Yes' : 'No' }}</td>
0139             </tr>
0140             <tr>
0141               <td>API Available</td>
0142               <td>{{ firebirdConfig.apiAvailable ? 'Yes' : 'No' }}</td>
0143             </tr>
0144             <tr>
0145               <td>API Base URL</td>
0146               <td>{{ firebirdConfig.apiBaseUrl }}</td>
0147             </tr>
0148             <tr>
0149               <td>Log Level</td>
0150               <td>{{ firebirdConfig.logLevel }}</td>
0151             </tr>
0152             </tbody>
0153           </table>
0154         </mat-expansion-panel>
0155       </mat-accordion>
0156
0157     </form>
0158   </div>
0159 </app-shell>