Import des sources angular à partir de 'headup_app'
This commit is contained in:
Rampeur
@@ -0,0 +1,257 @@
|
||||
<div @flyInOut>
|
||||
<div class="d-flex">
|
||||
<div class="flex-fill">
|
||||
<h1 class="mb-1">{{title}}</h1>
|
||||
<span class="me-2 fs-6"><span class="fs-5 mx-1">DT48</span> - 08 février 2024</span>
|
||||
</div>
|
||||
<span class="flex-spacer"></span>
|
||||
<div class="align-self-center me-2">
|
||||
<button mat-icon-button [matMenuTriggerFor]="menuCalculator" aria-label="Menu Calculator">
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
</button>
|
||||
<mat-menu #menuCalculator="matMenu">
|
||||
@for (menuitem of menuItems.getMenuCalculator(); track menuitem) {
|
||||
@if (menuitem.type === 'link') {
|
||||
<button mat-menu-item [routerLink]="['/', menuitem.state]">
|
||||
<mat-icon [fontIcon]="menuitem.icon"></mat-icon>
|
||||
<span>{{ menuitem.name }}</span>
|
||||
</button>
|
||||
}
|
||||
}
|
||||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider class="my-3"></mat-divider>
|
||||
<mat-card class="calculator">
|
||||
<mat-card-header class="bg-warn rounded-top pt-1 pb-2 px-2">
|
||||
<form #searchFormData="ngForm" class="inputs-form">
|
||||
<mat-form-field class="bg-crystal me-3" subscriptSizing="dynamic" color="accent">
|
||||
<mat-label>Nombre de sauts</mat-label>
|
||||
<input matInput [(ngModel)]="inputs.jumps" (change)="refresh()" type="number" min="0" max="2000"
|
||||
step="1" name="jumps">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="bg-crystal me-3" subscriptSizing="dynamic" color="accent">
|
||||
<mat-label>Poids nu</mat-label>
|
||||
<input matInput [(ngModel)]="inputs.weight" (change)="refresh()" type="number" min="30"
|
||||
max="110" name="weight">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="bg-crystal me-3" subscriptSizing="dynamic" color="accent">
|
||||
<mat-label>Poids équipement</mat-label>
|
||||
<input matInput [(ngModel)]="inputs.gear" (change)="refresh()" type="number" min="0"
|
||||
name="gear">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="bg-crystal me-3" subscriptSizing="dynamic" color="accent">
|
||||
<mat-label>Taille actuelle</mat-label>
|
||||
<input matInput [(ngModel)]="inputs.current" (change)="refresh()" type="number" min="0"
|
||||
name="current" id="current" placeholder="Taille actuelle">
|
||||
</mat-form-field>
|
||||
</form>
|
||||
<span class="flex-spacer"></span>
|
||||
<div class="flex-fill"></div>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="my-4">
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-8 col-sm-12">
|
||||
<table class="table table-striped table-dark table-hover mat-elevation-z2">
|
||||
<thead>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4"></th>
|
||||
<th class="text-nowrap">Taille actuelle</th>
|
||||
<th class="text-nowrap">Taille min</th>
|
||||
<th class="text-nowrap">Taille min -11%</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Taille de voile en ft<sup>2</sup></th>
|
||||
<td class="font-monospace text-{{ info.state.color }}"> ●
|
||||
{{ info.sizesFeet.current }} </td>
|
||||
<td class="font-monospace text-success"> ● {{ info.sizesFeet.min }} </td>
|
||||
<td class="font-monospace text-warning"> ● {{ info.sizesFeet.min11 }} </td>
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Charge alaire</th>
|
||||
<td class="font-monospace">{{ info.charges.current | number : '1.2-3' }}</td>
|
||||
<td class="font-monospace">{{ info.charges.min | number : '1.2-3' }}</td>
|
||||
<td class="font-monospace">{{ info.charges.min11 | number : '1.2-3' }}</td>
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Taille de voile en m<sup>2</sup></th>
|
||||
<td class="font-monospace">{{ info.sizesMeter.current | number : '1.2-3' }}</td>
|
||||
<td class="font-monospace">{{ info.sizesMeter.min | number : '1.2-3' }}</td>
|
||||
<td class="font-monospace">{{ info.sizesMeter.min11 | number : '1.2-3' }}</td>
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Coefficient kilo/livres</th>
|
||||
<td colspan="3" class="font-monospace text-start">{{ coeffKgLbs }}</td>
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Coefficient pied/mètre</th>
|
||||
<td colspan="3" class="font-monospace text-start">{{ coeffFtM }}</td>
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Formule charge alaire</th>
|
||||
<td colspan="3" class="font-monospace text-start">
|
||||
( ( {{ inputs.weight }} + {{ inputs.gear }} ) * {{ coeffKgLbs }} ) /
|
||||
{{ inputs.current }} = {{ info.charges.current | number : '1.5' }}<br />
|
||||
( ( poids nu en kg + poids equipement en kg ) * coefficient kg/lbs ) / taille de
|
||||
voile en ft<sup>2</sup>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-8 col-sm-12">
|
||||
@if (displayCharts) {
|
||||
<div class="linechart position-relative w-100 mt-3">
|
||||
<canvas baseChart class="mx-auto" width="800" height="280"
|
||||
[data]="chartConfig.lineChartData" [options]="chartConfig.lineChartOptions"
|
||||
[legend]="chartConfig.lineChartLegend" [type]="'line'">
|
||||
</canvas>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider class="my-3"></mat-divider>
|
||||
<h4 class="py-2 mb-0">Tailles de voile pour {{ inputs.weight }} kg</h4>
|
||||
<div>
|
||||
Prochain changement de valeurs dans {{ ((this.currentRange.end + 1) - inputs.jumps) }}
|
||||
{{ ((this.currentRange.end + 1) - inputs.jumps) > 1 ? 'sauts' : 'saut'}}<br />
|
||||
</div>
|
||||
<div class="text-end">
|
||||
{{ ((((inputs.jumps - this.currentRange.start) + 1) / ((this.currentRange.end - this.currentRange.start) + 1)) * 100) | number : '1.2-2' }}%
|
||||
de la tranche actuelle ({{this.currentRange.start}} à {{this.currentRange.end}})
|
||||
</div>
|
||||
<mat-progress-bar mode="determinate"
|
||||
[value]="((((inputs.jumps - this.currentRange.start) + 1) / ((this.currentRange.end - this.currentRange.start) + 1)) * 100)"
|
||||
color="warn"></mat-progress-bar>
|
||||
<table class="table table-striped table-dark table-hover mat-elevation-z2 mb-1">
|
||||
<thead>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4"></th>
|
||||
@for (header of sizesHeader; track header; let index = $index) {
|
||||
<th class="pl-3 pr-3 {{ tableHeader[(index+1)].active }}">{{ header.name }}</th>
|
||||
}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="warn">
|
||||
<th class="firtext-nowrap pe-4st">Taille de voile en ft<sup>2</sup></th>
|
||||
@for (value of sizesValuesFeet; track value; let index = $index) {
|
||||
<td class="pl-3 text-nowrap {{ tableHeader[(index+1)].active }}">{{ value }}</td>
|
||||
}
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Abbattement 11%</th>
|
||||
@for (value of sizesMinValuesFeet; track value; let index = $index) {
|
||||
<td class="pl-3 text-nowrap {{ tableHeader[(index+1)].active }}">{{ value }}</td>
|
||||
}
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Charge alaire</th>
|
||||
@for (charge of sizesCharges; track charge; let index = $index) {
|
||||
<td class="pl-3 text-nowrap {{ tableHeader[(index+1)].active }}">
|
||||
{{ charge | number : '1.2-3' }}</td>
|
||||
}
|
||||
</tr>
|
||||
<tr class="warn">
|
||||
<th class="text-nowrap pe-4">Taille de voile en m<sup>2</sup></th>
|
||||
@for (value of sizesValuesMeter; track value; let index = $index) {
|
||||
<td class="pl-3 text-nowrap {{ tableHeader[(index+1)].active }}">
|
||||
{{ value | number : '1.2-2' }}</td>
|
||||
}
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<mat-divider class="my-3"></mat-divider>
|
||||
<h4 class="py-2 mb-0">Tableau des tailles de voile par poids</h4>
|
||||
<div class="text-end">
|
||||
{{ ((inputs.jumps / 1600) * 100) | number : '1.2-2' }}% de la plage complète (0 à 1600)
|
||||
</div>
|
||||
<mat-progress-bar mode="determinate" [value]="((inputs.jumps / 1600) * 100)" color="warn">
|
||||
</mat-progress-bar>
|
||||
<table mat-table [dataSource]="canopy_size_table" matSort
|
||||
class="table table-striped table-dark table-hover mat-elevation-z2">
|
||||
<!-- weight column -->
|
||||
<ng-container matColumnDef="weight">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header class="text-nowrap pe-4 {{tableHeader[0].active}}">
|
||||
{{tableHeader[0].name}} </th>
|
||||
<th mat-cell *matCellDef="let element;" class="text-end ps-3 pe-4 fs-6" role="button"
|
||||
(click)="setCurrentWeight(element.weight)">
|
||||
<span class="text-warn d-block">{{element.weight}}</span>
|
||||
</th>
|
||||
</ng-container>
|
||||
<!-- range_1 column -->
|
||||
<ng-container matColumnDef="range_1">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[1].active}}">
|
||||
{{tableHeader[1].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[0].active}}">{{element.ranges[0].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_2 column -->
|
||||
<ng-container matColumnDef="range_2">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[2].active}}">
|
||||
{{tableHeader[2].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[1].active}}">{{element.ranges[1].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_3 column -->
|
||||
<ng-container matColumnDef="range_3">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[3].active}}">
|
||||
{{tableHeader[3].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[2].active}}">{{element.ranges[2].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_4 column -->
|
||||
<ng-container matColumnDef="range_4">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[4].active}}">
|
||||
{{tableHeader[4].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[3].active}}">{{element.ranges[3].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_5 column -->
|
||||
<ng-container matColumnDef="range_5">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[5].active}}">
|
||||
{{tableHeader[5].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[4].active}}">{{element.ranges[4].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_6 column -->
|
||||
<ng-container matColumnDef="range_6">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[6].active}}">
|
||||
{{tableHeader[6].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[5].active}}">{{element.ranges[5].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_7 column -->
|
||||
<ng-container matColumnDef="range_7">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[7].active}}">
|
||||
{{tableHeader[7].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[6].active}}">{{element.ranges[6].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_8 column -->
|
||||
<ng-container matColumnDef="range_8">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[8].active}}">
|
||||
{{tableHeader[8].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[7].active}}">{{element.ranges[7].value}}</td>
|
||||
</ng-container>
|
||||
<!-- range_9 column -->
|
||||
<ng-container matColumnDef="range_9">
|
||||
<th class="pl-3" mat-header-cell *matHeaderCellDef class="{{tableHeader[9].active}}">
|
||||
{{tableHeader[9].name}} </th>
|
||||
<td mat-cell *matCellDef="let element;"
|
||||
class="pl-3 text-nowrap fs-6 {{element.ranges[8].active}}">{{element.ranges[8].value}}</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: false" class="warn"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"
|
||||
class="text-middle font-monospace warn {{row.active}}" id="weight_{{row.weight}}"></tr>
|
||||
</table>
|
||||
<div class="clearfix">
|
||||
<mat-paginator [pageSize]="50" [pageSizeOptions]="[5, 10, 15, 25, 50]" showFirstLastButtons
|
||||
class="pull-right mb-1 mt-2"></mat-paginator>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
@@ -0,0 +1,33 @@
|
||||
.calculator-page {
|
||||
section {
|
||||
display: table;
|
||||
}
|
||||
.demo-label {
|
||||
display: table-cell;
|
||||
font-size: 14px;
|
||||
margin-left: 8px;
|
||||
min-width: 120px;
|
||||
}
|
||||
.demo-button-row {
|
||||
display: table-cell;
|
||||
max-width: 900px;
|
||||
}
|
||||
.demo-button-row .mat-mdc-button-base {
|
||||
margin: 8px 8px 8px 0;
|
||||
}
|
||||
.demo-flex-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.demo-button-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 120px;
|
||||
}
|
||||
th {
|
||||
&.first {
|
||||
width: 180px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CalculatorComponent } from './calculator.component';
|
||||
|
||||
describe('CalculatorComponent', () => {
|
||||
let component: CalculatorComponent;
|
||||
let fixture: ComponentFixture<CalculatorComponent>;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({
|
||||
imports: [CalculatorComponent]
|
||||
});
|
||||
fixture = TestBed.createComponent(CalculatorComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,222 @@
|
||||
import { Component, Input, OnInit, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { trigger, state, style, animate, transition } from '@angular/animations';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatCardModule } from '@angular/material/card';
|
||||
import { MatDividerModule } from '@angular/material/divider';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatMenuModule } from '@angular/material/menu';
|
||||
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
|
||||
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
||||
import { MatSort, MatSortModule } from '@angular/material/sort';
|
||||
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
|
||||
import { BaseChartDirective } from 'ng2-charts';
|
||||
import { Observable, Subscription } from 'rxjs';
|
||||
|
||||
import { MenuItems } from 'src/app/components/shared';
|
||||
import { CalculatorInfo, CalculatorResult, CalculatorState, InputParams, Jump, LineConfig, WeightSizeRange, TableHeader, User, WeightSize, weightSizes } from 'src/app/core/models';
|
||||
import { CalculatorService, JumpsService, UserService, UtilitiesService } from 'src/app/core/services';
|
||||
|
||||
@Component({
|
||||
selector: 'app-calculator',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule, FormsModule, RouterModule,
|
||||
MatButtonModule, MatCardModule, MatDividerModule,
|
||||
MatFormFieldModule, MatInputModule, MatIconModule, MatMenuModule,
|
||||
MatPaginatorModule, MatProgressBarModule, MatSortModule, MatTableModule,
|
||||
BaseChartDirective
|
||||
],
|
||||
templateUrl: './calculator.component.html',
|
||||
styleUrl: './calculator.component.scss',
|
||||
animations: [
|
||||
trigger('flyInOut', [
|
||||
state('in', style({ transform: 'translateY(0)' })),
|
||||
transition('void => *', [
|
||||
style({ transform: 'translateY(-100%)' }),
|
||||
animate(200)
|
||||
]),
|
||||
transition('* => void', [
|
||||
style({ transform: 'translateY(100%)' }),
|
||||
animate(200)
|
||||
])
|
||||
])
|
||||
]
|
||||
})
|
||||
export class CalculatorComponent implements OnInit, OnDestroy {
|
||||
//private _lastjump!: Subscription; // = new Subscription();
|
||||
//private _currentUser!: Subscription; // = new Subscription();
|
||||
private _subscriptions: Array<Subscription> = [];
|
||||
public title = 'Calcul de taille de voile';
|
||||
public subtitle = 'DT48 - 08 février 2024';
|
||||
public lastjump: Jump = {} as Jump;
|
||||
public currentRange: WeightSizeRange = {} as WeightSizeRange;
|
||||
public currentUser: User = {} as User;
|
||||
public displayedColumns: Array<string> = ['weight'];
|
||||
public tableHeader: Array<TableHeader> = [<TableHeader>{name: 'Poids nu en kg', active: ''}];
|
||||
public sizesHeader: Array<TableHeader> = [];
|
||||
public sizesValuesFeet: Array<number> = [];
|
||||
public sizesMinValuesFeet: Array<number> = [];
|
||||
public sizesCharges: Array<number> = [];
|
||||
public sizesValuesMeter: Array<number> = [];
|
||||
public displayCharts = false;
|
||||
public chartConfig: LineConfig = this._utilitiesService.getLineChartConfig();
|
||||
public coeffKgLbs: number = this._utilitiesService.getCoeffKgLbs();
|
||||
public coeffFtM: number = this._utilitiesService.getCoeffFtM();
|
||||
public info: CalculatorInfo = {
|
||||
charges: <CalculatorResult>{ current: 0, min: 0, min11: 0 },
|
||||
sizesFeet: <CalculatorResult>{ current: 0, min: 0, min11: 0 },
|
||||
sizesMeter: <CalculatorResult>{ current: 0, min: 0, min11: 0 },
|
||||
state: <CalculatorState>{ color: 'danger' }
|
||||
}
|
||||
|
||||
@Input() canopy_size_table!: MatTableDataSource<WeightSize>;
|
||||
@Input() inputs: InputParams = <InputParams>{
|
||||
jumps: 0,
|
||||
weight: 60,
|
||||
gear: 10,
|
||||
current: 190
|
||||
} as InputParams;
|
||||
|
||||
@ViewChild(MatSort) sort!: MatSort;
|
||||
@ViewChild(MatPaginator) paginator!: MatPaginator;
|
||||
|
||||
constructor(
|
||||
private _calculatorService: CalculatorService,
|
||||
private _jumpsService: JumpsService,
|
||||
private _userService: UserService,
|
||||
private _utilitiesService: UtilitiesService,
|
||||
public menuItems: MenuItems
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
const currentUser$: Observable<User> = this._userService.currentUser;
|
||||
const lastjump$: Observable<Jump> = this._jumpsService.getLastJump();
|
||||
|
||||
weightSizes[0].ranges.forEach((range: WeightSizeRange) => {
|
||||
const header: TableHeader = {name: range.label, active: range.active};
|
||||
this.tableHeader.push(header)
|
||||
this.sizesHeader.push(header);
|
||||
this.displayedColumns.push(range.name);
|
||||
});
|
||||
this.chartConfig.lineChartData.labels = [...this.sizesHeader.map(
|
||||
(data: TableHeader): string => data.name
|
||||
)];
|
||||
this.chartConfig.lineChartData.datasets = [
|
||||
{
|
||||
label: 'Tailles min -11%',
|
||||
data: this.sizesMinValuesFeet,
|
||||
fill: true,
|
||||
stepped: true,
|
||||
pointStyle: false,
|
||||
borderColor: 'rgba(241, 80, 80, 1)',
|
||||
backgroundColor: 'rgba(241, 80, 80, 0.3)'
|
||||
},
|
||||
{
|
||||
label: 'Tailles min',
|
||||
data: this.sizesValuesFeet,
|
||||
fill: true,
|
||||
stepped: true,
|
||||
pointStyle: false,
|
||||
borderColor: 'rgba(32, 182, 252, 1)',
|
||||
backgroundColor: 'rgba(32, 182, 252, 0.3)'
|
||||
}
|
||||
];
|
||||
this._subscriptions.push(
|
||||
currentUser$.subscribe((userData: User) => {
|
||||
this.currentUser = userData;
|
||||
this._subscriptions.push(
|
||||
lastjump$.subscribe((jump) => {
|
||||
this.lastjump = jump;
|
||||
this.inputs.jumps = jump.numero;
|
||||
this.inputs.weight = this.currentUser.poids!;
|
||||
this.inputs.current = jump.taille!;
|
||||
this.canopy_size_table = new MatTableDataSource<WeightSize>(weightSizes);
|
||||
this.refresh();
|
||||
})
|
||||
);
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this._subscriptions.forEach((sub: Subscription) => {
|
||||
sub.unsubscribe();
|
||||
});
|
||||
}
|
||||
|
||||
public refresh():void {
|
||||
this._refreshActive();
|
||||
this._refreshSizes();
|
||||
}
|
||||
|
||||
private _refreshActive(): void {
|
||||
let weight: number = this.inputs.weight;
|
||||
if (this.inputs.weight < 60) {
|
||||
weight = 60;
|
||||
}
|
||||
weightSizes.forEach(element => {
|
||||
element.active = '';
|
||||
element.ranges.forEach(range => {
|
||||
range.active = '';
|
||||
});
|
||||
});
|
||||
this.tableHeader.forEach(element => {
|
||||
element.active = '';
|
||||
});
|
||||
if (weight >= 60 && weight <= 110) {
|
||||
weightSizes[(weight - 60)].active = 'active';
|
||||
}
|
||||
if (this.inputs.jumps >= 0) {
|
||||
const num = this._calculatorService.getRangeNum(this.inputs.jumps);
|
||||
this.tableHeader[num].active = 'active';
|
||||
weightSizes.forEach(element => {
|
||||
element.ranges[(num-1)].active = 'active';
|
||||
});
|
||||
this.currentRange = weightSizes[0].ranges[(num-1)];
|
||||
}
|
||||
}
|
||||
|
||||
private _refreshSizes(): void {
|
||||
let weight: number = this.inputs.weight;
|
||||
if (this.inputs.weight < 60) {
|
||||
weight = 60;
|
||||
}
|
||||
if (this.inputs.jumps > 2000) {
|
||||
this.info.state.error = '2K+ Jumps';
|
||||
}
|
||||
this.sizesValuesFeet = this._calculatorService.getCanopySizes(weight);
|
||||
this.sizesMinValuesFeet = this._calculatorService.getCanopySizes(weight, true);
|
||||
this.sizesValuesMeter = this.sizesValuesFeet.map((value: number, index: number) => {
|
||||
this.sizesCharges[index] = this._calculatorService.getCharge(value, this.inputs.weight, this.inputs.gear);
|
||||
return this._calculatorService.convertFeet2Meters(value);
|
||||
});
|
||||
this.info.sizesFeet = this._calculatorService.canopySizeCalc(weight, this.inputs.jumps);
|
||||
this.info.sizesFeet.current = this.inputs.current;
|
||||
this.info.sizesMeter = {
|
||||
current: this._calculatorService.convertFeet2Meters(this.inputs.current),
|
||||
min: this._calculatorService.convertFeet2Meters(this.info.sizesFeet.min),
|
||||
min11: this._calculatorService.convertFeet2Meters(this.info.sizesFeet.min11)
|
||||
}
|
||||
this.info.charges = {
|
||||
current: this._calculatorService.getCharge(this.inputs.current, this.inputs.weight, this.inputs.gear),
|
||||
min: this._calculatorService.getCharge(this.info.sizesFeet.min, this.inputs.weight, this.inputs.gear),
|
||||
min11: this._calculatorService.getCharge(this.info.sizesFeet.min11, this.inputs.weight, this.inputs.gear)
|
||||
}
|
||||
this.info.state.color = this._calculatorService.getStateColor(this.info.sizesFeet);
|
||||
|
||||
this.chartConfig.lineChartData.datasets[0].data = this.sizesMinValuesFeet;
|
||||
this.chartConfig.lineChartData.datasets[1].data = this.sizesValuesFeet;
|
||||
this.displayCharts = true;
|
||||
}
|
||||
|
||||
public setCurrentWeight(weight: number) {
|
||||
this.inputs.weight = weight;
|
||||
this.refresh();
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user