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 2021/08/12 19:41:05 UTC

[incubator-streampipes] branch STREAMPIPES-319 updated (6a11f10 -> 0ca5207)

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

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


    from 6a11f10  Merge branch 'STREAMPIPES-319' of github.com:apache/incubator-streampipes into STREAMPIPES-319
     new c16e680  [STREAMPIPES-402] Refactor line chart config, bump plotly version
     new 165743e  [STREAMPIPES-402] Refactor data view dialog to use global dialog template
     new 0ca5207  Merge branch 'STREAMPIPES-319' of github.com:apache/incubator-streampipes into STREAMPIPES-319

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:
 .../rest/impl/datalake/DataLakeWidgetResource.java |   2 +-
 ui/package.json                                    |   4 +-
 ...lorer-widget-appearance-settings.component.html |   2 +
 ...xplorer-widget-appearance-settings.component.ts |  12 ++
 .../data-explorer-designer-panel.component.html    |   2 +-
 .../grid/data-explorer-dashboard-grid.component.ts |   4 +-
 .../data-explorer-dashboard-overview.component.ts  |  30 ++--
 .../data-explorer-dashboard-panel.component.ts     |   3 +-
 .../widgets/base/base-data-explorer-widget.ts      |  11 +-
 .../widgets/image/image-widget.component.ts        |   6 +-
 .../config/line-chart-widget-config.component.html |  10 ++
 .../config/line-chart-widget-config.component.ts   |   1 -
 .../line-chart/line-chart-widget.component.css     |   2 +-
 .../line-chart/line-chart-widget.component.html    |  10 +-
 .../line-chart/line-chart-widget.component.ts      | 177 ++++++++++++---------
 .../line-chart/model/line-chart-widget.model.ts    |   1 +
 .../table/config/table-widget-config.component.ts  |   1 -
 .../widgets/table/table-widget.component.ts        |  10 +-
 ...ta-explorer-edit-data-view-dialog.component.css |  55 -------
 ...a-explorer-edit-data-view-dialog.component.html |  55 +++----
 ...-explorer-edit-data-view-dialog.component.scss} |  22 +--
 ...ata-explorer-edit-data-view-dialog.component.ts |  25 +--
 .../services/refresh-dashboard.service.ts          |   6 +-
 .../app/data-explorer/services/resize.service.ts   |   4 +-
 24 files changed, 220 insertions(+), 235 deletions(-)
 delete mode 100644 ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.css
 copy ui/src/app/{editor/dialog/compatible-elements/compatible-elements.component.scss => data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.scss} (86%)

[incubator-streampipes] 01/03: [STREAMPIPES-402] Refactor line chart config, bump plotly version

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit c16e6806d152a9fcc84d45511a46e8ae8eb5de94
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Thu Aug 12 21:16:28 2021 +0200

    [STREAMPIPES-402] Refactor line chart config, bump plotly version
---
 .../rest/impl/datalake/DataLakeWidgetResource.java |   2 +-
 ui/package.json                                    |   4 +-
 ...lorer-widget-appearance-settings.component.html |   2 +
 ...xplorer-widget-appearance-settings.component.ts |  12 ++
 .../data-explorer-designer-panel.component.html    |   2 +-
 .../grid/data-explorer-dashboard-grid.component.ts |   4 +-
 .../data-explorer-dashboard-panel.component.ts     |   3 +-
 .../widgets/base/base-data-explorer-widget.ts      |  11 +-
 .../widgets/image/image-widget.component.ts        |   6 +-
 .../config/line-chart-widget-config.component.html |  10 ++
 .../config/line-chart-widget-config.component.ts   |   1 -
 .../line-chart/line-chart-widget.component.css     |   2 +-
 .../line-chart/line-chart-widget.component.html    |  10 +-
 .../line-chart/line-chart-widget.component.ts      | 177 ++++++++++++---------
 .../line-chart/model/line-chart-widget.model.ts    |   1 +
 .../table/config/table-widget-config.component.ts  |   1 -
 .../widgets/table/table-widget.component.ts        |  10 +-
 .../services/refresh-dashboard.service.ts          |   6 +-
 .../app/data-explorer/services/resize.service.ts   |   4 +-
 19 files changed, 158 insertions(+), 110 deletions(-)

