You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@streampipes.apache.org by ze...@apache.org on 2021/06/15 07:07:53 UTC
[incubator-streampipes] branch STREAMPIPES-380 updated: Add header
for schema editor
This is an automated email from the ASF dual-hosted git repository.
zehnder pushed a commit to branch STREAMPIPES-380
in repository https://gitbox.apache.org/repos/asf/incubator-streampipes.git
The following commit(s) were added to refs/heads/STREAMPIPES-380 by this push:
new 921bd50 Add header for schema editor
921bd50 is described below
commit 921bd50ae657a636486b6e6898e7dc751d6b6174
Author: Philipp Zehnder <ze...@fzi.de>
AuthorDate: Tue Jun 15 09:07:33 2021 +0200
Add header for schema editor
---
.../event-schema/event-schema.component.css | 3 --
.../event-schema/event-schema.component.html | 40 +++++-------------
.../event-schema/event-schema.component.ts | 2 +-
.../schema-editor-header.component.css | 3 ++
.../schema-editor-header.component.html | 29 +++++++++++++
.../schema-editor-header.component.ts | 48 ++++++++++++++++++++++
ui/src/app/connect/connect.module.ts | 4 +-
7 files changed, 95 insertions(+), 34 deletions(-)
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.css b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.css
index f5b67dd..16786d5 100644
--- a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.css
+++ b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.css
@@ -167,9 +167,6 @@ pointer-events: none !important;
opacity:0.5;
}
-.add-schema button {
- color: white;
-}
.add-schema button:disabled {
color: rgba(0, 0, 0, 0.26);
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html
index 2d919b3..274d72c 100644
--- a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html
+++ b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.html
@@ -18,37 +18,19 @@
<div fxLayout="row" fxLayoutAlign="center">
<div fxFlex="0 1 80%">
+
<div class="assemblyOptions sp-blue-bg">
- <div fxLayout="row">
- <div fxLayoutAlign="space-between center" class="add-schema" fxFlex="0 1 100%">
- <div>
- <button [disabled]="!isEditable" color="primary" mat-button (click)=addNestedProperty()>
- <mat-icon matTooltip="Add a Nested Property">queue</mat-icon>
- </button>
- <button [disabled]="!isEditable" color="primary" mat-button
- (click)="addStaticValueProperty()">
- <mat-icon matTooltip="Add a static value to event">add</mat-icon>
- </button>
- <button [disabled]="!isEditable" color="primary" mat-button
- (click)=addTimestampProperty()>
- <mat-icon matTooltip="Add timestamp to event schema">access_time</mat-icon>
- </button>
- <button color="primary" mat-button (click)=guessSchema()>
- <mat-icon matTooltip="Refresh Schema">refresh</mat-icon>
- </button>
- <button color="primary" mat-button (click)=togglePreview()>
- <mat-icon matTooltip="Show preview of schema">play_arrow</mat-icon>
- </button>
- </div>
- <div>
- <button style="padding-right:0" color="primary" mat-button [disabled]="countSelected == 0"
- (click)="removeSelectedProperties()">
- <mat-icon matTooltip="Remove selected Properties">delete</mat-icon>
- </button>
- </div>
- </div>
- </div>
+ <sp-schema-editor-header
+ (addNestedPropertyEmitter)="addNestedProperty()"
+ (addStaticValuePropertyEmitter)="addStaticValueProperty()"
+ (addTimestampPropertyEmitter)="addTimestampProperty()"
+ (guessSchemaEmitter)="guessSchema()"
+ (togglePreviewEmitter)="togglePreview()"
+ (removeSelectedPropertiesEmitter)="removeSelectedProperties()"
+ [countSelected]="countSelected">
+ </sp-schema-editor-header>
</div>
+
<div class="sp-blue-border padding">
<sp-loading-message *ngIf="isLoading"></sp-loading-message>
diff --git a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts
index 1760f22..2dc751a 100644
--- a/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts
+++ b/ui/src/app/connect/components/schema-editor/event-schema/event-schema.component.ts
@@ -116,7 +116,7 @@ export class EventSchemaComponent implements OnChanges {
private refreshTree(): void {
this.nodes = new Array<EventProperty>();
this.nodes.push(this.eventSchema as unknown as EventProperty);
- this.tree.treeModel.update();
+ // this.tree.treeModel.update();
}
public addNestedProperty(eventProperty?: EventPropertyNested): void {
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.css b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.css
new file mode 100644
index 0000000..39ec4fd
--- /dev/null
+++ b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.css
@@ -0,0 +1,3 @@
+.add-schema button {
+ color: white;
+}
\ No newline at end of file
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.html b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.html
new file mode 100644
index 0000000..448c0cb
--- /dev/null
+++ b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.html
@@ -0,0 +1,29 @@
+<div fxLayout="row">
+ <div fxLayoutAlign="space-between center" class="add-schema" fxFlex="0 1 100%">
+ <div>
+ <button color="primary" mat-button (click)=addNestedProperty()>
+ <mat-icon matTooltip="Add a Nested Property">queue</mat-icon>
+ </button>
+ <button color="primary" mat-button
+ (click)="addStaticValueProperty()">
+ <mat-icon matTooltip="Add a static value to event">add</mat-icon>
+ </button>
+ <button color="primary" mat-button
+ (click)=addTimestampProperty()>
+ <mat-icon matTooltip="Add timestamp to event schema">access_time</mat-icon>
+ </button>
+ <button color="primary" mat-button (click)=guessSchema()>
+ <mat-icon matTooltip="Refresh Schema">refresh</mat-icon>
+ </button>
+ <button color="primary" mat-button (click)=togglePreview()>
+ <mat-icon matTooltip="Show preview of schema">play_arrow</mat-icon>
+ </button>
+ </div>
+ <div>
+ <button style="padding-right:0" color="primary" mat-button [disabled]="countSelected == 0"
+ (click)="removeSelectedProperties()">
+ <mat-icon matTooltip="Remove selected Properties">delete</mat-icon>
+ </button>
+ </div>
+ </div>
+</div>
diff --git a/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts
new file mode 100644
index 0000000..d4d46ff
--- /dev/null
+++ b/ui/src/app/connect/components/schema-editor/schema-editor-header/schema-editor-header.component.ts
@@ -0,0 +1,48 @@
+import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+
+@Component({
+ selector: 'sp-schema-editor-header',
+ templateUrl: './schema-editor-header.component.html',
+ styleUrls: ['./schema-editor-header.component.css']
+})
+export class SchemaEditorHeaderComponent implements OnInit {
+
+
+ @Input() countSelected: number;
+
+ @Output() addNestedPropertyEmitter = new EventEmitter();
+ @Output() addStaticValuePropertyEmitter = new EventEmitter();
+ @Output() addTimestampPropertyEmitter = new EventEmitter();
+ @Output() guessSchemaEmitter = new EventEmitter();
+ @Output() togglePreviewEmitter = new EventEmitter();
+ @Output() removeSelectedPropertiesEmitter = new EventEmitter();
+
+ constructor() { }
+
+ ngOnInit(): void {
+ }
+
+ public addNestedProperty() {
+ this.addNestedPropertyEmitter.emit();
+ }
+
+ public addStaticValueProperty() {
+ this.addStaticValuePropertyEmitter.emit();
+ }
+
+ public addTimestampProperty() {
+ this.addTimestampPropertyEmitter.emit();
+ }
+
+ public guessSchema() {
+ this.guessSchemaEmitter.emit();
+ }
+
+ public togglePreview() {
+ this.togglePreviewEmitter.emit();
+ }
+
+ public removeSelectedProperties() {
+ this.removeSelectedPropertiesEmitter.emit();
+ }
+}
diff --git a/ui/src/app/connect/connect.module.ts b/ui/src/app/connect/connect.module.ts
index 827dc62..47a4223 100644
--- a/ui/src/app/connect/connect.module.ts
+++ b/ui/src/app/connect/connect.module.ts
@@ -77,6 +77,7 @@ import { FormatConfigurationComponent } from './components/format-configuration/
import { GenericAdapterConfigurationComponent } from './components/generic-adapter-configuration/generic-adapter-configuration.component';
import { ErrorMessageComponent } from './components/schema-editor/error-message/error-message.component';
import { LoadingMessageComponent } from './components/schema-editor/loading-message/loading-message.component';
+import { SchemaEditorHeaderComponent } from './components/schema-editor/schema-editor-header/schema-editor-header.component';
@NgModule({
imports: [
@@ -127,7 +128,8 @@ import { LoadingMessageComponent } from './components/schema-editor/loading-mess
SpecificAdapterConfigurationComponent,
ConfigurationGroupComponent,
ErrorMessageComponent,
- LoadingMessageComponent
+ LoadingMessageComponent,
+ SchemaEditorHeaderComponent
],
providers: [
RestService,