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/08/21 21:21:17 UTC

[incubator-streampipes] branch dev updated (32a3e72 -> a292124)

This is an automated email from the ASF dual-hosted git repository.

riemer pushed a change to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git.


    from 32a3e72  [STREAMPIPES-201] Improve setup view
     new 48a56ae  [hotfix] Add loading screen to Connect module
     new 1d7ba82  [hotfix] Add padding to version info view
     new a292124  [hotfix] Add loading screen to notification view

The 3 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../data-marketplace.component.css                 |  4 ++
 .../data-marketplace.component.html                | 21 +++++----
 .../data-marketplace/data-marketplace.component.ts |  8 ++++
 ui/src/app/info/versions/versions.component.css    |  4 ++
 .../app/notifications/notifications.component.html | 12 ++++--
 .../app/notifications/notifications.component.ts   |  4 ++
 ui/src/app/notifications/notifications.module.ts   | 50 +++++++++++-----------
 7 files changed, 67 insertions(+), 36 deletions(-)


[incubator-streampipes] 01/03: [hotfix] Add loading screen to Connect module

Posted by ri...@apache.org.
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

commit 48a56ae2c6490d0cbf44c7ca91be97ab7699d193
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Fri Aug 21 22:42:25 2020 +0200

    [hotfix] Add loading screen to Connect module
---
 .../data-marketplace/data-marketplace.component.css |  4 ++++
 .../data-marketplace.component.html                 | 21 ++++++++++++---------
 .../data-marketplace/data-marketplace.component.ts  |  8 ++++++++
 3 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/ui/src/app/connect/data-marketplace/data-marketplace.component.css b/ui/src/app/connect/data-marketplace/data-marketplace.component.css
index c37d0ff..633aaf0 100644
--- a/ui/src/app/connect/data-marketplace/data-marketplace.component.css
+++ b/ui/src/app/connect/data-marketplace/data-marketplace.component.css
@@ -36,6 +36,10 @@
   min-height: calc(100vh - 70px);
 }
 
