All files / src/app/components/signals-graphs signals-graphs.component.html

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
100
101
102
1204x
 
 
2408x
 
8x
2408x
2408x
 
270x
 
 
4x
 
133x
 
4x
4x
 
 
8x
266x
137x
4x
 
 
 
4x
 
 
4x
8x
 
2408x
14x
2142x
1078x
 
 
 
7x
7x
 
2408x
 
 
16x
2408x
1212x
 
 
 
 
8x
8x
 
 
2408x
8x
8x
 
8x
 
2408x
 
 
 
 
 
8x
2408x
 
 
 
2408x
8x
 
8x
16x
2408x
1212x
 
1204x
 
 
8x
 
 
 
 
 
8x
 
1204x
12x
8x
1204x
 
 
 
8x
 
<app-loader *ngIf="isLoading"></app-loader>
 
 
<div *ngIf="!isLoading">
 
    <div class="toolbar">
        <app-multi-select-signals *ngIf="showSignals" (selectionChanged)="applyInputs()"></app-multi-select-signals>
        <div class="toolbar-element" *ngIf="!isLive">
            <p-floatLabel >
                <p-datepicker [(ngModel)]="zoomTime" inputId="zoomTime"
                    [minDate]="dataDateMin"
                    [maxDate]="dataDateMax"
                    (onSelect)="onDateChange()"
                    [showButtonBar]="true"
                    [showTime]="true"
                    />
                <label for="zoomTime">Window middle</label>
            </p-floatLabel>
 
            <p-floatLabel>
                <p-select
                    [options]="replayWindowLengths"
                    [(ngModel)]="replayWindowLength"
                    (onChange)="onDateChange()"
                    placeholder="Refresh time"
                    optionLabel="label"
                    inputId="refreshTime" />
                <label for="refreshTime">Window length</label>
            </p-floatLabel>
 
        </div>
        <div class="toolbar-element">
 
            <p-floatLabel *ngIf="isLive">
                <p-select
                    [options]="windowLengths"
                    [(ngModel)]="windowLength"
                    placeholder="Window Time l  ength"
                    optionLabel="label"
                    inputId="windowTime" />
                <label for="windowTime">windowTime</label>
            </p-floatLabel>
 
            <p-splitbutton icon="pi pi-download" [model]="exports" severity="secondary" />
 
            <p-floatLabel>
                <p-select
                    [options]="displayModes"
                    [(ngModel)]="isLive"
                    optionValue="isLive"
                    placeholder="Refresh time"
                    optionLabel="label"
                    inputId="displayMode" />
                <label for="displayMode">Display mode</label>
            </p-floatLabel>
 
 
            <button *ngIf="dataRefresh" class="button" (click)="toggleDataRefresh()">
                <span class="icon is-small">
                    <i class="pi pi-refresh"></i>
                </span>
            </button>
 
            <button *ngIf="!dataRefresh" class="button" (click)="toggleDataRefresh()">
                <span class="icon is-small">
                    <i class="pi pi pi-ban"></i>
                </span>
            </button>
 
            <p-floatLabel>
                <span *ngIf="isResponseSlowerThanRefresh" class="refresh-too-fast">
                    <i class="pi pi-exclamation-circle"
                        title="Graph can't keep up!&#013;Try using a slower refresh rate or less signals."></i>
                </span>
                <span *ngIf="!isResponseSlowerThanRefresh" class="refresh-good">
                    <i class="pi pi-check-circle"
                        title="Graph can keep up with refresh rate."></i>
                </span>
                <p-select
                    [options]="refreshTimes"
                    [(ngModel)]="refreshTime"
                    placeholder="Refresh time"
                    [disabled]="!dataRefresh"
                    optionLabel="label"
                    inputId="refreshTime" />
                <label for="refreshTime">Refresh time</label>
            </p-floatLabel>
 
 
 
        </div>
    </div>
 
    <app-signals-graph [signalIdsToPlot]="inputSignalIdsToPlot" [isLive]="isLive" [refreshTime]="refreshTime.duration" [showLegend]="showLegend" [liveWindow]="windowLength.duration"
    (dataDateMin)="handleDataDateMin($event)" (dataDateMax)="handleDataDateMax($event)" (windowMiddleDate)="handleWindowMiddleDate($event)"
    (isResponseSlowerThanRefresh)="handleResponseSlowerThanRefresh($event)"
    [requestedWindowMinTs]="windowMinTs" [requestedWindowMaxTs]="windowMaxTs"
    >
    </app-signals-graph>
 
</div>