From e2bdc76428139d265e72af91a713d0b7e269c29b Mon Sep 17 00:00:00 2001 From: Danijel Anđelković Date: Wed, 13 Apr 2022 23:24:58 +0200 Subject: Izmenio Notifications, dodao automatsko osvezavanje dataset-load kada se dataset preprocesira. Ispravio bag sa grafom gde samo prva graf komponenta funkcionise. --- frontend/src/app/_data/Notification.ts | 3 ++- .../dataset-load/dataset-load.component.ts | 15 +++++++++-- .../src/app/_elements/graph/graph.component.html | 4 +-- .../src/app/_elements/graph/graph.component.ts | 31 ++++++++++------------ .../notifications/notifications.component.html | 9 +++++-- .../notifications/notifications.component.ts | 10 +++---- 6 files changed, 43 insertions(+), 29 deletions(-) (limited to 'frontend') diff --git a/frontend/src/app/_data/Notification.ts b/frontend/src/app/_data/Notification.ts index 181bb332..c505d399 100644 --- a/frontend/src/app/_data/Notification.ts +++ b/frontend/src/app/_data/Notification.ts @@ -3,6 +3,7 @@ export default class Notification { constructor( public title: string = 'Treniranje u toku...', public id: string = '042', - public progress: number = 0.5 + public progress: number = 0.5, + public hasProgress: boolean = false ) { } } \ No newline at end of file diff --git a/frontend/src/app/_elements/dataset-load/dataset-load.component.ts b/frontend/src/app/_elements/dataset-load/dataset-load.component.ts index f68277c8..62cca456 100644 --- a/frontend/src/app/_elements/dataset-load/dataset-load.component.ts +++ b/frontend/src/app/_elements/dataset-load/dataset-load.component.ts @@ -7,13 +7,14 @@ import { DatatableComponent, TableData } from 'src/app/_elements/datatable/datat import { DatasetsService } from 'src/app/_services/datasets.service'; import { CsvParseService } from 'src/app/_services/csv-parse.service'; import { Output, EventEmitter } from '@angular/core'; +import { SignalRService } from 'src/app/_services/signal-r.service'; @Component({ selector: 'app-dataset-load', templateUrl: './dataset-load.component.html', styleUrls: ['./dataset-load.component.css'] }) -export class DatasetLoadComponent { +export class DatasetLoadComponent implements OnInit { @Output() selectedDatasetChangeEvent = new EventEmitter(); @@ -32,7 +33,7 @@ export class DatasetLoadComponent { term: string = ""; - constructor(private models: ModelsService, private datasets: DatasetsService, private csv: CsvParseService) { + constructor(private models: ModelsService, private datasets: DatasetsService, private csv: CsvParseService, private signalRService: SignalRService) { this.datasets.getMyDatasets().subscribe((datasets) => { this.myDatasets = datasets; }); @@ -84,4 +85,14 @@ export class DatasetLoadComponent { this.selectedDatasetChangeEvent.emit(this.selectedDataset); return true; } + + ngOnInit(): void { + if (this.signalRService.hubConnection) { + this.signalRService.hubConnection.on("NotifyDataset", _ => { + this.refreshMyDatasets(); + }); + } else { + console.warn("Dataset-Load: No connection!"); + } + } } diff --git a/frontend/src/app/_elements/graph/graph.component.html b/frontend/src/app/_elements/graph/graph.component.html index 527d3f1a..1c21fb6c 100644 --- a/frontend/src/app/_elements/graph/graph.component.html +++ b/frontend/src/app/_elements/graph/graph.component.html @@ -1,3 +1,3 @@ -
- +
+
\ No newline at end of file diff --git a/frontend/src/app/_elements/graph/graph.component.ts b/frontend/src/app/_elements/graph/graph.component.ts index e0a05145..8051acc3 100644 --- a/frontend/src/app/_elements/graph/graph.component.ts +++ b/frontend/src/app/_elements/graph/graph.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core'; import Dataset from 'src/app/_data/Dataset'; import Model from 'src/app/_data/Model'; @@ -7,7 +7,12 @@ import Model from 'src/app/_data/Model'; templateUrl: './graph.component.html', styleUrls: ['./graph.component.css'] }) -export class GraphComponent implements OnInit { +export class GraphComponent implements AfterViewInit { + + @ViewChild('graphWrapper') + wrapper!: ElementRef; + @ViewChild('graphCanvas') + canvas!: ElementRef; @Input() model?: Model; @Input() inputCols: number = 1; @@ -20,16 +25,12 @@ export class GraphComponent implements OnInit { @Input() inputNodeColor: string = '#ffdd11'; @Input() outputNodeColor: string = '#44ee22'; - private wrapper?: HTMLDivElement; - private canvas?: HTMLCanvasElement; private ctx?: CanvasRenderingContext2D; constructor() { } - ngOnInit(): void { - this.wrapper = (document.getElementById('graphWrapper')); - this.canvas = (document.getElementById('graphCanvas')); - const ctx = this.canvas.getContext('2d'); + ngAfterViewInit(): void { + const ctx = this.canvas.nativeElement.getContext('2d'); if (ctx) { this.ctx = ctx; } else { @@ -39,10 +40,6 @@ export class GraphComponent implements OnInit { window.addEventListener('resize', () => { this.resize() }); this.update(); this.resize(); - - /*setInterval(() => { - this.update(); - }, 5000);*/ } layers?: Node[][]; @@ -83,7 +80,7 @@ export class GraphComponent implements OnInit { } draw() { - this.ctx!.clearRect(0, 0, this.canvas!.width, this.canvas!.height); + this.ctx!.clearRect(0, 0, this.canvas.nativeElement.width, this.canvas.nativeElement.height); let index = 0; while (index < this.layers!.length - 1) { @@ -126,13 +123,13 @@ export class GraphComponent implements OnInit { ratio = 1; resize() { - this.width = this.wrapper!.offsetWidth; - this.height = this.wrapper!.offsetHeight; + this.width = this.wrapper.nativeElement.offsetWidth; + this.height = this.wrapper.nativeElement.offsetHeight; this.ratio = this.width / this.height; if (this.canvas) { - this.canvas.width = this.width; - this.canvas.height = this.height; + this.canvas.nativeElement.width = this.width; + this.canvas.nativeElement.height = this.height; } this.draw(); diff --git a/frontend/src/app/_elements/notifications/notifications.component.html b/frontend/src/app/_elements/notifications/notifications.component.html index 4e33f77c..ef897cfc 100644 --- a/frontend/src/app/_elements/notifications/notifications.component.html +++ b/frontend/src/app/_elements/notifications/notifications.component.html @@ -1,5 +1,10 @@
-

Notifikacije +

+ Notifikacije + + {{notifications.length}} + +