+.pl-5 {
+  padding-left:5px;
+}
+
 .box {
   width: 200px; height: 300px;
   position: relative;
diff --git a/ui/src/app/connect/data-marketplace/data-marketplace.component.html b/ui/src/app/connect/data-marketplace/data-marketplace.component.html
index 07ad979..a4a686e 100644
--- a/ui/src/app/connect/data-marketplace/data-marketplace.component.html
+++ b/ui/src/app/connect/data-marketplace/data-marketplace.component.html
@@ -28,21 +28,18 @@
                 </mat-tab>
             </mat-tab-group>
         </div>
-        <div fxFlex="100" fxLayout="row" fxLayoutAlign="end center" style="padding-left:10px;padding-right: 50px;font-size:14px;line-height:24px;border-bottom:1px solid #ccc"
+        <div fxFlex="100" fxLayout="row" fxLayoutAlign="end center" style="padding-left:10px;padding-right:10px;font-size:14px;line-height:24px;border-bottom:1px solid #ccc"
             *ngIf="selectedIndex === 0 && newAdapterFromDescription === undefined">
             <button mat-icon-button id="startAdapterTutorial3" (click)="startAdapterTutorial3()" matTooltip="Tutorial: Generic Adapter">
-                <i class="material-icons">
-                    school
-                </i>
+                <mat-icon color="primary">school</mat-icon>
             </button>
         </div>
     </div>
 
     <div fxLayout="row" class="fixed-height data-marketplace-options">
 
-        <div class="data-marketplace-options-item" fxLayoutAlign="start center" fxLayout="row">
-            <mat-icon>search</mat-icon>
-
+        <div class="data-marketplace-options-item pl-5" style="margin-top:8px;" fxLayoutAlign="start center" fxLayout="row">
+            <mat-icon color="primary">search</mat-icon>
             <mat-form-field class="form-style">
                 <input matInput placeholder="Find Element" value="" (input)="updateFilterTerm($event.target.value)"
                     name="something">
@@ -72,8 +69,14 @@
         <mat-icon class="icon-style" matTooltip="Upload Adapter Templates" (click)="uploadAdapterTemplates()" style="margin-right: 15px; cursor: pointer;">cloud_upload</mat-icon>
 
     </div>
-
-    <div class="container-fluid marketplace-container">
+    <div class="container-fluid marketplace-container" *ngIf="adapterLoadingError" fxFlex="100" fxLayoutAlign="center center" fxLayout="row">
+        <h4>Available adapters could not be loaded. Did you start a StreamPipes Connect worker node?</h4>
+    </div>
+    <div class="container-fluid marketplace-container" *ngIf="adaptersLoading" fxFlex="100" fxLayoutAlign="center center" fxLayout="row">
+        <mat-spinner [mode]="'indeterminate'" [diameter]="20"></mat-spinner>
+        <h4>&nbsp;&nbsp;Searching for available adapters, please wait...</h4>
+    </div>
+    <div class="container-fluid marketplace-container" *ngIf="!adaptersLoading && !adapterLoadingError">
         <div *ngIf="selectedIndex === 0">
 
             <div *ngIf="newAdapterFromDescription===undefined" fxLayout="row wrap" fxLayoutAlign="start stretch" class="adapter-description-container">
diff --git a/ui/src/app/connect/data-marketplace/data-marketplace.component.ts b/ui/src/app/connect/data-marketplace/data-marketplace.component.ts
index a7219ca..fe03695 100644
--- a/ui/src/app/connect/data-marketplace/data-marketplace.component.ts
+++ b/ui/src/app/connect/data-marketplace/data-marketplace.component.ts
@@ -59,6 +59,9 @@ export class DataMarketplaceComponent implements OnInit {
     adapterCategories: any;
     selectedCategory: any = "All";
 
+    adaptersLoading: boolean = true;
+    adapterLoadingError: boolean = false;
+
     constructor(private dataMarketplaceService: DataMarketplaceService,
                 private ShepherdService: ShepherdService,
                 private connectService: ConnectService,
@@ -84,6 +87,7 @@ export class DataMarketplaceComponent implements OnInit {
     }
 
     getAdapterDescriptions(): void {
+        this.adaptersLoading = true;
         this.adapterDescriptions = [];
 
         this.dataMarketplaceService
@@ -94,6 +98,10 @@ export class DataMarketplaceComponent implements OnInit {
                 this.adapterDescriptions
                     .sort((a, b) => a.name.localeCompare(b.name));
                 this.filteredAdapterDescriptions = this.adapterDescriptions;
+                this.adaptersLoading = false;
+            }, error => {
+                this.adaptersLoading = false;
+                this.adapterLoadingError = true;
             });
 
         this.dataMarketplaceService.getAdapterTemplates().subscribe(adapterTemplates => {


[incubator-streampipes] 02/03: [hotfix] Add padding to version info view

Posted by ri...@apache.org.
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

commit 1d7ba82732cfa6d6419595c3b1474ec7453e1d3c
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Fri Aug 21 22:44:52 2020 +0200

    [hotfix] Add padding to version info view
---
 ui/src/app/info/versions/versions.component.css | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/ui/src/app/info/versions/versions.component.css b/ui/src/app/info/versions/versions.component.css
index 89c356d..25090d3 100644
--- a/ui/src/app/info/versions/versions.component.css
+++ b/ui/src/app/info/versions/versions.component.css
@@ -20,4 +20,8 @@
     margin-top:20px;
     margin-left:auto;
     margin-right:auto;
+}
+
+.md-padding {
+    padding: 10px;
 }
\ No newline at end of file


[incubator-streampipes] 03/03: [hotfix] Add loading screen to notification view

Posted by ri...@apache.org.
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

commit a292124ffbe97a83ccde1616d6028273df52a5fc
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Fri Aug 21 23:00:21 2020 +0200

    [hotfix] Add loading screen to notification view
---
 .../app/notifications/notifications.component.html | 12 ++++--
 .../app/notifications/notifications.component.ts   |  4 ++
 ui/src/app/notifications/notifications.module.ts   | 50 +++++++++++-----------
 3 files changed, 39 insertions(+), 27 deletions(-)

diff --git a/ui/src/app/notifications/notifications.component.html b/ui/src/app/notifications/notifications.component.html
index ea1e100..4090002 100644
--- a/ui/src/app/notifications/notifications.component.html
+++ b/ui/src/app/notifications/notifications.component.html
@@ -31,8 +31,14 @@
             </div>
         </div>
     </div>
-
-    <div class="fixed-height page-container-padding-inner" fxLayout="row" fxFlex="100">
+    <div class="container-fluid marketplace-container" *ngIf="notificationsLoading" fxFlex="100" fxLayoutAlign="center center" fxLayout="column">
+        <mat-spinner [mode]="'indeterminate'" [diameter]="20"></mat-spinner>
+        <h4>Loading notifications...</h4>
+    </div>
+    <div class="fixed-height page-container-padding-inner" *ngIf="!notificationsLoading && !pipelinesWithNotificationsPresent" fxFlex="100" fxLayoutAlign="center center" fxLayout="row">
+        <h4>No notifications available. Create a new pipeline using the Notification Sink to create your first notification!</h4>
+    </div>
+    <div class="fixed-height page-container-padding-inner" fxLayout="row" fxFlex="100" *ngIf="!notificationsLoading && pipelinesWithNotificationsPresent">
         <div fxFlex="30" class="notifications-overview scrolling-auto">
             <mat-list>
                 <mat-list-item *ngFor="let existingNotification of existingNotifications"
@@ -52,7 +58,7 @@
                 </mat-list-item>
             </mat-list>
         </div>
-        <div fxFlex="70" class="notifications-details" *ngIf="pipelinesWithNotificationsPresent">
+        <div fxFlex="70" class="notifications-details">
             <div class="notification-details-wrapper">
                 <div class="notification-header" fxLayout="column" fxLayoutAlign="center start">
                     <div class="notification-header-pipeline-name">{{currentlySelectedNotification.pipelineName}}</div>
diff --git a/ui/src/app/notifications/notifications.component.ts b/ui/src/app/notifications/notifications.component.ts
index 8a5194d..7f52228 100644
--- a/ui/src/app/notifications/notifications.component.ts
+++ b/ui/src/app/notifications/notifications.component.ts
@@ -49,6 +49,8 @@ export class NotificationsComponent implements OnInit, OnDestroy {
     currentlySelectedNotificationId: string;
 
     pipelinesWithNotificationsPresent: boolean = false;
+    notificationsLoading: boolean = false;
+
     currentOffset: number = 0;
     liveOffset: number = 0;
     previousScrollHeight: number;
@@ -104,8 +106,10 @@ export class NotificationsComponent implements OnInit, OnDestroy {
     }
 
     getPipelinesWithNotifications() {
+        this.notificationsLoading = true;
         this.RestApi.getOwnPipelines().subscribe(pipelines => {
             this.filterForNotifications(pipelines);
+            this.notificationsLoading = false;
             if (this.existingNotifications.length > 0) {
                 this.pipelinesWithNotificationsPresent = true;
                 this.selectNotification(this.existingNotifications[0]);
diff --git a/ui/src/app/notifications/notifications.module.ts b/ui/src/app/notifications/notifications.module.ts
index 3c119c8..68d0eda 100644
--- a/ui/src/app/notifications/notifications.module.ts
+++ b/ui/src/app/notifications/notifications.module.ts
@@ -26,35 +26,37 @@ import {NotificationsComponent} from "./notifications.component";
 import {NotificationItemComponent} from "./components/notification-item.component";
 import {NotificationsService} from "./service/notifications.service";
 import {InjectableRxStompConfig, RxStompService, rxStompServiceFactory} from "@stomp/ng2-stompjs";
+import {MatProgressSpinnerModule} from "@angular/material/progress-spinner";
 
 @NgModule({
-	imports: [
-		CommonModule,
-		MatTabsModule,
-		FlexLayoutModule,
-		CommonModule,
-		FlexLayoutModule,
-		CustomMaterialModule,
-		FormsModule
-	],
-	declarations: [
-		NotificationsComponent,
-		NotificationItemComponent
-	],
-	providers: [
-		NotificationsService
-	],
-	exports: [
-		NotificationsComponent
-	],
-	entryComponents: [
-		NotificationsComponent,
-	]
+  imports: [
+    CommonModule,
+    MatProgressSpinnerModule,
+    MatTabsModule,
+    FlexLayoutModule,
+    CommonModule,
+    FlexLayoutModule,
+    CustomMaterialModule,
+    FormsModule
+  ],
+  declarations: [
+    NotificationsComponent,
+    NotificationItemComponent
+  ],
+  providers: [
+    NotificationsService
+  ],
+  exports: [
+    NotificationsComponent
+  ],
+  entryComponents: [
+    NotificationsComponent,
+  ]
 })
 export class NotificationModule {
 
-	constructor() {
-	}
+  constructor() {
+  }
 
 }