add job service to be able to cancel plot requests
This commit is contained in:
@@ -112,6 +112,8 @@ export class GalleryViewComponent implements OnInit {
|
||||
sequenceId = 0;
|
||||
|
||||
showDetails = false;
|
||||
|
||||
submitterId!: string;
|
||||
|
||||
@ViewChild(GalleryFilterView)
|
||||
filter! : GalleryFilterView;
|
||||
@@ -146,6 +148,7 @@ export class GalleryViewComponent implements OnInit {
|
||||
this.totalNumberImages = 0;
|
||||
this.splitByValuesQueue = new Array<string>();
|
||||
this.sequenceId++;
|
||||
this.plotService.abort(this.submitterId).subscribe({next: () => {}});
|
||||
}
|
||||
|
||||
filteredSortedGalleryItems(): Array<GalleryItem> {
|
||||
@@ -235,20 +238,24 @@ export class GalleryViewComponent implements OnInit {
|
||||
renderGallery(request: PlotRequest, splitByField: string) {
|
||||
const that=this;
|
||||
|
||||
this.submitterId = request.submitterId;
|
||||
this.galleryItems.length = 0;
|
||||
this.splitByValuesQueue.length = 0;
|
||||
|
||||
request.generateThumbnail = true;
|
||||
|
||||
this.plotService.splitQuery(request.query, splitByField).subscribe(function(valuesForSplitBy){
|
||||
console.log("valuesForSplitBy: " + JSON.stringify(valuesForSplitBy));
|
||||
that.splitByValuesQueue = valuesForSplitBy;
|
||||
that.progress = 0;
|
||||
that.totalNumberImages = that.splitByValuesQueue.length;
|
||||
that.renderGalleryRecursively(request, splitByField);
|
||||
},
|
||||
error => {
|
||||
that.showError(error.error.message);
|
||||
this.plotService.splitQuery(request.query, splitByField).subscribe({
|
||||
next: function(valuesForSplitBy){
|
||||
console.log("valuesForSplitBy: " + JSON.stringify(valuesForSplitBy));
|
||||
that.splitByValuesQueue = valuesForSplitBy;
|
||||
that.progress = 0;
|
||||
that.totalNumberImages = that.splitByValuesQueue.length;
|
||||
that.renderGalleryRecursively(request, splitByField);
|
||||
},
|
||||
error: error => {
|
||||
console.log(JSON.stringify(error));
|
||||
that.showError(error.error.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -50,6 +50,10 @@ export class PlotService {
|
||||
};
|
||||
return this.http.get<AutocompleteResult>('//'+window.location.hostname+':'+window.location.port+'/api/autocomplete', options);
|
||||
}
|
||||
|
||||
abort(submitterId: string): Observable<void>{
|
||||
return this.http.delete<void>('//'+window.location.hostname+':'+window.location.port+'/api/plots/'+submitterId)
|
||||
}
|
||||
|
||||
sendPlotRequest(plotRequest: PlotRequest): Observable<PlotResponse>{
|
||||
|
||||
@@ -219,6 +223,7 @@ export class PlotRequest {
|
||||
public generateThumbnail : boolean,
|
||||
public intervalUnit: string,
|
||||
public intervalValue: number,
|
||||
public submitterId: string,
|
||||
public renderBarChartTickLabels: boolean = false){}
|
||||
|
||||
copy(): PlotRequest {
|
||||
|
||||
@@ -67,7 +67,8 @@
|
||||
|
||||
<div id="plot-button-bar">
|
||||
<button
|
||||
*ngIf="!enableGallery"
|
||||
*ngIf="!enableGallery && !plotJobActive"
|
||||
[disabled]="plotJobActive"
|
||||
mat-button
|
||||
matTooltip="Create Plot"
|
||||
(click)="plot()">
|
||||
@@ -75,7 +76,7 @@
|
||||
Plot
|
||||
</button>
|
||||
<button
|
||||
*ngIf="enableGallery"
|
||||
*ngIf="enableGallery && !plotJobActive"
|
||||
mat-button
|
||||
matTooltip="Create Gallery"
|
||||
(click)="gallery()"
|
||||
@@ -83,6 +84,11 @@
|
||||
<img src="assets/img/four-squares-line.svg" class="icon-inline" aria-hidden="true" title="Create Gallery (only active if 'Split' is set)" />
|
||||
Gallery
|
||||
</button>
|
||||
<button
|
||||
*ngIf="plotJobActive"
|
||||
mat-button
|
||||
(click)="abort()"
|
||||
matTooltip="abort"><img src="assets/img/close.svg" class="icon-inline" /> Abort</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -54,6 +54,10 @@ export class VisualizationPageComponent implements OnInit {
|
||||
intervalValue = 1;
|
||||
renderBarChartTickLabels = false;
|
||||
|
||||
submitterId = crypto.randomUUID();
|
||||
|
||||
plotJobActive = false;
|
||||
|
||||
constructor(private plotService: PlotService, private snackBar: MatSnackBar) {
|
||||
}
|
||||
|
||||
@@ -103,10 +107,9 @@ export class VisualizationPageComponent implements OnInit {
|
||||
|
||||
gallery(){
|
||||
if (this.splitBy != null){
|
||||
const that = this;
|
||||
this.plotView.imageUrl = '';
|
||||
that.plotView.stats = null;
|
||||
that.galleryView.show=true;
|
||||
this.plotView.stats = null;
|
||||
this.galleryView.show=true;
|
||||
const request = this.createPlotRequest();
|
||||
this.galleryView.renderGallery(request, this.splitBy.name);
|
||||
} else {
|
||||
@@ -116,8 +119,8 @@ export class VisualizationPageComponent implements OnInit {
|
||||
|
||||
getAxes() : AxesTypes {
|
||||
|
||||
var x = new Array<DataType>();
|
||||
var y = new Array<DataType>();
|
||||
const x = new Array<DataType>();
|
||||
const y = new Array<DataType>();
|
||||
|
||||
for(var i = 0; i < this.selectedPlotType.length; i++){
|
||||
var plotType = this.selectedPlotType[i];
|
||||
@@ -131,12 +134,25 @@ export class VisualizationPageComponent implements OnInit {
|
||||
|
||||
return new AxesTypes(x,y);
|
||||
}
|
||||
|
||||
abort() {
|
||||
this.plotService.abort(this.submitterId).subscribe({
|
||||
complete: () => {
|
||||
this.plotView.imageUrl = '';
|
||||
this.plotView.stats = null;
|
||||
this.plotJobActive = false;
|
||||
this.showError("Job aborted");
|
||||
document.dispatchEvent(new Event("invadersPause", {}));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
plot(){
|
||||
const that = this;
|
||||
|
||||
that.plotView.imageUrl = '';
|
||||
that.plotView.stats = null;
|
||||
this.plotJobActive = true;
|
||||
this.plotView.axes = this.getAxes();
|
||||
console.log(JSON.stringify(this.getAxes()));
|
||||
that.galleryView.show=false;
|
||||
@@ -148,11 +164,14 @@ export class VisualizationPageComponent implements OnInit {
|
||||
next: (plotResponse: PlotResponse) => {
|
||||
this.plotView.imageUrl = "http://"+window.location.hostname+':'+window.location.port+'/'+plotResponse.imageUrl;
|
||||
this.plotView.stats = plotResponse.stats;
|
||||
this.plotJobActive = false;
|
||||
document.dispatchEvent(new Event("invadersPause", {}));
|
||||
},
|
||||
error: (error:any) => {
|
||||
console.log(JSON.stringify(error));
|
||||
this.plotView.imageUrl = '';
|
||||
this.plotView.stats = null;
|
||||
this.plotJobActive = false;
|
||||
this.showError(error.error.message);
|
||||
document.dispatchEvent(new Event("invadersPause", {}));
|
||||
}
|
||||
@@ -184,6 +203,7 @@ export class VisualizationPageComponent implements OnInit {
|
||||
this.enableGallery, // generateThumbnail
|
||||
this.intervalUnit,
|
||||
this.intervalValue,
|
||||
this.submitterId,
|
||||
this.renderBarChartTickLabels);
|
||||
return request;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user