You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ri...@apache.org on 2020/03/23 21:36:16 UTC
[incubator-streampipes] branch dev updated: Add new websocket
connector to asset dashboard
This is an automated email from the ASF dual-hosted git repository.
riemer pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
The following commit(s) were added to refs/heads/dev by this push:
new b1d4280 Add new websocket connector to asset dashboard
b1d4280 is described below
commit b1d42805f2c4a14a0ab09187de2803365721cba4
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Mon Mar 23 22:36:03 2020 +0100
Add new websocket connector to asset dashboard
---
.../app-asset-monitoring.component.html | 2 +-
.../app-asset-monitoring.component.ts | 1 +
.../app-asset-monitoring.module.ts | 11 +++++++++++
.../components/create-asset/create-asset.component.ts | 8 +++++++-
.../services/websocket.service.ts | 19 ++++++++-----------
5 files changed, 28 insertions(+), 13 deletions(-)
diff --git a/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.html b/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.html
index 84100a7..81a89ab 100644
--- a/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.html
+++ b/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.html
@@ -31,6 +31,6 @@
<div class="fixed-height page-container-padding-inner" fxLayout="column" fxFlex="100">
<asset-dashboard-overview *ngIf="selectedIndex == 0 && !dashboardSelected" fxFlex="100" (selectedDashboard)="openDashboard($event)"></asset-dashboard-overview>
<view-asset fxFlex="100" *ngIf="selectedIndex == 0 && dashboardSelected" [dashboardConfig]="selectedDashboard" (dashboardClosed)="closeDashboard($event)"></view-asset>
- <create-asset *ngIf="selectedIndex == 1" fxFlex="100"></create-asset>
+ <create-asset *ngIf="selectedIndex == 1" fxFlex="100" (dashboardClosed)="closeDashboard($event)"></create-asset>
</div>
</div>
\ No newline at end of file
diff --git a/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.ts b/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.ts
index 191e882..e9bef92 100644
--- a/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.ts
+++ b/ui/src/app/app-asset-monitoring/app-asset-monitoring.component.ts
@@ -51,6 +51,7 @@ export class AppAssetMonitoringComponent {
closeDashboard(dashboardClosed: boolean) {
this.dashboardSelected = false;
+ this.selectedIndex = 0;
}
}
\ No newline at end of file
diff --git a/ui/src/app/app-asset-monitoring/app-asset-monitoring.module.ts b/ui/src/app/app-asset-monitoring/app-asset-monitoring.module.ts
index 6bcd177..ec8ff58 100644
--- a/ui/src/app/app-asset-monitoring/app-asset-monitoring.module.ts
+++ b/ui/src/app/app-asset-monitoring/app-asset-monitoring.module.ts
@@ -38,6 +38,8 @@ import {ColorPickerModule} from "ngx-color-picker";
import {ShapeService} from "./services/shape.service";
import {SaveDashboardDialogComponent} from "./dialog/save-dashboard/save-dashboard-dialog.component";
import {AssetDashboardOverviewComponent} from "./components/dashboard-overview/dashboard-overview.component";
+import {InjectableRxStompConfig, RxStompService, rxStompServiceFactory} from "@stomp/ng2-stompjs";
+import {streamPipesStompConfig} from "../dashboard/services/websocket.config";
@NgModule({
imports: [
@@ -67,6 +69,15 @@ import {AssetDashboardOverviewComponent} from "./components/dashboard-overview/d
useFactory: ($injector: any) => $injector.get('RestApi'),
deps: ['$injector'],
},
+ {
+ provide: InjectableRxStompConfig,
+ useValue: streamPipesStompConfig
+ },
+ {
+ provide: RxStompService,
+ useFactory: rxStompServiceFactory,
+ deps: [InjectableRxStompConfig]
+ },
ElementIconText
],
entryComponents: [
diff --git a/ui/src/app/app-asset-monitoring/components/create-asset/create-asset.component.ts b/ui/src/app/app-asset-monitoring/components/create-asset/create-asset.component.ts
index b607315..0c44e06 100644
--- a/ui/src/app/app-asset-monitoring/components/create-asset/create-asset.component.ts
+++ b/ui/src/app/app-asset-monitoring/components/create-asset/create-asset.component.ts
@@ -16,7 +16,7 @@
*
*/
-import {Component, HostListener} from "@angular/core";
+import {Component, EventEmitter, HostListener, Output} from "@angular/core";
import Konva from "konva";
import {AddPipelineDialogComponent} from "../../dialog/add-pipeline/add-pipeline-dialog.component";
import {MatDialog} from "@angular/material/dialog";
@@ -52,6 +52,8 @@ export class CreateAssetComponent {
backgroundImagePresent: boolean = false;
measurementPresent: boolean = false;
+ @Output() dashboardClosed = new EventEmitter<boolean>();
+
constructor(public dialog: MatDialog, public shapeService: ShapeService) {
}
@@ -131,6 +133,10 @@ export class CreateAssetComponent {
panelClass: 'custom-dialog-container',
data: {dashboardCanvas: this.mainCanvasStage as any, file: this.selectedUploadFile}
});
+ dialogRef.afterClosed().subscribe(closed => {
+ console.log("close");
+ this.dashboardClosed.emit(true);
+ });
}
clearCanvas() {
diff --git a/ui/src/app/app-asset-monitoring/services/websocket.service.ts b/ui/src/app/app-asset-monitoring/services/websocket.service.ts
index a5ff1c4..4a3de23 100644
--- a/ui/src/app/app-asset-monitoring/services/websocket.service.ts
+++ b/ui/src/app/app-asset-monitoring/services/websocket.service.ts
@@ -17,26 +17,23 @@
*/
import {Injectable} from "@angular/core";
-import {Observable} from "rxjs";
-
-declare const Stomp: any;
+import {Observable, Subscription} from "rxjs";
+import {Message} from "@stomp/stompjs";
+import {RxStompService} from "@stomp/ng2-stompjs";
@Injectable()
export class WebsocketService {
- constructor() {
+ subscription: Subscription;
+
+ constructor(private rxStompService: RxStompService) {
}
connect(url, topic): Observable<any> {
return new Observable<any>(observable => {
- let client = Stomp.client(url + "/topic/" +topic);
-
- var onConnect = (frame => {
- client.subscribe("/topic/" +topic, function (message) {
- observable.next(JSON.parse(message.body));
- }, {'Sec-WebSocket-Protocol': 'v10.stomp, v11.stomp'});
+ this.subscription = this.rxStompService.watch("/topic/" +topic).subscribe((message: Message) => {
+ observable.next(JSON.parse(message.body));
});
- client.connect("admin", "admin", onConnect);
});
}