diff --git a/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.html b/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.html
index be7142b9..7ceb8b9b 100644
--- a/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.html
+++ b/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.html
@@ -69,7 +69,6 @@
{{ title }}
diff --git a/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.ts b/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.ts
index f3379883..ca2b606c 100644
--- a/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.ts
+++ b/ngapp/src/app/dataservices/create-views-dialog/create-views-dialog.component.ts
@@ -54,7 +54,6 @@ export class CreateViewsDialogComponent implements OnInit {
public allViews: NewView[] = [];
public listConfig: ListConfig;
public tableColumns: any[] = [];
- public ngxTableConfig: NgxDataTableConfig;
public tableConfig: TableConfig;
public virtNameValidationError = "";
public virtualizationPropertyForm: FormGroup;
@@ -99,17 +98,15 @@ export class CreateViewsDialogComponent implements OnInit {
{
draggable: false,
name: "Connection",
- prop: "connectionName",
+ prop: "connection",
resizeable: true,
sortable: false,
- maxWidth: "100",
- minWidth: "100",
width: "100"
},
{
draggable: false,
name: "View Name",
- prop: "viewName",
+ prop: "view",
resizeable: true,
sortable: false,
width: "100"
@@ -117,17 +114,12 @@ export class CreateViewsDialogComponent implements OnInit {
{
draggable: false,
name: "Source Node",
- prop: "pathString",
+ prop: "path",
resizeable: true,
sortable: false,
width: "100"
}
];
- this.ngxTableConfig = {
- reorderable: false,
- selectionType: "'single'",
- sorts: [ { prop: "name", dir: "asc" } ],
- } as NgxDataTableConfig;
this.emptyStateConfig = {
title: ViewEditorI18n.noViewsDisplayedMessage
@@ -260,16 +252,13 @@ export class CreateViewsDialogComponent implements OnInit {
* @param {SchemaNode} conn the connection node
*/
private onConnectionDeselected(conn: SchemaNode): void {
- const refreshViews = this.arrayClone(this.allViews);
-
- let i = refreshViews.length;
+ let i = this.allViews.length;
while (i--) {
- if (refreshViews[i].getConnectionName() === conn.getName()) {
- refreshViews.splice(i, 1);
+ if (this.allViews[i].getConnectionName() === conn.getName()) {
+ this.allViews.splice(i, 1);
}
}
-
- this.allViews = refreshViews;
+ this.allViews = [...this.allViews];
}
/**
@@ -374,17 +363,15 @@ export class CreateViewsDialogComponent implements OnInit {
.getConnectionSchema(connName)
.subscribe(
(schemaNodes) => {
- // Copy existing view. Need to reset array to get table to refresh??
- const refreshViews = this.arrayClone(self.allViews);
const newViews: NewView[] = [];
for ( const schemaNode of schemaNodes ) {
const nodePath: string[] = [];
self.generateViewInfos(connName, schemaNode, nodePath, newViews);
}
for (const newView of newViews) {
- refreshViews.push(newView);
+ self.allViews.push(newView);
}
- self.allViews = refreshViews;
+ self.allViews = [...self.allViews];
self.viewsLoadingState = LoadingState.LOADED_VALID;
},
(error) => {
@@ -418,14 +405,4 @@ export class CreateViewsDialogComponent implements OnInit {
}
}
- private arrayClone(oldArray: NewView[]): NewView[] {
- const newArray: NewView[] = [];
- oldArray.forEach((item) => {
- const nView = new NewView();
- Object.assign(nView, item);
- newArray.push(nView);
- });
- return newArray;
- }
-
}
diff --git a/ngapp/src/app/dataservices/create-views-dialog/new-view.model.ts b/ngapp/src/app/dataservices/create-views-dialog/new-view.model.ts
index f6d368d9..37dca688 100644
--- a/ngapp/src/app/dataservices/create-views-dialog/new-view.model.ts
+++ b/ngapp/src/app/dataservices/create-views-dialog/new-view.model.ts
@@ -22,8 +22,8 @@ import { SchemaNode } from "@connections/shared/schema-node.model";
*/
export class NewView {
- private connectionName: string;
- private viewName: string;
+ private connection: string;
+ private view: string;
private viewDescription = "";
private viewSourceNode: SchemaNode;
private nodePath: string[] = [];
@@ -36,28 +36,28 @@ export class NewView {
* @returns {string} the connection name
*/
public getConnectionName(): string {
- return this.connectionName;
+ return this.connection;
}
/**
* @param {string} name the connection name
*/
public setConnectionName( name?: string ): void {
- this.connectionName = name ? name : null;
+ this.connection = name ? name : null;
}
/**
* @returns {string} the view name
*/
public getViewName(): string {
- return this.viewName;
+ return this.view;
}
/**
* @param {string} name the view name
*/
public setViewName( name?: string ): void {
- this.viewName = name ? name : null;
+ this.view = name ? name : null;
}
/**
@@ -91,7 +91,7 @@ export class NewView {
/**
* @returns {string} the stringified node path
*/
- public get pathString(): string {
+ public get path(): string {
let path = "";
const segLength = this.nodePath.length;
for ( let i = 0; i < segLength; i++ ) {
diff --git a/ngapp/src/app/dataservices/virtualization/view-editor/view-editor-part.enum.ts b/ngapp/src/app/dataservices/virtualization/view-editor/view-editor-part.enum.ts
index 226e2c46..824829f3 100644
--- a/ngapp/src/app/dataservices/virtualization/view-editor/view-editor-part.enum.ts
+++ b/ngapp/src/app/dataservices/virtualization/view-editor/view-editor-part.enum.ts
@@ -45,6 +45,11 @@ export enum ViewEditorPart {
/**
* The source of the event is the properties part.
*/
- PROPERTIES = "PROPERTIES"
+ PROPERTIES = "PROPERTIES",
+
+ /**
+ * The source of the event is the properties part.
+ */
+ COLUMNS = "COLUMNS"
}
diff --git a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.css b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.css
index eca6d133..0d7cf1b8 100644
--- a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.css
+++ b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.css
@@ -21,3 +21,10 @@
.property-editors-tab-heading {
font-size: smaller;
}
+
+/*
+ * Adds a space to the right of the icon and before the tab heading.
+ */
+.property-editors-tab-icon:after {
+ margin-right: 2px;
+}
diff --git a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.html b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.html
index 0a0d1465..a94b3df6 100644
--- a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.html
+++ b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.html
@@ -1,13 +1,18 @@
-
- {{tabz?.content}}
+
+
+
+ View
+
+
+
+
+
+ {{columnPropsTabName}}
+
diff --git a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.ts b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.ts
index 8535f0e2..564378f2 100644
--- a/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.ts
+++ b/ngapp/src/app/dataservices/virtualization/view-editor/view-property-editors/view-property-editors.component.ts
@@ -18,9 +18,11 @@
import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { LoggerService } from "@core/logger.service";
import { ViewEditorI18n } from "@dataservices/virtualization/view-editor/view-editor-i18n";
+import { ViewEditorPart } from "@dataservices/virtualization/view-editor/view-editor-part.enum";
import { ViewEditorService } from "@dataservices/virtualization/view-editor/view-editor.service";
import { ViewEditorEvent } from "@dataservices/virtualization/view-editor/event/view-editor-event";
import { Subscription } from "rxjs/Subscription";
+import 'dragula/dist/dragula.css';
@Component({
encapsulation: ViewEncapsulation.None,
@@ -30,28 +32,27 @@ import { Subscription } from "rxjs/Subscription";
})
export class ViewPropertyEditorsComponent implements OnInit, OnDestroy {
+ public readonly columnPropsTabName = ViewEditorI18n.columnPropsTabName;
+
private columnEditorIsEnabled = true;
private readonly editorService: ViewEditorService;
private readonly logger: LoggerService;
private subscription: Subscription;
private viewEditorIsEnabled = true;
- public readonly tabs: any[] = [
+ private readonly viewIndex = 0;
+ private readonly columnIndex = 1;
+
+ /**
+ * The tabs component configuration.
+ */
+ public tabs = [
{
- active: true,
- content: "View properties",
- customClass: "property-editors-tab-heading",
- disabled: !this.viewEditorIsEnabled,
- removable: false,
- title: ViewEditorI18n.viewPropsTabName
+ "active": true // preview
},
{
- content: "Column editor",
- customClass: "property-editors-tab-heading",
- disabled: !this.columnEditorIsEnabled,
- removable: false,
- title: ViewEditorI18n.columnPropsTabName
- }
+ "active": false // message log
+ },
];
constructor( editorService: ViewEditorService,
@@ -69,6 +70,15 @@ export class ViewPropertyEditorsComponent implements OnInit, OnDestroy {
if ( event.typeIsCanvasSelectionChanged() ) {
// TODO set this.viewEditorIsEnabled to true if all canvas selections are views
// TODO set this.columnEditorIsEnabled to true if all canvas selections are columns
+ if ( event.args.length !== 0 ) {
+ if ( event.args[ 0 ] === ViewEditorPart.COLUMNS ) {
+ this.tabs[ this.viewIndex ].active = false;
+ this.tabs[ this.columnIndex ].active = true;
+ } else if ( event.args[ 0 ] === ViewEditorPart.PROPERTIES) {
+ this.tabs[ this.viewIndex ].active = false;
+ this.tabs[ this.columnIndex ].active = true;
+ }
+ }
}
}
@@ -93,4 +103,14 @@ export class ViewPropertyEditorsComponent implements OnInit, OnDestroy {
this.tabs.splice( this.tabs.indexOf( tab ), 1);
}
+ /**
+ * Callback for when a tab is clicked.
+ *
+ * @param tab the tab being select or deselected
+ * @param selected `true` is selected
+ */
+ public tabSelected( tab, selected ): void {
+ tab.active = selected;
+ }
+
}