diff --git a/streampipes-rest/src/main/java/org/apache/streampipes/rest/impl/datalake/DataLakeWidgetResource.java b/streampipes-rest/src/main/java/org/apache/streampipes/rest/impl/datalake/DataLakeWidgetResource.java
index 9a87047..e8a2525 100644
--- a/streampipes-rest/src/main/java/org/apache/streampipes/rest/impl/datalake/DataLakeWidgetResource.java
+++ b/streampipes-rest/src/main/java/org/apache/streampipes/rest/impl/datalake/DataLakeWidgetResource.java
@@ -52,7 +52,7 @@ public class DataLakeWidgetResource extends AbstractRestResource {
   @Path("/{widgetId}")
   public Response modifyDataExplorerWidget(DataExplorerWidgetModel dataExplorerWidgetModel) {
     getDataExplorerWidgetStorage().updateDataExplorerWidget(dataExplorerWidgetModel);
-    return ok();
+    return ok(getDataExplorerWidgetStorage().getDataExplorerWidget(dataExplorerWidgetModel.getId()));
   }
 
   @DELETE
diff --git a/ui/package.json b/ui/package.json
index b58c3a5..02ef3ab 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -43,7 +43,7 @@
     "angular-gridster2": "8.3.0",
     "angular-loading-bar": "0.8.0",
     "angular-material-icons": "0.4.0",
-    "angular-plotly.js": "1.5.0",
+    "angular-plotly.js": "^4.0.0",
     "angular-tree-component": "8.5.6",
     "angular-ui-tree": "2.9.0",
     "angular2-uuid": "1.1.1",
@@ -78,7 +78,7 @@
     "ngx-quill": "12.0.1",
     "ngx-showdown": "5.1.0",
     "path": "^0.12.7",
-    "plotly.js": "1.52.2",
+    "plotly.js": "^2.3.1",
     "prismjs": "1.16.0",
     "quill": "1.3.7",
     "roboto-fontface": "0.10.0",
diff --git a/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.html b/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.html
index 72062f0..601e3e3 100644
--- a/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.html
+++ b/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.html
@@ -35,6 +35,7 @@
                    [cpPosition]="'bottom'"
                    [style.background]="baseAppearanceConfig.backgroundColor" required
                    [cpPresetColors] = "presetColors"
+                   (colorPickerSelect)="triggerViewUpdate()"
                    autocomplete="off"/>
         </mat-form-field>
     </div>
@@ -48,6 +49,7 @@
                    [style.background]="baseAppearanceConfig.textColor"
                    required
                    [cpPresetColors] = "presetColors"
+                   (colorPickerSelect)="triggerViewUpdate()"
                    autocomplete="off"/>
         </mat-form-field>
     </div>
diff --git a/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.ts b/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.ts
index 47dcbca..e6eecfe 100644
--- a/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.ts
+++ b/ui/src/app/data-explorer/components/designer-panel/appearance-settings/data-explorer-widget-appearance-settings.component.ts
@@ -19,6 +19,7 @@
 import {Component, Input, OnInit} from '@angular/core';
 import {DataExplorerWidgetModel} from "../../../../core-model/gen/streampipes-model";
 import {WidgetBaseAppearanceConfig} from "../../../models/dataview-dashboard.model";
+import { WidgetConfigurationService } from '../../../services/widget-configuration.service';
 
 @Component({
   selector: 'sp-data-explorer-widget-appearance-settings',
@@ -28,12 +29,23 @@ import {WidgetBaseAppearanceConfig} from "../../../models/dataview-dashboard.mod
 export class DataExplorerWidgetAppearanceSettingsComponent implements OnInit {
 
   @Input() baseAppearanceConfig: WidgetBaseAppearanceConfig;
+  @Input() widgetId: string;
 
   presetColors: Array<any> = ["#39B54A", "#1B1464", "#f44336", "#4CAF50", "#FFEB3B", "#FFFFFF", "#000000"];
 
+
+  constructor(private widgetConfigurationService: WidgetConfigurationService) {
+
+  }
+
   ngOnInit(): void {
 
   }
 
+  triggerViewUpdate() {
+    console.log("trigger view update");
+    this.widgetConfigurationService.notify({widgetId: this.widgetId, refreshView: true, refreshData: false });
+  }
+
 
 }
diff --git a/ui/src/app/data-explorer/components/designer-panel/data-explorer-designer-panel.component.html b/ui/src/app/data-explorer/components/designer-panel/data-explorer-designer-panel.component.html
index cbdee90..2e3384f 100644
--- a/ui/src/app/data-explorer/components/designer-panel/data-explorer-designer-panel.component.html
+++ b/ui/src/app/data-explorer/components/designer-panel/data-explorer-designer-panel.component.html
@@ -34,7 +34,6 @@
                 </sp-data-explorer-widget-data-settings>
             </div>
             <div *ngIf="selectedIndex == 1">
-                Visualization
                 <div *ngIf="currentlyConfiguredWidget.widgetType === 'table'" class="h-100 p-0">
                     <sp-data-explorer-table-widget-config [currentlyConfiguredWidget]="currentlyConfiguredWidget" [dataLakeMeasure]="dataLakeMeasure">
 
@@ -48,6 +47,7 @@
             </div>
             <div *ngIf="selectedIndex == 2">
                 <sp-data-explorer-widget-appearance-settings
+                        [widgetId]="currentlyConfiguredWidget._id"
                         [baseAppearanceConfig]="currentlyConfiguredWidget.baseAppearanceConfig">
 
                 </sp-data-explorer-widget-appearance-settings>
diff --git a/ui/src/app/data-explorer/components/grid/data-explorer-dashboard-grid.component.ts b/ui/src/app/data-explorer/components/grid/data-explorer-dashboard-grid.component.ts
index 1c9ddf2..72b10c0 100644
--- a/ui/src/app/data-explorer/components/grid/data-explorer-dashboard-grid.component.ts
+++ b/ui/src/app/data-explorer/components/grid/data-explorer-dashboard-grid.component.ts
@@ -157,7 +157,9 @@ export class DataExplorerDashboardGridComponent implements OnInit, OnChanges {
 
   updateAllWidgets() {
     this.configuredWidgets.forEach((value, key) => {
-      this.dataViewDataExplorerService.updateWidget(value).subscribe();
+      this.dataViewDataExplorerService.updateWidget(value).subscribe(response => {
+        value._rev = response._rev;
+      });
     });
   }
 
diff --git a/ui/src/app/data-explorer/components/panel/data-explorer-dashboard-panel.component.ts b/ui/src/app/data-explorer/components/panel/data-explorer-dashboard-panel.component.ts
index 8ea99af..476d62b 100644
--- a/ui/src/app/data-explorer/components/panel/data-explorer-dashboard-panel.component.ts
+++ b/ui/src/app/data-explorer/components/panel/data-explorer-dashboard-panel.component.ts
@@ -97,7 +97,8 @@ export class DataExplorerDashboardPanelComponent implements OnInit {
 
   updateDashboard(closeEditMode?: boolean) {
     this.dataViewDataExplorerService.updateDashboard(this.dashboard).subscribe(result => {
-      this.refreshDashboardService.notify(this.dashboard._id);
+      this.dashboard._rev = result._rev;
+      //this.refreshDashboardService.notify(this.dashboard._id);
       // TODO delete widgets
       this.dashboardGrid.updateAllWidgets();
         // if (this.widgetsToUpdate.size > 0) {
diff --git a/ui/src/app/data-explorer/components/widgets/base/base-data-explorer-widget.ts b/ui/src/app/data-explorer/components/widgets/base/base-data-explorer-widget.ts
index 42acfa6..3b68f8f 100644
--- a/ui/src/app/data-explorer/components/widgets/base/base-data-explorer-widget.ts
+++ b/ui/src/app/data-explorer/components/widgets/base/base-data-explorer-widget.ts
@@ -36,6 +36,7 @@ import {
 } from "../../../../core-model/gen/streampipes-model";
 import {WidgetConfigurationService} from "../../../services/widget-configuration.service";
 import {DashboardItem, TimeSettings} from "../../../../dashboard/models/dashboard.model";
+import { ResizeService } from '../../../services/resize.service';
 
 @Directive()
 export abstract class BaseDataExplorerWidget<T extends DataExplorerWidgetModel> implements OnInit, OnChanges, OnDestroy {
@@ -63,7 +64,8 @@ export abstract class BaseDataExplorerWidget<T extends DataExplorerWidgetModel>
 
   constructor(protected dataLakeRestService: DatalakeRestService,
               protected dialog: MatDialog,
-              protected widgetConfigurationService: WidgetConfigurationService) {
+              protected widgetConfigurationService: WidgetConfigurationService,
+              protected resizeService: ResizeService) {
 
   }
 
@@ -78,7 +80,7 @@ export abstract class BaseDataExplorerWidget<T extends DataExplorerWidgetModel>
           this.refreshView();
         }
       }
-    })
+    });
   }
 
   ngOnDestroy(): void {
@@ -99,8 +101,9 @@ export abstract class BaseDataExplorerWidget<T extends DataExplorerWidgetModel>
   }
 
   ngOnChanges(changes: SimpleChanges) {
-    console.log(changes);
-    this.timeSettings = changes.timeSettings.currentValue;
+    if (changes.timeSettings) {
+      this.timeSettings = changes.timeSettings.currentValue;
+    }
     this.updateData();
   }
 
diff --git a/ui/src/app/data-explorer/components/widgets/image/image-widget.component.ts b/ui/src/app/data-explorer/components/widgets/image/image-widget.component.ts
index 76471d3..2ab2a16 100644
--- a/ui/src/app/data-explorer/components/widgets/image/image-widget.component.ts
+++ b/ui/src/app/data-explorer/components/widgets/image/image-widget.component.ts
@@ -25,6 +25,7 @@ import {MatDialog} from '@angular/material/dialog';
 import {EventPropertyUnion, EventSchema} from '../../../../core-model/gen/streampipes-model';
 import {ImageWidgetModel} from "./model/image-widget.model";
 import {WidgetConfigurationService} from "../../../services/widget-configuration.service";
+import { ResizeService } from '../../../services/resize.service';
 
 @Component({
   selector: 'sp-data-explorer-image-widget',
@@ -47,8 +48,9 @@ export class ImageWidgetComponent extends BaseDataExplorerWidget<ImageWidgetMode
   constructor(
       protected dataLakeRestService: DatalakeRestService,
       protected dialog: MatDialog,
-      widgetConfigurationService: WidgetConfigurationService) {
-    super(dataLakeRestService, dialog, widgetConfigurationService);
+      widgetConfigurationService: WidgetConfigurationService,
+      resizeService: ResizeService) {
+    super(dataLakeRestService, dialog, widgetConfigurationService, resizeService);
   }
 
   ngOnInit(): void {
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.html b/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.html
index 81b48a2..f37e87c 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.html
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.html
@@ -17,6 +17,16 @@
   -->
 
 <div fxFlex="100" fxLayout="column" class="ml-0 mr-0">
+
+    <mat-form-field color="accent" fxFlex="100">
+        <mat-label>Mode</mat-label>
+        <mat-select [(value)]="currentlyConfiguredWidget.dataConfig.chartMode" (selectionChange)="triggerViewRefresh()">
+            <mat-option [value]="'lines'">Line</mat-option>
+            <mat-option [value]="'markers'">Dots</mat-option>
+            <mat-option [value]="'lines+markers'">Line+Dots</mat-option>
+        </mat-select>
+    </mat-form-field>
+
     <sp-select-properties
             label="Select Properties"
             multiple=true
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.ts b/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.ts
index e182213..d8a15cb 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.ts
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/config/line-chart-widget-config.component.ts
@@ -72,5 +72,4 @@ export class LineChartWidgetConfigComponent extends BaseWidgetConfig<LineChartWi
   toggleLabelingMode() {
     //this.triggerViewRefresh();
   }
-
 }
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.css b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.css
index 396e87a..d5ac69a 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.css
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.css
@@ -30,7 +30,7 @@
 .plotly-container {
     width: 100%;
     align-self:start;
-    height: calc(100% - 40px);
+    height: 100%;
 }
 .labeling-active {
     width: 85%;
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.html b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.html
index b0cfbbf..facd55c 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.html
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.html
@@ -16,9 +16,9 @@
   ~
   -->
 
-<div class="widget-content">
-    <div class="widget-inner-content h-100 overflow-y-hidden">
-        <sp-load-data-spinner *ngIf="showIsLoadingData"></sp-load-data-spinner>
+<div fxLayout="column" fxFlex="100" [ngStyle]="{background: dataExplorerWidget.baseAppearanceConfig.backgroundColor, color: dataExplorerWidget.baseAppearanceConfig.textColor}">
+
+        <sp-load-data-spinner *ngIf="showIsLoadingData" class="h-100"></sp-load-data-spinner>
         <sp-no-data-in-date-range *ngIf="showNoDataInDateRange" [viewDateRange]="timeSettings"></sp-no-data-in-date-range>
 
         <sp-select-label *ngIf="dataExplorerWidget.dataConfig.labelingModeOn"
@@ -27,15 +27,15 @@
         </sp-select-label>
 
         <plotly-plot *ngIf="data !== undefined && !showNoDataInDateRange && !showIsLoadingData"
+                     [divId]="dataExplorerWidget._id"
                      class="plotly-container"
                      [class.labeling-active]="dataExplorerWidget.dataConfig.labelingModeOn"
                      [data]="data"
                      [layout]="graph.layout"
                      [config]="graph.config"
                      (selected)="selectDataPoints($event)"
-                     (plotly_click)="changeLabelOfArea($event)">
+                     (plotlyClick)="changeLabelOfArea($event)">
             <!--                     (relayout)="handleDefaultModeBarButtonClicks($event)"-->
 
         </plotly-plot>
-    </div>
 </div>
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.ts b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.ts
index 8877806..bafe107 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.ts
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/line-chart-widget.component.ts
@@ -16,18 +16,18 @@
  *
  */
 
-import {Component, OnInit, Renderer2} from '@angular/core';
-import {MatDialog} from '@angular/material/dialog';
-import {DataResult} from '../../../../core-model/datalake/DataResult';
-import {GroupedDataResult} from '../../../../core-model/datalake/GroupedDataResult';
-import {DatalakeRestService} from '../../../../core-services/datalake/datalake-rest.service';
-import {ColorService} from './services/color.service';
-import {BaseDataExplorerWidget} from '../base/base-data-explorer-widget';
-import {Label} from '../../../../core-model/gen/streampipes-model';
-import {ResizeService} from '../../../services/resize.service';
-import {LabelService} from '../../../../core-ui/labels/services/label.service';
-import {LineChartWidgetModel} from "./model/line-chart-widget.model";
-import {WidgetConfigurationService} from "../../../services/widget-configuration.service";
+import { Component, OnInit, Renderer2 } from '@angular/core';
+import { MatDialog } from '@angular/material/dialog';
+import { DataResult } from '../../../../core-model/datalake/DataResult';
+import { GroupedDataResult } from '../../../../core-model/datalake/GroupedDataResult';
+import { DatalakeRestService } from '../../../../core-services/datalake/datalake-rest.service';
+import { ColorService } from './services/color.service';
+import { BaseDataExplorerWidget } from '../base/base-data-explorer-widget';
+import { Label } from '../../../../core-model/gen/streampipes-model';
+import { ResizeService } from '../../../services/resize.service';
+import { LabelService } from '../../../../core-ui/labels/services/label.service';
+import { LineChartWidgetModel } from './model/line-chart-widget.model';
+import { WidgetConfigurationService } from '../../../services/widget-configuration.service';
 
 @Component({
   selector: 'sp-data-explorer-line-chart-widget',
@@ -38,18 +38,10 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
 
   data: any[] = undefined;
   colorPropertyStringValues: any[] = undefined;
-  //availableProperties: EventPropertyUnion[] = [];
-  //availableNoneNumericColumns: EventPropertyUnion[] = [];
-  //selectedLineChartProperties: EventPropertyUnion[] = [];
-  //selectedBackgroundColorProperty: EventPropertyUnion = undefined;
-  //dimensionProperties: EventPropertyUnion[] = [];
-
-  //yKeys: string[] = [];
-  //xKey: string;
   private backgroundColorPropertyKey: string = undefined;
 
   advancedSettingsActive = false;
-  showBackgroundColorProperty  = true;
+  showBackgroundColorProperty = true;
 
   selectedStartX = undefined;
   selectedEndX = undefined;
@@ -57,11 +49,6 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
 
   selectedLabel;
 
-  //aggregationValue = 1;
-  //aggregationTimeUnit = 's';
-  //groupValue = 'None';
-  //showCountValue = false;
-
   // this can be set to scale the line chart according to the layout
   offsetRightLineChart = 10;
 
@@ -70,51 +57,23 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
               public colorService: ColorService,
               public renderer: Renderer2,
               protected dataLakeRestService: DatalakeRestService,
-              private resizeService: ResizeService,
               public labelService: LabelService,
-              widgetConfigurationService: WidgetConfigurationService) {
-    super(dataLakeRestService, dialog, widgetConfigurationService);
+              widgetConfigurationService: WidgetConfigurationService,
+              resizeService: ResizeService) {
+    super(dataLakeRestService, dialog, widgetConfigurationService, resizeService);
   }
 
   // indicator variable if labeling mode is activated
   //labelingModeOn = false;
 
-  updatemenus = [
-    {
-      buttons: [
-        {
-          args: ['mode', 'lines'],
-          label: 'Line',
-          method: 'restyle'
-        },
-        {
-          args: ['mode', 'markers'],
-          label: 'Dots',
-          method: 'restyle'
-        },
-
-        {
-          args: ['mode', 'lines+markers'],
-          label: 'Dots + Lines',
-          method: 'restyle'
-        }
-      ],
-      direction: 'left',
-      pad: {'r': 10, 't': 10},
-      showactive: true,
-      type: 'buttons',
-      x: 0.0,
-      xanchor: 'left',
-      y: 1.3,
-      yanchor: 'top',
-      font: {color: '#000'},
-      bgcolor: '#fafafa',
-      bordercolor: '#000'
-    }
-  ];
+  updatemenus = [];
 
   graph = {
+
     layout: {
+      font: {
+        color: '#FFF'
+      },
       autosize: true,
       plot_bgcolor: '#fff',
       paper_bgcolor: '#fff',
@@ -144,6 +103,40 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
 
 
   ngOnInit(): void {
+    this.updatemenus = [{
+      buttons: [
+        {
+          args: ['mode', 'lines'],
+          label: 'Line',
+          method: 'restyle'
+        },
+        {
+          args: ['mode', 'markers'],
+          label: 'Dots',
+          method: 'restyle'
+        },
+
+        {
+          args: ['mode', 'lines+markers'],
+          label: 'Dots + Lines',
+          method: 'restyle'
+        }
+      ],
+      direction: 'left',
+      pad: {'r': 10, 't': 10},
+      showactive: true,
+      type: 'buttons',
+      x: 0.0,
+      xanchor: 'left',
+      y: 1.3,
+      yanchor: 'top',
+      font: {color: this.dataExplorerWidget.baseAppearanceConfig.textColor},
+      bgcolor: this.dataExplorerWidget.baseAppearanceConfig.backgroundColor,
+      bordercolor: '#000'
+    }];
+
+    this.updateAppearance();
+
     super.ngOnInit();
     this.updateData();
     this.resizeService.resizeSubject.subscribe(info => {
@@ -157,7 +150,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
     });
   }
 
-  private processNoneGroupedData(res: DataResult) {
+  private processNonGroupedData(res: DataResult) {
     if (res.total === 0) {
       this.setShownComponents(true, false, false);
     } else {
@@ -184,7 +177,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
       this.data = this.displayGroupedData(tmp);
 
       if (this.data !== undefined &&
-        this.data['colorPropertyStringValues'] !== undefined && this.data['colorPropertyStringValues'].length > 0) {
+          this.data['colorPropertyStringValues'] !== undefined && this.data['colorPropertyStringValues'].length > 0) {
         this.addInitialColouredShapesToGraph(this.colorPropertyStringValues, this.colorService.getColor);
       }
 
@@ -262,8 +255,8 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
         colorFunction = this.colorService.getColor;
       }
 
-        // Add labes and colors for each series of the line chart
-        data.forEach(serie => {
+      // Add labes and colors for each series of the line chart
+      data.forEach(serie => {
         // add custom data property in order to store colorPropertyStringValues in graph
         if (newColorPropertyStringValues !== undefined && newColorPropertyStringValues.length !== 0) {
           serie['customdata'] = newColorPropertyStringValues;
@@ -337,13 +330,20 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
     columnsContainingNumbers.forEach(key => {
       const headerName = data.headers[key];
       tmpLineChartTraces[key] = {
-        type: 'scatter', mode: 'lines', name: headerName, connectgaps: false, x: [], y: []};
+        type: 'scatter',
+        mode: this.dataExplorerWidget.dataConfig.chartMode,
+        name: headerName,
+        connectgaps: false,
+        x: [],
+        y: []
+      };
     });
 
     columnsContainingStrings.forEach(key => {
       const headerName = data.headers[key];
       tmpLineChartTraces[key] = {
-        name: headerName, x: [], y: []};
+        name: headerName, x: [], y: []
+      };
     });
 
     // fill line chart traces with data
@@ -373,7 +373,6 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
   }
 
 
-
   changeLabelOfArea($event) {
     const selected = $event.points[0];
     const allData = selected.fullData;
@@ -471,7 +470,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
 
         // fetching path of labeling button icon
         const path = modeBarButtons[i].getElementsByClassName('icon').item(0)
-          .getElementsByTagName('path').item(0);
+            .getElementsByTagName('path').item(0);
 
         // adding 'clicked' to class list
         modeBarButtons[i].classList.add('clicked');
@@ -496,7 +495,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
 
         // fetching path of labeling button icon
         const path = modeBarButtons[i].getElementsByClassName('icon').item(0)
-          .getElementsByTagName('path').item(0);
+            .getElementsByTagName('path').item(0);
 
         // removing 'clicked' from class list
         modeBarButtons[i].classList.remove('clicked');
@@ -516,11 +515,18 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
     const startdate = new Date(start_X).getTime() - 1;
     const enddate = new Date(end_X).getTime() + 1;
 
-    this.dataLakeRestService.saveLabelsInDatabase(this.data['measureName'], 'sp_internal_label', startdate, enddate, label, this.dataExplorerWidget.dataConfig.xKey).subscribe(
-      res => {
-        // TODO add pop up similar to images
-        // console.log('Successfully wrote label ' + currentLabel + ' into database.');
-      }
+    this.dataLakeRestService.saveLabelsInDatabase(
+        this.data['measureName'],
+        'sp_internal_label',
+        startdate,
+        enddate,
+        label,
+        this.dataExplorerWidget.dataConfig.xKey
+    ).subscribe(
+        res => {
+          // TODO add pop up similar to images
+          // console.log('Successfully wrote label ' + currentLabel + ' into database.');
+        }
     );
   }
 
@@ -548,7 +554,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
     }
   }
 
-  private addShapeToGraph(start, end, color, initial= false) {
+  private addShapeToGraph(start, end, color, initial = false) {
     start = new Date(start).getTime();
     end = new Date(end).getTime();
 
@@ -638,7 +644,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
       this.dataLakeRestService.getDataAutoAggregation(
           this.dataLakeMeasure.measureName, this.timeSettings.startTime, this.timeSettings.endTime)
           .subscribe((res: DataResult) => {
-            this.processNoneGroupedData(res);
+            this.processNonGroupedData(res);
           });
     } else {
       if (this.dataExplorerWidget.dataConfig.groupValue === 'None') {
@@ -647,7 +653,7 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
             this.dataLakeMeasure.measureName, this.timeSettings.startTime, this.timeSettings.endTime,
             this.dataExplorerWidget.dataConfig.aggregationTimeUnit, this.dataExplorerWidget.dataConfig.aggregationValue)
             .subscribe((res: DataResult) => {
-              this.processNoneGroupedData(res);
+              this.processNonGroupedData(res);
             });
       } else {
         // this.dataLakeRestService.getGroupedData(
@@ -660,7 +666,20 @@ export class LineChartWidgetComponent extends BaseDataExplorerWidget<LineChartWi
     }
   }
 
+  updateAppearance() {
+    this.graph.layout.paper_bgcolor = this.dataExplorerWidget.baseAppearanceConfig.backgroundColor;
+    this.graph.layout.plot_bgcolor = this.dataExplorerWidget.baseAppearanceConfig.backgroundColor;
+    this.graph.layout.font.color = this.dataExplorerWidget.baseAppearanceConfig.textColor;
+    if (this.data) {
+      this.data.forEach(d => d.mode = this.dataExplorerWidget.dataConfig.chartMode);
+    }
+  }
+
   refreshView() {
+    this.updateAppearance();
+    if (this.data && !this.showNoDataInDateRange && !this.showIsLoadingData) {
+      window.Plotly.restyle(this.dataExplorerWidget._id, this.graph, 0);
+    }
     //this.toggleLabelingMode();
   }
 }
diff --git a/ui/src/app/data-explorer/components/widgets/line-chart/model/line-chart-widget.model.ts b/ui/src/app/data-explorer/components/widgets/line-chart/model/line-chart-widget.model.ts
index 93bb6fc..6c01c28 100644
--- a/ui/src/app/data-explorer/components/widgets/line-chart/model/line-chart-widget.model.ts
+++ b/ui/src/app/data-explorer/components/widgets/line-chart/model/line-chart-widget.model.ts
@@ -37,6 +37,7 @@ export interface LineChartDataConfig {
   xKey: string;
   backgroundColorPropertyKey: string;
   labelingModeOn: boolean;
+  chartMode: string;
 }
 
 export interface LineChartWidgetModel extends DataExplorerWidgetModel {
diff --git a/ui/src/app/data-explorer/components/widgets/table/config/table-widget-config.component.ts b/ui/src/app/data-explorer/components/widgets/table/config/table-widget-config.component.ts
index c76c3b2..11c6366 100644
--- a/ui/src/app/data-explorer/components/widgets/table/config/table-widget-config.component.ts
+++ b/ui/src/app/data-explorer/components/widgets/table/config/table-widget-config.component.ts
@@ -37,7 +37,6 @@ export class TableWidgetConfigComponent extends BaseWidgetConfig<TableWidgetMode
   }
 
   ngOnInit(): void {
-    console.log(this.currentlyConfiguredWidget);
     if (!this.currentlyConfiguredWidget.dataConfig.availableColumns) {
       this.currentlyConfiguredWidget.dataConfig.availableColumns = [this.getTimestampProperty(this.dataLakeMeasure.eventSchema)];
       this.currentlyConfiguredWidget.dataConfig.availableColumns = this.currentlyConfiguredWidget.dataConfig.availableColumns.concat(this.getValuePropertyKeys(this.dataLakeMeasure.eventSchema));
diff --git a/ui/src/app/data-explorer/components/widgets/table/table-widget.component.ts b/ui/src/app/data-explorer/components/widgets/table/table-widget.component.ts
index 77cb5d9..8a76f61 100644
--- a/ui/src/app/data-explorer/components/widgets/table/table-widget.component.ts
+++ b/ui/src/app/data-explorer/components/widgets/table/table-widget.component.ts
@@ -25,6 +25,7 @@ import {DatalakeRestService} from '../../../../core-services/datalake/datalake-r
 import {BaseDataExplorerWidget} from '../base/base-data-explorer-widget';
 import {WidgetConfigurationService} from "../../../services/widget-configuration.service";
 import {TableWidgetModel} from "./model/table-widget.model";
+import { ResizeService } from '../../../services/resize.service';
 
 @Component({
   selector: 'sp-data-explorer-table-widget',
@@ -35,16 +36,13 @@ export class TableWidgetComponent extends BaseDataExplorerWidget<TableWidgetMode
 
   @ViewChild(MatSort, {static: true}) sort: MatSort;
 
-  //availableColumns: EventPropertyUnion[];
-  //selectedColumns: EventPropertyUnion[];
-  //columnNames: string[];
-
   dataSource = new MatTableDataSource();
 
   constructor(protected dataLakeRestService: DatalakeRestService,
               protected dialog: MatDialog,
-              widgetConfigurationService: WidgetConfigurationService) {
-    super(dataLakeRestService, dialog, widgetConfigurationService);
+              widgetConfigurationService: WidgetConfigurationService,
+              resizeService: ResizeService) {
+    super(dataLakeRestService, dialog, widgetConfigurationService, resizeService);
   }
 
   ngOnInit(): void {
diff --git a/ui/src/app/data-explorer/services/refresh-dashboard.service.ts b/ui/src/app/data-explorer/services/refresh-dashboard.service.ts
index 26b7f3a..cfe8129 100644
--- a/ui/src/app/data-explorer/services/refresh-dashboard.service.ts
+++ b/ui/src/app/data-explorer/services/refresh-dashboard.service.ts
@@ -16,13 +16,13 @@
  *
  */
 
-import {Injectable} from '@angular/core';
-import {ReplaySubject} from 'rxjs';
+import { Injectable } from '@angular/core';
+import { Subject } from 'rxjs';
 
 @Injectable()
 export class RefreshDashboardService {
 
-    public refreshSubject: ReplaySubject<string> = new ReplaySubject<string>();
+    public refreshSubject: Subject<string> = new Subject<string>();
 
     public notify(currentDashboard: string): void {
         this.refreshSubject.next(currentDashboard);
diff --git a/ui/src/app/data-explorer/services/resize.service.ts b/ui/src/app/data-explorer/services/resize.service.ts
index 21b5c0b..cbda3d9 100644
--- a/ui/src/app/data-explorer/services/resize.service.ts
+++ b/ui/src/app/data-explorer/services/resize.service.ts
@@ -17,13 +17,13 @@
  */
 
 import {Injectable} from '@angular/core';
-import {ReplaySubject} from 'rxjs';
+import { ReplaySubject, Subject } from 'rxjs';
 import {GridsterInfo} from '../../dashboard/models/gridster-info.model';
 
 @Injectable()
 export class ResizeService {
 
-    public resizeSubject: ReplaySubject<GridsterInfo> = new ReplaySubject<GridsterInfo>();
+    public resizeSubject: Subject<GridsterInfo> = new Subject<GridsterInfo>();
 
     public notify(info: GridsterInfo): void {
         this.resizeSubject.next(info);

[incubator-streampipes] 02/03: [STREAMPIPES-402] Refactor data view dialog to use global dialog template

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit 165743e682d00771376c7f1ec689f47ca017b441
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Thu Aug 12 21:39:12 2021 +0200

    [STREAMPIPES-402] Refactor data view dialog to use global dialog template
---
 .../data-explorer-dashboard-overview.component.ts  | 30 +++++++-----
 ...a-explorer-edit-data-view-dialog.component.html | 55 ++++++++++------------
 ...-explorer-edit-data-view-dialog.component.scss} | 35 +++-----------
 ...ata-explorer-edit-data-view-dialog.component.ts | 25 +++++-----
 4 files changed, 61 insertions(+), 84 deletions(-)

diff --git a/ui/src/app/data-explorer/components/overview/data-explorer-dashboard-overview.component.ts b/ui/src/app/data-explorer/components/overview/data-explorer-dashboard-overview.component.ts
index 14032c0..c0e4b00 100644
--- a/ui/src/app/data-explorer/components/overview/data-explorer-dashboard-overview.component.ts
+++ b/ui/src/app/data-explorer/components/overview/data-explorer-dashboard-overview.component.ts
@@ -16,13 +16,14 @@
  *
  */
 
-import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
-import {MatDialog} from '@angular/material/dialog';
-import {MatTableDataSource} from '@angular/material/table';
-import {DataExplorerEditDataViewDialogComponent} from '../../dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component';
-import {DataViewDataExplorerService} from '../../services/data-view-data-explorer.service';
-import {Dashboard} from "../../../dashboard/models/dashboard.model";
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { DataExplorerEditDataViewDialogComponent } from '../../dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component';
+import { DataViewDataExplorerService } from '../../services/data-view-data-explorer.service';
+import { Dashboard } from '../../../dashboard/models/dashboard.model';
 import { Tuple2 } from '../../../core-model/base/Tuple2';
+import { PanelType } from '../../../core-ui/dialog/base-dialog/base-dialog.model';
+import { DialogService } from '../../../core-ui/dialog/base-dialog/base-dialog.service';
 
 @Component({
     selector: 'sp-data-explorer-dashboard-overview',
@@ -41,7 +42,7 @@ export class DataExplorerDashboardOverviewComponent implements OnInit {
     editLabels: boolean;
 
     constructor(private dashboardService: DataViewDataExplorerService,
-                public dialog: MatDialog) {
+                public dialogService: DialogService) {
 
     }
 
@@ -51,7 +52,7 @@ export class DataExplorerDashboardOverviewComponent implements OnInit {
     }
 
     openNewDataViewDialog() {
-        const dataViewDashboard = {} as Dashboard;
+        const dataViewDashboard: Dashboard = {};
         dataViewDashboard.widgets = [];
 
         this.openDataViewModificationDialog(true, dataViewDashboard);
@@ -62,12 +63,15 @@ export class DataExplorerDashboardOverviewComponent implements OnInit {
     }
 
     openDataViewModificationDialog(createMode: boolean, dashboard: Dashboard) {
-        const dialogRef = this.dialog.open(DataExplorerEditDataViewDialogComponent, {
-            width: '70%',
-            panelClass: 'custom-dialog-container'
+        const dialogRef = this.dialogService.open(DataExplorerEditDataViewDialogComponent, {
+            panelType: PanelType.STANDARD_PANEL,
+            title: createMode ? 'New Data View' : 'Edit Data View',
+            width: '70vw',
+            data: {
+                'createMode': createMode,
+                'dashboard': dashboard
+            }
         });
-        dialogRef.componentInstance.createMode = createMode;
-        dialogRef.componentInstance.dashboard = dashboard;
 
         dialogRef.afterClosed().subscribe(result => {
             this.reloadDashboardsEmitter.emit();
diff --git a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.html b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.html
index 5216331..341ec02 100644
--- a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.html
+++ b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.html
@@ -16,40 +16,33 @@
 ~
 -->
 
-<mat-toolbar>
-    <div class="md-toolbar-tools">
-        <h2>{{createMode ? 'New Data View' : 'Edit Data View'}}</h2>
-        <span fxFlex></span>
-        <button mat-icon-button (click)="onCancel()">
-            <i class="material-icons">close</i>
-        </button>
-    </div>
-</mat-toolbar>
-<mat-divider></mat-divider>
-<div mat-dialog-content class="md-dialog-content">
-    <div fxFlex="100">
-        <div fxFlex="100" fxLayout="column" style="margin:5px;width:100%">
-            <mat-form-field class="full-width">
-                <mat-label>Data View Name</mat-label>
-                <input matInput [(ngModel)]="dashboard.name">
-            </mat-form-field>
-            <mat-form-field class="full-width">
-                <mat-label>Description</mat-label>
-                <input matInput [(ngModel)]="dashboard.description">
-            </mat-form-field>
-            <!--<mat-checkbox [(ngModel)]="dashboard.displayHeader">Show name and description in dashboard</mat-checkbox>-->
+<div class="sp-dialog-container">
+    <div class="sp-dialog-content p-15">
+        <div fxFlex="100">
+            <div fxFlex="100" fxLayout="column" style="margin:5px;width:100%">
+                <mat-form-field class="full-width" color="accent">
+                    <mat-label>Data View Name</mat-label>
+                    <input matInput [(ngModel)]="dashboard.name">
+                </mat-form-field>
+                <mat-form-field class="full-width" color="accent">
+                    <mat-label>Description</mat-label>
+                    <input matInput [(ngModel)]="dashboard.description">
+                </mat-form-field>
+                <!--<mat-checkbox [(ngModel)]="dashboard.displayHeader">Show name and description in dashboard</mat-checkbox>-->
 
+            </div>
         </div>
     </div>
-</div>
-<mat-divider></mat-divider>
-<div mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">
-    <button mat-button mat-raised-button class="mat-basic" (click)="onCancel()">
-        Cancel
-    </button>
-    <button mat-button mat-raised-button color="primary" (click)="onSave()">
-        {{createMode ? 'Create' : 'Save'}}
-    </button>
+    <mat-divider></mat-divider>
+    <div class="sp-dialog-actions actions-align-right">
+        <button mat-button mat-raised-button class="mat-basic mr-10"
+                (click)="onCancel()">
+            Close
+        </button>
+        <button mat-button mat-raised-button color="accent" (click)="onSave()">
+            {{createMode ? 'Create' : 'Save'}}
+        </button>
+    </div>
 </div>
 
 
diff --git a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.css b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.scss
similarity index 64%
rename from ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.css
rename to ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.scss
index e00a7b4..2c22a1c 100644
--- a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.css
+++ b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.scss
@@ -16,40 +16,17 @@
  *
  */
 
+@import '../../../../scss/sp/sp-dialog.scss';
+
 .element-margin {
     margin-top:10px;
     margin-bottom:10px;
 }
 
-mat-toolbar {
-    background: #39b54a;
-    color:white;
-}
-
-mat-dialog-content {
-    padding: 24px;
-    -webkit-box-ordinal-group: 2;
-    -webkit-order: 1;
-    order: 1;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-    -webkit-flex-direction: column;
-    flex-direction: column;
-    overflow: auto;
-    -webkit-overflow-scrolling: touch;
-}
-
-.mat-dialog-content {
-    width:100%;
-    height:74%;
-    margin: 0px;
+.mat-radio-button {
+    padding: 10px;
 }
 
-.mat-dialog-actions {
-    margin-bottom:0px;
-    padding-right:10px;
+.mr-10 {
+    margin-right: 10px;
 }
-
-.mat-radio-button {
-    padding: 10px;
-}
\ No newline at end of file
diff --git a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.ts b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.ts
index aa09022..c2004f4 100644
--- a/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.ts
+++ b/ui/src/app/data-explorer/dialogs/edit-dashboard/data-explorer-edit-data-view-dialog.component.ts
@@ -16,23 +16,23 @@
  *
  */
 
-import {Component, OnInit} from '@angular/core';
-import {MatDialogRef} from '@angular/material/dialog';
-import {DataViewDataExplorerService} from '../../services/data-view-data-explorer.service';
-import {Dashboard} from "../../../dashboard/models/dashboard.model";
+import { Component, Input, OnInit } from '@angular/core';
+import { DataViewDataExplorerService } from '../../services/data-view-data-explorer.service';
+import { Dashboard } from '../../../dashboard/models/dashboard.model';
+import { DialogRef } from '../../../core-ui/dialog/base-dialog/dialog-ref';
 
 @Component({
     selector: 'sp-data-explorer-edit-data-view-dialog-component',
     templateUrl: './data-explorer-edit-data-view-dialog.component.html',
-    styleUrls: ['./data-explorer-edit-data-view-dialog.component.css']
+    styleUrls: ['./data-explorer-edit-data-view-dialog.component.scss']
 })
 export class DataExplorerEditDataViewDialogComponent implements OnInit {
 
-    createMode: boolean;
-    dashboard: Dashboard;
+    @Input() createMode: boolean;
+    @Input() dashboard: Dashboard;
 
     constructor(
-        public dialogRef: MatDialogRef<DataExplorerEditDataViewDialogComponent>,
+        private dialogRef: DialogRef<DataExplorerEditDataViewDialogComponent>,
         private dashboardService: DataViewDataExplorerService) {
     }
 
@@ -46,11 +46,14 @@ export class DataExplorerEditDataViewDialogComponent implements OnInit {
 
     onSave(): void {
         if (this.createMode) {
-            this.dashboardService.saveDataView(this.dashboard).subscribe();
+            this.dashboardService.saveDataView(this.dashboard).subscribe(() => {
+                this.dialogRef.close();
+            });
         } else {
-            this.dashboardService.updateDashboard(this.dashboard).subscribe();
+            this.dashboardService.updateDashboard(this.dashboard).subscribe( () => {
+                this.dialogRef.close();
+            });
         }
-        this.dialogRef.close();
     }
 
 

[incubator-streampipes] 03/03: Merge branch 'STREAMPIPES-319' of github.com:apache/incubator-streampipes into STREAMPIPES-319

Posted by ri...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

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

commit 0ca520798d51d8bb9851a79d140378221c166927
Merge: 165743e 6a11f10
Author: Dominik Riemer <ri...@fzi.de>
AuthorDate: Thu Aug 12 21:39:31 2021 +0200

    Merge branch 'STREAMPIPES-319' of github.com:apache/incubator-streampipes into STREAMPIPES-319

 .../container/master/general/ResetManagement.java  |   9 +-
 .../manager/pipeline/PipelineCacheManager.java     |  32 +--
 .../PipelineCanvasMetadataCacheManager.java        |  32 +--
 .../streampipes/rest/impl/PipelineCache.java       |  20 +-
 .../rest/impl/PipelineCanvasMetadataCache.java     |  14 +-
 ui/.gitignore                                      |   5 +
 ui/cypress.json                                    |   2 +-
 ui/cypress/support/builder/PipelineBuilder.ts      |   5 +
 ui/cypress/support/model/PipelineInput.ts          |   1 +
 ui/cypress/support/utils/AdapterUtils.ts           | 217 ++++++++++-----------
 ui/cypress/support/utils/DataLakeUtils.ts          |  13 +-
 ui/cypress/support/utils/FileManagementUtils.ts    |  15 +-
 ui/cypress/support/utils/PipelineUtils.ts          | 112 ++++++-----
 .../support/utils/ProcessingElementTestUtils.ts    |  10 +-
 ui/cypress/support/utils/StaticPropertyUtils.ts    |  23 ++-
 ui/cypress/tests/adapter/fileStream.ts             |  34 ++--
 ui/cypress/tests/adapter/machineDataSimulator.ts   |  21 +-
 .../adapter/randomDataSimulatorStream.spec.ts      |  21 +-
 .../tests/fileManagement/testFileManagement.ts     |  13 +-
 ui/cypress/tests/installation/installation.ts      |  13 +-
 ui/cypress/tests/pipeline/pipelineTest.ts          |  42 ++--
 .../tests/pipelineElement/AllPipelineElements.ts   |  13 +-
 .../tests/pipelineElement/SinglePipelineElement.ts |  11 +-
 .../pipeline-element-icon-stand.component.html     |   6 +-
 ui/src/app/editor/editor.component.html            |   5 +-
 25 files changed, 348 insertions(+), 341 deletions(-)