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

0001 <div>
0002   <h1 mat-dialog-title>Customize Cartesian Grid</h1>
0003
0004   <div class="container dialog-content" mat-dialog-content>
0005     <!-- SHIFT or set new origin: -->
0006     <div class="item-config-single">
0007       <div class="item-config-group">
0008         <label class="item-config-label" for="xPos">x (cm):</label>
0009         <input
0010           type="number"
0011           [value]="cartesianPos.x"
0012           class="form-control"
0013           id="xPos"
0014           #xPos
0015         />
0016       </div>
0017       <div class="item-config-group">
0018         <label class="item-config-label" for="yPos">y (cm):</label>
0019         <input
0020           type="number"
0021           [value]="cartesianPos.y"
0022           class="form-control"
0023           id="yPos"
0024           #yPos
0025         />
0026       </div>
0027       <div class="item-config-group">
0028         <label class="item-config-label" for="zPos">z (cm):</label>
0029         <input
0030           type="number"
0031           [value]="cartesianPos.z"
0032           class="form-control"
0033           id="zPos"
0034           #zPos
0035         />
0036       </div>
0037
0038       <button mat-stroked-button (click)="onSave(xPos.value, yPos.value, zPos.value)">
0039         Save
0040       </button>
0041
0042       <button mat-menu-item class="explain-button" (click)="shiftCartesianGridByPointer()">
0043         Shift Cartesian Grid on click
0044       </button>
0045     </div>
0046
0047     <!-- Toggles for planes, distance, etc. -->
0048     <div>
0049       <button mat-menu-item (click)="showXYPlanes(!gridConfig.showXY)">
0050         <mat-checkbox [checked]="gridConfig.showXY">
0051           Show XY Planes
0052         </mat-checkbox>
0053       </button>
0054       <button class="slider-btn" mat-menu-item>
0055         <mat-slider min="-300" [max]="scale" step="300" thumbLabel>
0056           <input
0057             matSliderThumb
0058             [value]="gridConfig.zDistance"
0059             (input)="addXYPlanes($event)"
0060           />
0061         </mat-slider>
0062         XY Plane ({{ calcPlanes(gridConfig.zDistance) }})
0063       </button>
0064
0065       <!-- Repeat for YZ, ZX, etc. -->
0066       <!-- ... -->
0067     </div>
0068   </div>
0069
0070   <div mat-dialog-actions align="end">
0071     <button mat-flat-button color="primary" (click)="onClose()">Close</button>
0072   </div>
0073 </div>