1 import { Component, Input, ViewChild, OnInit } from '@angular/core';
2 import { Observable } from 'rxjs/Observable';
3 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
4 import { FormControl, FormGroup, Validators, ValidationErrors, FormBuilder, ValidatorFn, AbstractControl } from '@angular/forms';
6 // Import RxJs required methods
7 import 'rxjs/add/operator/map';
8 import 'rxjs/add/operator/filter';
9 import 'rxjs/add/operator/debounceTime';
11 import { AlertService, IAlert } from '../../../@core-xds/services/alert.service';
12 import { ProjectService, IProject, ProjectType, ProjectTypes } from '../../../@core-xds/services/project.service';
13 import { XDSConfigService } from '../../../@core-xds/services/xds-config.service';
17 selector: 'xds-project-add-modal',
18 templateUrl: 'project-add-modal.component.html',
19 styleUrls: ['project-add-modal.component.scss'],
21 export class ProjectAddModalComponent implements OnInit {
22 // @Input('server-id') serverID: string;
23 private serverID: string;
26 userEditedLabel = false;
27 projectTypes = Object.assign([], ProjectTypes);
29 addProjectForm: FormGroup;
30 typeCtrl: FormControl;
31 pathCliCtrl: FormControl;
32 pathSvrCtrl: FormControl;
35 private alert: AlertService,
36 private projectSvr: ProjectService,
37 private XdsConfigSvr: XDSConfigService,
38 private fb: FormBuilder,
39 private activeModal: NgbActiveModal,
41 // Define types (first one is special/placeholder)
42 this.projectTypes.unshift({ value: ProjectType.UNSET, display: '--Select a type--' });
44 this.typeCtrl = new FormControl(this.projectTypes[0].value, this.validatorProjType);
45 this.pathCliCtrl = new FormControl('', this.validatorProjPath);
46 this.pathSvrCtrl = new FormControl({ value: '', disabled: true }, this.validatorProjPath);
48 this.addProjectForm = fb.group({
50 pathCli: this.pathCliCtrl,
51 pathSvr: this.pathSvrCtrl,
52 label: ['', Validators.nullValidator],
59 this.serverID = this.XdsConfigSvr.getCurServer().id;
60 this.XdsConfigSvr.onCurServer().subscribe(svr => this.serverID = svr.id);
62 // Auto create label name
63 this.pathCliCtrl.valueChanges
67 const last = n.split('/');
69 if (last.length > 0) {
71 if (nm === '' && last.length > 0) {
75 return 'Project_' + nm;
78 if (value && !this.userEditedLabel) {
79 this.addProjectForm.patchValue({ label: value });
83 // Handle disabling of Server path
84 this.typeCtrl.valueChanges
86 .subscribe(valType => {
87 const dis = (valType === String(ProjectType.SYNCTHING));
88 this.pathSvrCtrl.reset({ value: '', disabled: dis });
93 this.activeModal.close();
96 onKeyLabel(event: any) {
97 this.userEditedLabel = (this.addProjectForm.value.label !== '');
100 onChangeLocalProject(e) {
104 if (this.cancelAction) {
108 const formVal = this.addProjectForm.value;
110 const type = formVal['type'].value;
111 this.projectSvr.add({
112 serverId: this.serverID,
113 label: formVal['label'],
114 pathClient: formVal['pathCli'],
115 pathServer: formVal['pathSvr'],
116 type: formVal['type'],
117 // FIXME: allow to set defaultSdkID from New Project config panel
120 this.alert.info('Project ' + prj.label + ' successfully created.');
123 // Reset Value for the next creation
124 this.addProjectForm.reset();
125 const selectedType = this.projectTypes[0].value;
126 this.addProjectForm.patchValue({ type: selectedType });
130 this.alert.error(err, 60);
135 private validatorProjType(g: FormGroup): ValidationErrors | null {
136 return (g.value !== ProjectType.UNSET) ? null : { validatorProjType: { valid: false } };
139 private validatorProjPath(g: FormGroup): ValidationErrors | null {
140 return (g.disabled || g.value !== '') ? null : { validatorProjPath: { valid: false } };