This repository has been archived by the owner on Jun 4, 2019. It is now read-only.
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #168 from mdrillin/viewEditorHeader
TEIIDTOOLS-477 Improvements to application workflow
- Loading branch information
Showing
50 changed files
with
1,718 additions
and
1,510 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Empty file.
50 changes: 50 additions & 0 deletions
50
...app/dataservices/create-virtualization-dialog/create-virtualization-dialog.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,50 @@ | ||
<div class="modal-header"> | ||
<h4 class="modal-title pull-left">{{ title }}</h4> | ||
<button type="button" class="close pull-right" aria-label="Close" (click)="bsModalRef.hide()"> | ||
<span class="pficon pficon-close"></span> | ||
</button> | ||
</div> | ||
<div class="modal-body"> | ||
<strong>{{message}}</strong> | ||
<!-- Form for Virtualization name-description and View name-description --> | ||
<form [formGroup]="virtualizationPropertyForm" class="form-horizontal"> | ||
<!-- -------------- --> | ||
<!-- Virtualization --> | ||
<!-- -------------- --> | ||
<h3>Virtualization</h3> | ||
<div [ngClass]="virtNameValid ? 'form-group' : 'form-group has-error'"> | ||
<label class="col-sm-3 control-label required-pf">Name</label> | ||
<div class="col-sm-8"> | ||
<input class="form-control" formControlName="virtName" title=""> | ||
<div class="help-block" *ngIf="!virtNameValid">{{ virtNameValidationError }}</div> | ||
</div> | ||
</div> | ||
<div [ngClass]="'form-group'"> | ||
<label class="col-sm-3 control-label">Description</label> | ||
<div class="col-sm-8"> | ||
<textarea class="form-control" rows="1" maxlength="256" formControlName="virtDescription" title=""></textarea> | ||
</div> | ||
</div> | ||
<!-- ---- --> | ||
<!-- View --> | ||
<!-- ---- --> | ||
<h3>Virtualization View</h3> | ||
<div [ngClass]="viewNameValid ? 'form-group' : 'form-group has-error'"> | ||
<label class="col-sm-3 control-label required-pf">Name</label> | ||
<div class="col-sm-8"> | ||
<input class="form-control" formControlName="viewName" title=""> | ||
<div class="help-block" *ngIf="!viewNameValid">{{ viewNameValidationError }}</div> | ||
</div> | ||
</div> | ||
<div [ngClass]="'form-group'"> | ||
<label class="col-sm-3 control-label">Description</label> | ||
<div class="col-sm-8"> | ||
<textarea class="form-control" rows="1" maxlength="256" formControlName="viewDescription" title=""></textarea> | ||
</div> | ||
</div> | ||
</form> | ||
</div> | ||
<div class="modal-footer"> | ||
<button i18n="@@createVirtualizationDialog.cancel" type="button" class="btn btn-default" (click)="onCancelSelected()">{{ cancelButtonText }}</button> | ||
<button i18n="@@createVirtualizationDialog.delete" type="button" class="btn btn-primary" (click)="onOkSelected()" [disabled]="!okButtonEnabled">{{ okButtonText }}</button> | ||
</div> |
51 changes: 51 additions & 0 deletions
51
.../dataservices/create-virtualization-dialog/create-virtualization-dialog.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
||
import { HttpModule } from "@angular/http"; | ||
import { BsModalRef, ModalModule } from "ngx-bootstrap"; | ||
import { | ||
ActionModule, | ||
NotificationModule | ||
} from "patternfly-ng"; | ||
import { FormsModule, ReactiveFormsModule } from "@angular/forms"; | ||
import { DataserviceService } from "@dataservices/shared/dataservice.service"; | ||
import { MockDataserviceService } from "@dataservices/shared/mock-dataservice.service"; | ||
import { VdbService } from "@dataservices/shared/vdb.service"; | ||
import { MockVdbService } from "@dataservices/shared/mock-vdb.service"; | ||
import { CreateVirtualizationDialogComponent } from "./create-virtualization-dialog.component"; | ||
import { AppSettingsService } from "@core/app-settings.service"; | ||
import { LoggerService } from "@core/logger.service"; | ||
import { NotifierService } from "@dataservices/shared/notifier.service"; | ||
|
||
describe('CreateVirtualizationDialogComponent', () => { | ||
let component: CreateVirtualizationDialogComponent; | ||
let fixture: ComponentFixture<CreateVirtualizationDialogComponent>; | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
imports: [ | ||
HttpModule, | ||
FormsModule, | ||
ReactiveFormsModule, | ||
ModalModule.forRoot(), | ||
ActionModule, | ||
NotificationModule | ||
], | ||
declarations: [ CreateVirtualizationDialogComponent ], | ||
providers: [ AppSettingsService, BsModalRef, LoggerService, NotifierService, | ||
{ provide: DataserviceService, useClass: MockDataserviceService }, | ||
{ provide: VdbService, useClass: MockVdbService } | ||
] | ||
}) | ||
.compileComponents(); | ||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(CreateVirtualizationDialogComponent); | ||
component = fixture.componentInstance; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should be created', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
}); |
204 changes: 204 additions & 0 deletions
204
...c/app/dataservices/create-virtualization-dialog/create-virtualization-dialog.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,204 @@ | ||
/** | ||
* @license | ||
* Copyright 2017 JBoss Inc | ||
* | ||
* Licensed under the Apache License, Version 2.0 (the "License"); | ||
* you may not use this file except in compliance with the License. | ||
* You may obtain a copy of the License at | ||
* | ||
* http://www.apache.org/licenses/LICENSE-2.0 | ||
* | ||
* Unless required by applicable law or agreed to in writing, software | ||
* distributed under the License is distributed on an "AS IS" BASIS, | ||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||
* See the License for the specific language governing permissions and | ||
* limitations under the License. | ||
*/ | ||
|
||
import { Component, OnInit } from "@angular/core"; | ||
import { Output } from "@angular/core"; | ||
import { EventEmitter } from "@angular/core"; | ||
import { BsModalRef } from "ngx-bootstrap"; | ||
import { LoggerService } from "@core/logger.service"; | ||
import { ViewEditorI18n } from "@dataservices/virtualization/view-editor/view-editor-i18n"; | ||
import { AbstractControl, FormControl, FormGroup } from "@angular/forms"; | ||
import { VdbService } from "@dataservices/shared/vdb.service"; | ||
import { DataserviceService } from "@dataservices/shared/dataservice.service"; | ||
import { CreateVirtualizationResult } from "@dataservices/create-virtualization-dialog/create-virtualization-result.model"; | ||
|
||
@Component({ | ||
selector: "app-create-virtualization-dialog", | ||
templateUrl: "./create-virtualization-dialog.component.html", | ||
styleUrls: ["./create-virtualization-dialog.component.css"] | ||
}) | ||
/** | ||
* CreateVirtualization Dialog. Invoke this from another component as follows: | ||
* | ||
* this.modalRef = this.modalService.show(CreateVirtualizationDialogComponent, {initialState}); | ||
* this.modalRef.content.okAction.take(1).subscribe((createResult) => { | ||
* // do something with dialog result - CreateVirtualizationResult | ||
* }); | ||
* | ||
* The expected initial state is as follows: | ||
* const initialState = { | ||
* title: "The dialog title", | ||
* cancelButtonText: "Text for cancel button", | ||
* confirmButtonText: "Text for confirm button" | ||
* }; | ||
*/ | ||
export class CreateVirtualizationDialogComponent implements OnInit { | ||
|
||
@Output() public okAction: EventEmitter<CreateVirtualizationResult> = new EventEmitter<CreateVirtualizationResult>(); | ||
|
||
public readonly title = ViewEditorI18n.createVirtualizationDialogTitle; | ||
public readonly message = ViewEditorI18n.createVirtualizationDialogMessage; | ||
public readonly cancelButtonText = ViewEditorI18n.cancelButtonText; | ||
public readonly okButtonText = ViewEditorI18n.okButtonText; | ||
public okButtonEnabled = false; | ||
public bsModalRef: BsModalRef; | ||
public virtNameValidationError = ""; | ||
public viewNameValidationError = ""; | ||
public virtualizationPropertyForm: FormGroup; | ||
|
||
private loggerService: LoggerService; | ||
private dataserviceService: DataserviceService; | ||
private vdbService: VdbService; | ||
private serviceVdbName = ""; | ||
|
||
constructor(bsModalRef: BsModalRef, logger: LoggerService, | ||
dataserviceService: DataserviceService, vdbService: VdbService) { | ||
this.bsModalRef = bsModalRef; | ||
this.loggerService = logger; | ||
this.dataserviceService = dataserviceService; | ||
const dService = this.dataserviceService.getSelectedDataservice(); | ||
if ( dService && dService !== null ) { | ||
this.serviceVdbName = dService.getServiceVdbName(); | ||
} | ||
this.vdbService = vdbService; | ||
this.createPropertyForm(); | ||
} | ||
|
||
public ngOnInit(): void { | ||
this.virtualizationPropertyForm.controls["virtName"].setValue(""); | ||
this.virtualizationPropertyForm.controls["virtDescription"].setValue(""); | ||
this.virtualizationPropertyForm.controls["viewName"].setValue(""); | ||
this.virtualizationPropertyForm.controls["viewDescription"].setValue(""); | ||
} | ||
|
||
/* | ||
* Creates the view property form | ||
*/ | ||
private createPropertyForm(): void { | ||
this.virtualizationPropertyForm = new FormGroup({ | ||
virtName: new FormControl( "", this.handleVirtNameChanged.bind( this ) ), | ||
virtDescription: new FormControl(""), | ||
viewName: new FormControl( "", this.handleViewNameChanged.bind( this ) ), | ||
viewDescription: new FormControl("") | ||
}); | ||
} | ||
|
||
/** | ||
* Handler for virtualization name changes. | ||
* @param {AbstractControl} input | ||
*/ | ||
public handleVirtNameChanged( input: AbstractControl ): void { | ||
const self = this; | ||
|
||
this.dataserviceService.isValidName( input.value ).subscribe( | ||
( errorMsg ) => { | ||
if ( errorMsg ) { | ||
// only update if error has changed | ||
if ( errorMsg !== self.virtNameValidationError ) { | ||
self.virtNameValidationError = errorMsg; | ||
} | ||
} else { // name is valid | ||
self.virtNameValidationError = ""; | ||
} | ||
self.setOkButtonEnablement(); | ||
}, | ||
( error ) => { | ||
self.loggerService.error( "[handleNameChanged] Error: %o", error ); | ||
self.virtNameValidationError = "Error validating view name"; | ||
self.setOkButtonEnablement(); | ||
} ); | ||
} | ||
|
||
/** | ||
* Handler for view name changes. Since this will be the first view in the virtualization, | ||
* no need to make a service call - just do some general name checking | ||
* @param {AbstractControl} input | ||
*/ | ||
public handleViewNameChanged( input: AbstractControl ): void { | ||
this.viewNameValidationError = this.validateViewName(input.value); | ||
this.setOkButtonEnablement(); | ||
} | ||
|
||
/** | ||
* OK selected. Emit ViewDefinition with the view, then modal is closed | ||
*/ | ||
public onOkSelected(): void { | ||
const virtName = this.virtualizationPropertyForm.controls["virtName"].value; | ||
const virtDescr = this.virtualizationPropertyForm.controls["virtDescription"].value; | ||
const viewName = this.virtualizationPropertyForm.controls["viewName"].value; | ||
const viewDescr = this.virtualizationPropertyForm.controls["viewDescription"].value; | ||
|
||
const result = new CreateVirtualizationResult(); | ||
result.setVirtualizationName(virtName); | ||
result.setVirtualizationDescription(virtDescr); | ||
result.setViewName(viewName); | ||
result.setViewDescription(viewDescr); | ||
this.okAction.emit(result); | ||
|
||
this.bsModalRef.hide(); | ||
} | ||
|
||
/** | ||
* Cancel selected. The modal is closed. | ||
*/ | ||
public onCancelSelected(): void { | ||
this.bsModalRef.hide(); | ||
} | ||
|
||
/* | ||
* Return the virtualization name valid state | ||
*/ | ||
public get virtNameValid(): boolean { | ||
return this.virtNameValidationError == null || this.virtNameValidationError.length === 0; | ||
} | ||
|
||
/* | ||
* Return the view name valid state | ||
*/ | ||
public get viewNameValid(): boolean { | ||
return this.viewNameValidationError == null || this.viewNameValidationError.length === 0; | ||
} | ||
|
||
/** | ||
* Validate the provided view name. If the name is valid, an empty string will be returned. If the view is invalid, | ||
* the error message is returned. | ||
* @param {string} viewName the view name being validated | ||
* @return {string} the validation message | ||
*/ | ||
private validateViewName( viewName: string ): string { | ||
if ( !viewName || viewName === null || viewName.length === 0 ) { | ||
return "View name cannot be empty"; | ||
} | ||
const isValid = /^\w+$/.test(viewName); | ||
if ( !isValid ) { | ||
return "View name can only contain letters, digits and underscores"; | ||
} | ||
return ""; | ||
} | ||
|
||
/** | ||
* Sets the OK button enablement. Both the virtualization name and view name must be valid. | ||
*/ | ||
private setOkButtonEnablement(): void { | ||
if (this.virtNameValid && this.viewNameValid) { | ||
this.okButtonEnabled = true; | ||
} else { | ||
this.okButtonEnabled = false; | ||
} | ||
} | ||
|
||
} |
Oops, something went wrong.