Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 | 61x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 9x 20x 20x 12x 11x 11x 1x 1x 12x 1x 12x 8x 8x 9x 81x 80x 80x 800x 100x 100x 1x 800x 800x 80x 72x 11x 27x 27x 27x 22x 27x 27x | import { Component, EventEmitter, OnInit, Input, Output } from '@angular/core';
import { TwinpadApiService } from '../../services/twinpad-api.service';
import { ListResponse } from '../../models/response';
import { Signal } from '../../models/signals';
import { MultiSelectModule } from 'primeng/multiselect';
import { FormsModule } from '@angular/forms';
import { Router, ActivatedRoute, Params } from '@angular/router';
@Component({
selector: 'app-multi-select-signals',
imports: [MultiSelectModule, FormsModule],
templateUrl: './multi-select-signals.component.html',
styleUrl: './multi-select-signals.component.scss'
})
export class MultiSelectSignalsComponent implements OnInit {
@Input() graphId: string = "";
@Output() selectionChanged = new EventEmitter<string[]>();
selectedItems: string[] = [];
virtualScrollItemSize: number = 10;
totalSignals: number = 0;
isFiltering: boolean = false;
signalIds: string[];
signalsById: Map<string, Signal>;
signalIdsToPlot: string[];
loadedFromUrl: boolean = false;
querySignalId: string = "signal_id";
constructor(private twinpadApiService: TwinpadApiService, private router: Router, private route: ActivatedRoute){}
ngOnInit(): void {
this.signalIds = [];
this.signalsById = new Map();
this.querySignalId = `signal_id${this.graphId}`;
this.route.queryParams.subscribe(params => {
const signalIds = params[this.querySignalId];
if (signalIds) {
if (signalIds instanceof Array) {
this.selectedItems = signalIds;
this.signalIdsToPlot = signalIds;
}
else {
this.selectedItems = [signalIds];
this.signalIdsToPlot = [signalIds];
}
if (!this.signalIds || this.signalIds.length == 0) {
this.signalIds = this.signalIdsToPlot.map(x => x);
}
this.loadedFromUrl = true;
}
else {
this.selectedItems = [];
this.signalIdsToPlot = [];
}
});
this.loadRecursively(0, this.loadedFromUrl);
}
loadRecursively(offset: number, loadedFromUrl: boolean){
this.twinpadApiService.getSignals(this.virtualScrollItemSize, offset, null, null, null).subscribe((data: ListResponse<Signal>) => {
this.totalSignals = data.total;
for (const signal of data.items){
// This is done to not disturb the signals' order when they've been added from url query
if (loadedFromUrl) {
const index: number = this.signalIds.indexOf(signal.signal_id);
if (index > -1) {
this.signalIds.splice(index, 1);
}
}
this.signalIds.push(signal.signal_id);
this.signalsById.set(signal.signal_id, signal);
}
if(this.signalIds.length < this.totalSignals)
{
this.loadRecursively(offset + this.virtualScrollItemSize, loadedFromUrl);
}
});
}
onChangeSelection(newSelection: string[]){
this.route.queryParams.subscribe(queryParams => {
const params: Params = {};
const signal_id_string = this.querySignalId;
for (const [key, value] of Object.entries(queryParams)) {
Iif (key !== signal_id_string) {
params[key] = value;
}
}
params[signal_id_string] = newSelection;
this.router.navigate([], {
queryParams: params
});
});
}
}
|