diff options
Diffstat (limited to 'client')
5 files changed, 89 insertions, 42 deletions
diff --git a/client/src/app/+admin/requests/request-stats/request-stats.component.html b/client/src/app/+admin/requests/request-stats/request-stats.component.html index 9dbed1739..ca531258c 100644 --- a/client/src/app/+admin/requests/request-stats/request-stats.component.html +++ b/client/src/app/+admin/requests/request-stats/request-stats.component.html | |||
@@ -1,33 +1,37 @@ | |||
1 | <h3>Requests stats</h3> | 1 | <h3>Requests stats</h3> |
2 | 2 | ||
3 | <div *ngIf="stats !== null"> | 3 | <div *ngFor="let requestSchedulerName of statsTitles | keys"> |
4 | <div class="requests-general"> | 4 | <div class="block" *ngIf="stats[requestSchedulerName] !== null"> |
5 | <div> | 5 | <h4>{{ statsTitles[requestSchedulerName] }}</h4> |
6 | <span class="label-description">Remaining requests:</span> | ||
7 | {{ stats.totalRequests }} | ||
8 | </div> | ||
9 | 6 | ||
10 | <div> | 7 | <div class="requests-general"> |
11 | <span class="label-description">Interval seconds between requests:</span> | 8 | <div> |
12 | {{ stats.secondsInterval }} | 9 | <span class="label-description">Remaining requests:</span> |
13 | </div> | 10 | {{ stats[requestSchedulerName].totalRequests }} |
11 | </div> | ||
14 | 12 | ||
15 | <div> | 13 | <div> |
16 | <span class="label-description">Remaining time before the scheduled request:</span> | 14 | <span class="label-description">Interval seconds between requests:</span> |
17 | {{ stats.remainingSeconds }} | 15 | {{ stats[requestSchedulerName].secondsInterval }} |
18 | </div> | 16 | </div> |
19 | </div> | ||
20 | 17 | ||
21 | <div class="requests-limit"> | 18 | <div> |
22 | <div> | 19 | <span class="label-description">Remaining time before the scheduled request:</span> |
23 | <span class="label-description">Maximum number of different pods for a scheduled request:</span> | 20 | {{ stats[requestSchedulerName].remainingSeconds }} |
24 | {{ stats.requestsLimitPods }} | 21 | </div> |
25 | </div> | 22 | </div> |
26 | 23 | ||
27 | <div> | 24 | <div class="requests-limit"> |
28 | <span class="label-description">Maximum number of requests per pod for a scheduled request:</span> | 25 | <div> |
29 | {{ stats.requestsLimitPerPod }} | 26 | <span class="label-description">Maximum number of different pods for a scheduled request:</span> |
27 | {{ stats[requestSchedulerName].requestsLimitPods }} | ||
28 | </div> | ||
29 | |||
30 | <div> | ||
31 | <span class="label-description">Maximum number of requests per pod for a scheduled request:</span> | ||
32 | {{ stats[requestSchedulerName].requestsLimitPerPod }} | ||
33 | </div> | ||
30 | </div> | 34 | </div> |
31 | </div> | ||
32 | 35 | ||
36 | </div> | ||
33 | </div> | 37 | </div> |
diff --git a/client/src/app/+admin/requests/request-stats/request-stats.component.scss b/client/src/app/+admin/requests/request-stats/request-stats.component.scss index 9c68fba99..c9f724604 100644 --- a/client/src/app/+admin/requests/request-stats/request-stats.component.scss +++ b/client/src/app/+admin/requests/request-stats/request-stats.component.scss | |||
@@ -1,3 +1,7 @@ | |||
1 | .block { | ||
2 | margin-bottom: 40px; | ||
3 | } | ||
4 | |||
1 | .label-description { | 5 | .label-description { |
2 | display: inline-block; | 6 | display: inline-block; |
3 | font-weight: bold; | 7 | font-weight: bold; |
diff --git a/client/src/app/+admin/requests/request-stats/request-stats.component.ts b/client/src/app/+admin/requests/request-stats/request-stats.component.ts index 18855a5f8..85dd7e492 100644 --- a/client/src/app/+admin/requests/request-stats/request-stats.component.ts +++ b/client/src/app/+admin/requests/request-stats/request-stats.component.ts | |||
@@ -10,10 +10,30 @@ import { RequestService, RequestStats } from '../shared'; | |||
10 | styleUrls: [ './request-stats.component.scss' ] | 10 | styleUrls: [ './request-stats.component.scss' ] |
11 | }) | 11 | }) |
12 | export class RequestStatsComponent implements OnInit, OnDestroy { | 12 | export class RequestStatsComponent implements OnInit, OnDestroy { |
13 | stats: RequestStats = null; | 13 | statsTitles = { |
14 | requestScheduler: 'Basic request scheduler', | ||
15 | requestVideoEventScheduler: 'Video events request scheduler', | ||
16 | requestVideoQaduScheduler: 'Quick and dirty video updates request scheduler' | ||
17 | }; | ||
18 | |||
19 | stats: { [ id: string ]: RequestStats } = { | ||
20 | requestScheduler: null, | ||
21 | requestVideoEventScheduler: null, | ||
22 | requestVideoQaduScheduler: null | ||
23 | }; | ||
24 | |||
25 | private intervals: { [ id: string ]: number } = { | ||
26 | requestScheduler: null, | ||
27 | requestVideoEventScheduler: null, | ||
28 | requestVideoQaduScheduler: null | ||
29 | }; | ||
30 | |||
31 | private timeouts: { [ id: string ]: number } = { | ||
32 | requestScheduler: null, | ||
33 | requestVideoEventScheduler: null, | ||
34 | requestVideoQaduScheduler: null | ||
35 | }; | ||
14 | 36 | ||
15 | private interval: number = null; | ||
16 | private timeout: number = null; | ||
17 | 37 | ||
18 | constructor( | 38 | constructor( |
19 | private notificationsService: NotificationsService, | 39 | private notificationsService: NotificationsService, |
@@ -22,17 +42,19 @@ export class RequestStatsComponent implements OnInit, OnDestroy { | |||
22 | 42 | ||
23 | ngOnInit() { | 43 | ngOnInit() { |
24 | this.getStats(); | 44 | this.getStats(); |
25 | this.runInterval(); | 45 | this.runIntervals(); |
26 | } | 46 | } |
27 | 47 | ||
28 | ngOnDestroy() { | 48 | ngOnDestroy() { |
29 | if (this.interval !== null) { | 49 | Object.keys(this.stats).forEach(requestSchedulerName => { |
30 | window.clearInterval(this.interval); | 50 | if (this.intervals[requestSchedulerName] !== null) { |
31 | } | 51 | window.clearInterval(this.intervals[requestSchedulerName]); |
52 | } | ||
32 | 53 | ||
33 | if (this.timeout !== null) { | 54 | if (this.timeouts[requestSchedulerName] !== null) { |
34 | window.clearTimeout(this.timeout); | 55 | window.clearTimeout(this.timeouts[requestSchedulerName]); |
35 | } | 56 | } |
57 | }); | ||
36 | } | 58 | } |
37 | 59 | ||
38 | getStats() { | 60 | getStats() { |
@@ -43,14 +65,18 @@ export class RequestStatsComponent implements OnInit, OnDestroy { | |||
43 | ); | 65 | ); |
44 | } | 66 | } |
45 | 67 | ||
46 | private runInterval() { | 68 | private runIntervals() { |
47 | this.interval = window.setInterval(() => { | 69 | Object.keys(this.intervals).forEach(requestSchedulerName => { |
48 | this.stats.remainingMilliSeconds -= 1000; | 70 | this.intervals[requestSchedulerName] = window.setInterval(() => { |
71 | const stats = this.stats[requestSchedulerName]; | ||
49 | 72 | ||
50 | if (this.stats.remainingMilliSeconds <= 0) { | 73 | stats.remainingMilliSeconds -= 1000; |
51 | this.timeout = window.setTimeout(() => this.getStats(), this.stats.remainingMilliSeconds + 100); | 74 | |
52 | } | 75 | if (stats.remainingMilliSeconds <= 0) { |
53 | }, 1000); | 76 | this.timeouts[requestSchedulerName] = window.setTimeout(() => this.getStats(), stats.remainingMilliSeconds + 100); |
77 | } | ||
78 | }, 1000); | ||
79 | }); | ||
54 | } | 80 | } |
55 | 81 | ||
56 | 82 | ||
diff --git a/client/src/app/+admin/requests/shared/request.service.ts b/client/src/app/+admin/requests/shared/request.service.ts index 55b28bcfc..915d192a6 100644 --- a/client/src/app/+admin/requests/shared/request.service.ts +++ b/client/src/app/+admin/requests/shared/request.service.ts | |||
@@ -15,10 +15,20 @@ export class RequestService { | |||
15 | private restExtractor: RestExtractor | 15 | private restExtractor: RestExtractor |
16 | ) {} | 16 | ) {} |
17 | 17 | ||
18 | getStats(): Observable<RequestStats> { | 18 | getStats(): Observable<{ [ id: string ]: RequestStats }> { |
19 | return this.authHttp.get(RequestService.BASE_REQUEST_URL + 'stats') | 19 | return this.authHttp.get(RequestService.BASE_REQUEST_URL + 'stats') |
20 | .map(this.restExtractor.extractDataGet) | 20 | .map(this.restExtractor.extractDataGet) |
21 | .map((data) => new RequestStats(data)) | 21 | .map(this.buildRequestObjects) |
22 | .catch((res) => this.restExtractor.handleError(res)); | 22 | .catch((res) => this.restExtractor.handleError(res)); |
23 | } | 23 | } |
24 | |||
25 | private buildRequestObjects(data: any) { | ||
26 | const requestSchedulers = {}; | ||
27 | |||
28 | Object.keys(data).forEach(requestSchedulerName => { | ||
29 | requestSchedulers[requestSchedulerName] = new RequestStats(data[requestSchedulerName]); | ||
30 | }); | ||
31 | |||
32 | return requestSchedulers; | ||
33 | } | ||
24 | } | 34 | } |
diff --git a/client/src/app/shared/shared.module.ts b/client/src/app/shared/shared.module.ts index 99893c8b1..0f57ef078 100644 --- a/client/src/app/shared/shared.module.ts +++ b/client/src/app/shared/shared.module.ts | |||
@@ -5,6 +5,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms'; | |||
5 | import { RouterModule } from '@angular/router'; | 5 | import { RouterModule } from '@angular/router'; |
6 | 6 | ||
7 | import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe'; | 7 | import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe'; |
8 | import { KeysPipe } from 'angular-pipes/src/object/keys.pipe'; | ||
8 | import { DropdownModule } from 'ng2-bootstrap/dropdown'; | 9 | import { DropdownModule } from 'ng2-bootstrap/dropdown'; |
9 | import { ProgressbarModule } from 'ng2-bootstrap/progressbar'; | 10 | import { ProgressbarModule } from 'ng2-bootstrap/progressbar'; |
10 | import { PaginationModule } from 'ng2-bootstrap/pagination'; | 11 | import { PaginationModule } from 'ng2-bootstrap/pagination'; |
@@ -36,6 +37,7 @@ import { VideoAbuseService } from './video-abuse'; | |||
36 | 37 | ||
37 | declarations: [ | 38 | declarations: [ |
38 | BytesPipe, | 39 | BytesPipe, |
40 | KeysPipe, | ||
39 | SearchComponent | 41 | SearchComponent |
40 | ], | 42 | ], |
41 | 43 | ||
@@ -53,6 +55,7 @@ import { VideoAbuseService } from './video-abuse'; | |||
53 | ProgressbarModule, | 55 | ProgressbarModule, |
54 | Ng2SmartTableModule, | 56 | Ng2SmartTableModule, |
55 | BytesPipe, | 57 | BytesPipe, |
58 | KeysPipe, | ||
56 | 59 | ||
57 | SearchComponent | 60 | SearchComponent |
58 | ], | 61 | ], |