-
Notifications
You must be signed in to change notification settings - Fork 103
/
app-job.component.ts
124 lines (111 loc) · 3.96 KB
/
app-job.component.ts
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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { ApiService } from '../../services/api.service';
import { SocketService } from '../../services/socket.service';
import { Observable } from 'rxjs/Observable';
import { Subscription } from 'rxjs/Subscription';
import 'rxjs/add/observable/interval';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/takeWhile';
import { format, distanceInWordsToNow } from 'date-fns';
@Component({
selector: 'app-job',
templateUrl: 'app-job.component.html'
})
export class AppJobComponent implements OnInit, OnDestroy {
loading: boolean;
termSub: Subscription;
sub: Subscription;
id: number;
job: any;
status: string;
terminalReady: boolean;
terminalOptions: { size: 'small' | 'large' };
terminalInput: any;
timeWords: string;
processing: boolean;
constructor(
private socketService: SocketService,
private apiService: ApiService,
private route: ActivatedRoute
) {
this.loading = true;
this.status = 'queued';
this.terminalOptions = { size: 'large' };
}
ngOnInit() {
Observable.interval(100)
.map(() => this.terminalReady)
.takeWhile(x => !x)
.subscribe(() => { }, err => console.error(err), () => {
this.route.params.subscribe(params => {
this.id = params.id;
this.apiService.getJob(this.id).subscribe(job => {
this.job = job;
this.terminalInput = job.log;
this.timeWords = distanceInWordsToNow(job.build.start_time);
this.loading = false;
this.termSub = this.socketService.outputEvents
.subscribe(event => {
if (event.type === 'data') {
this.terminalInput = event.data;
} else if (event.type === 'jobStopped' && event.data === this.id) {
this.processing = false;
} else if (event.type === 'jobRestarted' && event.data === this.id) {
this.processing = false;
}
});
this.socketService.emit({ type: 'subscribeToJobOutput', data: { jobId: this.id } });
this.updateJobTime();
setInterval(() => this.updateJobTime(), 1000);
this.sub = this.socketService.outputEvents
.filter(event => event.type === 'process')
.filter(event => event.job_id === parseInt(<any>this.id, 10))
.subscribe(event => {
if (event.data === 'jobStarted') {
job.status = 'running';
job.end_time = null;
job.start_time = new Date().getTime();
} else if (event.data === 'jobSucceded') {
job.status = 'success';
job.end_time = new Date().getTime();
} else if (event.data == 'jobFailed') {
job.status = 'failed';
job.end_time = new Date().getTime();
}
});
});
});
});
}
ngOnDestroy() {
this.termSub.unsubscribe();
this.sub.unsubscribe();
}
updateJobTime(): void {
let currentTime = new Date().getTime() - this.socketService.timeSyncDiff;
if (!this.job.end_time || this.job.status === 'running') {
this.job.time = format(currentTime - this.job.start_time, 'mm:ss');
} else {
this.job.time = format(this.job.end_time - this.job.start_time, 'mm:ss');
}
}
restartJob(e: MouseEvent): void {
e.preventDefault();
e.stopPropagation();
this.terminalInput = { clear: true };
this.processing = true;
this.socketService.emit({ type: 'restartJob', data: { jobId: this.id } });
}
stopJob(e: MouseEvent): void {
e.preventDefault();
e.stopPropagation();
this.processing = true;
this.socketService.emit({ type: 'stopJob', data: { jobId: this.id } });
}
terminalOutput(e: any): void {
if (e === 'ready') {
this.terminalReady = true;
}
}
}