Permalink
Browse files

fix(): progress bar

  • Loading branch information...
Izak88 committed Sep 25, 2017
1 parent 5415be1 commit b5e09edbec543345f7944a37b41e9a70471551dd
@@ -144,13 +144,21 @@ function execJob(proc: JobProcess): Observable<{}> {
.then(runId => {
const data = {
id: runId,
end_time: new Date(),
end_time: time,
status: 'failed',
log: proc.log.join('')
};

return dbJobRuns.updateJobRun(data);
})
.then(() => {
jobEvents.next({
type: 'process',
job_id: proc.job_id,
data: 'job failed',
additionalData: time.getTime()
});
})
.then(build => updateBuild({ id: proc.build_id, end_time: time }))
.then(id => updateBuildRun({ id: id, end_time: time }))
.then(() => getBuild(proc.build_id))
@@ -185,7 +193,7 @@ function execJob(proc: JobProcess): Observable<{}> {
.then(runId => {
const data = {
id: runId,
end_time: new Date(),
end_time: time,
status: 'success',
log: proc.log.join('')
};
@@ -210,9 +218,9 @@ function execJob(proc: JobProcess): Observable<{}> {
});
} else if (status === 'failed') {
return getBuild(proc.build_id)
.then(build => updateBuild({ id: proc.build_id, end_time: new Date() }))
.then(build => updateBuild({ id: proc.build_id, end_time: time }))
.then(() => getLastRunId(proc.build_id))
.then(id => updateBuildRun({ id: id, end_time: new Date()} ))
.then(id => updateBuildRun({ id: id, end_time: time} ))
.then(() => getBuild(proc.build_id))
.then(build => sendFailureStatus(build, build.id))
.then(() => {
@@ -232,7 +240,8 @@ function execJob(proc: JobProcess): Observable<{}> {
type: 'process',
build_id: proc.build_id,
job_id: proc.job_id,
data: 'job succeded'
data: 'job succeded',
additionalData: time.getTime()
});
observer.complete();
})
@@ -255,17 +264,20 @@ function execJob(proc: JobProcess): Observable<{}> {
})
.then(() => dbJob.getLastRunId(proc.job_id))
.then(runId => {
const data = { id: runId, start_time: new Date(), status: 'running', log: '' };
return dbJobRuns.updateJobRun(data);
})
.then(() => {
const time = new Date();
const data = {
type: 'process',
build_id: proc.build_id,
job_id: proc.job_id,
data: 'job started'
};
jobEvents.next(data);
id: runId, start_time: time, end_time: null, status: 'running', log: '' };
return dbJobRuns.updateJobRun(data)
.then(() => {
const data = {
type: 'process',
build_id: proc.build_id,
job_id: proc.job_id,
data: 'job started',
additionalData: time.getTime()
};
jobEvents.next(data);
});
})
.catch(err => {
const msg: LogMessageType = { message: `[error]: ${err}`, type: 'error', notify: false };
@@ -410,7 +422,7 @@ export function stopJob(jobId: number): Promise<void> {
.then(runId => dbJobRuns.getRun(runId))
.then(jobRun => {
if (jobRun.status !== 'success') {
return dbJobRuns.updateJobRun({id: jobRun.id, end_time: new Date(), status: 'failed' });
return dbJobRuns.updateJobRun({id: jobRun.id, end_time: time, status: 'failed' });
}
})
.then(() => dbJob.getJob(jobId))
@@ -419,7 +431,8 @@ export function stopJob(jobId: number): Promise<void> {
type: 'process',
build_id: job.builds_id,
job_id: job.id,
data: 'job stopped'
data: 'job stopped',
additionalData: time.getTime()
};
jobEvents.next(data);
}).then(() => {
@@ -129,13 +129,14 @@ <h1 class="bold">
</div>
</div>
<div class="column is-2">
<progress min="0" max="1" [value]="(currentTime - job?.start_time) / job.lastRunTime" *ngIf="job?.status === 'running' && (job?.lastRunTime && (currentTime - job?.start_time) / job?.lastRunTime) < 1"></progress>
<progress min="0" max="1" [value]="(currentTime - job?.start_time) / job.lastRunTime" *ngIf="job?.status === 'running' && job?.lastRunTime && job?.lastRunTime > 0 && (currentTime - job?.start_time) / job?.lastRunTime < 1"></progress>
<span class="data-label green" *ngIf="job?.status === 'success'">Success</span>
<span class="data-label red" *ngIf="job?.status === 'failed'">Failed</span>
<span class="data-label bright" *ngIf="job?.status === 'queued'">Queued</span>
<span class="data-label bright" *ngIf="job?.status === 'running' && (job?.lastRunTime && (currentTime - job?.start_time) / job?.lastRunTime) >= 1">Running</span>
</div>
<div class="column is-1">
<div class="column is-1" *ngIf="processingBuild"></div>
<div class="column is-1" *ngIf="!processingBuild">
<span class="job-time" *ngIf="job?.status === 'running'">{{ currentTime - job.start_time | toTime }}</span>
<span class="job-time" *ngIf="job?.status === 'success' || job?.status === 'failed'">{{ job.end_time - job.start_time | toTime }}</span>
<span class="job-time" *ngIf="job?.status === 'queued'">00:00</span>
@@ -88,13 +88,13 @@ export class AppBuildDetailsComponent implements OnInit, OnDestroy {
if (event.data === 'job started') {
this.build.jobs[index].status = 'running';
this.build.jobs[index].end_time = null;
this.build.jobs[index].start_time = new Date().getTime();
this.build.jobs[index].start_time = event.additionalData;
} else if (event.data === 'job succeded') {
this.build.jobs[index].status = 'success';
this.build.jobs[index].end_time = new Date().getTime();
this.build.jobs[index].end_time = event.additionalData;
} else if (event.data === 'job failed' || event.data === 'job stopped') {
this.build.jobs[index].status = 'failed';
this.build.jobs[index].end_time = new Date().getTime();
this.build.jobs[index].end_time = event.additionalData;
} else if (event.data === 'job queued') {
this.build.jobs[index].status = 'queued';
}
@@ -106,7 +106,7 @@ export class AppBuildDetailsComponent implements OnInit, OnDestroy {
});

this.sub = this.socketService.outputEvents
.filter(event => event.type === 'build stopped')
.filter(event => event.type === 'build stopped' || event.type === 'build restarted')
.subscribe(event => {
this.processingBuild = false;
});
@@ -224,11 +224,9 @@ export class AppBuildDetailsComponent implements OnInit, OnDestroy {
e.preventDefault();
e.stopPropagation();

if (this.getBuildStatus() === 'success') {
let minJobStartTime = Math.min(...this.build.jobs.map(job => job.start_time));
let maxJobEndTime = Math.max(...this.build.jobs.map(job => job.end_time));
this.previousRuntime = maxJobEndTime - minJobStartTime;
}
let minJobStartTime = Math.min(...this.build.jobs.map(job => job.start_time));
let maxJobEndTime = Math.max(...this.build.jobs.map(job => job.end_time));
this.previousRuntime = maxJobEndTime - minJobStartTime;
this.processingBuild = true;
this.socketService.emit({ type: 'restartBuild', data: { buildId: id } });
}
@@ -75,23 +75,23 @@ export class AppBuildsComponent implements OnInit, OnDestroy {
switch (e.data) {
case 'job succeded':
this.builds[build].jobs[index].status = 'success';
this.builds[build].jobs[index].end_time = new Date();
this.builds[build].jobs[index].end_time = e.additionalData;
break;
case 'job queued':
this.builds[build].jobs[index].status = 'queued';
break;
case 'job started':
this.builds[build].jobs[index].status = 'running';
this.builds[build].jobs[index].start_time = new Date();
this.builds[build].jobs[index].start_time = e.additionalData;
this.builds[build].jobs[index].end_time = null;
break;
case 'job failed':
this.builds[build].jobs[index].status = 'failed';
this.builds[build].jobs[index].end_time = new Date();
this.builds[build].jobs[index].end_time = e.additionalData;
break;
case 'job stopped':
this.builds[build].jobs[index].status = 'failed';
this.builds[build].jobs[index].end_time = new Date();
this.builds[build].jobs[index].end_time = e.additionalData;
break;
}

@@ -86,7 +86,7 @@ <h2 *ngIf="commitMessage">{{ commitMessage }}</h2>
</p>
</div>
<div class="column is-2">
<progress *ngIf="jobRun.status === 'running' && previousRuntime" class="progress-bar is-success is-small" [value]="(currentTime - jobRun.start_time) / previousRuntime" max="1" min="0"></progress>
<progress *ngIf="jobRun.status === 'running' && previousRuntime && previousRuntime > 0" class="progress-bar is-success is-small" [value]="(currentTime - jobRun.start_time) / previousRuntime" max="1" min="0"></progress>
<p class="text-small" *ngIf="jobRun.status !== 'running'">
Build started {{ timeWords }} ago
</p>
@@ -104,14 +104,14 @@ export class AppJobComponent implements OnInit, OnDestroy {
if (event.data === 'job started') {
this.jobRun.status = 'running';
this.jobRun.end_time = null;
this.jobRun.start_time = new Date().getTime();
this.jobRun.start_time = event.additionalData;
} else if (event.data === 'job succeded') {
this.jobRun.status = 'success';
this.jobRun.end_time = new Date().getTime();
this.jobRun.end_time = event.additionalData;
this.previousRuntime = this.jobRun.end_time - this.jobRun.start_time;
} else if (event.data == 'job failed') {
this.jobRun.status = 'failed';
this.jobRun.end_time = new Date().getTime();
this.jobRun.end_time = event.additionalData;
this.previousRuntime = this.jobRun.end_time - this.jobRun.start_time;
}

@@ -142,22 +142,22 @@ export class AppRepositoryComponent implements OnInit, OnDestroy {
switch (event.data) {
case 'job succeded':
status = 'success';
this.repo.builds[index].jobs[jobIndex].end_time = new Date();
this.repo.builds[index].jobs[jobIndex].end_time = event.additionalData;
break;
case 'job queued':
status = 'queued';
break;
case 'job started':
status = 'running';
this.repo.builds[index].jobs[jobIndex].start_time = new Date();
this.repo.builds[index].jobs[jobIndex].start_time = event.additionalData;
break;
case 'job failed':
status = 'failed';
this.repo.builds[index].jobs[jobIndex].start_time = new Date();
this.repo.builds[index].jobs[jobIndex].start_time = event.additionalData;
break;
case 'job stopped':
status = 'failed';
this.repo.builds[index].jobs[jobIndex].end_time = new Date();
this.repo.builds[index].jobs[jobIndex].end_time = event.additionalData;
break;
}

@@ -4,12 +4,16 @@ import { format } from 'date-fns';
@Pipe({ name: 'toTime'})
export class ToTimePipe implements PipeTransform {
transform(value) {
let time = new Date(value);
let hours = time.getUTCHours();
if (hours > 0) {
return `${hours}:${format(value, 'mm:ss')}`;
if (value < 0) {
return '00:00';
} else {
return format(value, 'mm:ss');
let time = new Date(value);
let hours = time.getUTCHours();
if (hours > 0) {
return `${hours}:${format(value, 'mm:ss')}`;
} else {
return format(value, 'mm:ss');
}
}
}
}

0 comments on commit b5e09ed

Please sign in to comment.