webapp/src/app/config/config.component.ts

   1 import { Component, OnInit } from "@angular/core";
   2 import { Observable } from 'rxjs/Observable';
   3 import { FormControl, FormGroup, Validators, FormBuilder } from '@angular/forms';
   4
   5 // Import RxJs required methods
   6 import 'rxjs/add/operator/map';
   7 import 'rxjs/add/operator/filter';
   8 import 'rxjs/add/operator/debounceTime';
   9
  10 import { ConfigService, IConfig, IProject, ProjectType, ProjectTypes,
  11     IxdsAgentPackage } from "../services/config.service";
  12 import { XDSServerService, IServerStatus, IXDSAgentInfo } from "../services/xdsserver.service";
  13 import { XDSAgentService, IAgentStatus } from "../services/xdsagent.service";
  14 import { SyncthingService, ISyncThingStatus } from "../services/syncthing.service";
  15 import { AlertService } from "../services/alert.service";
  16 import { ISdk, SdkService } from "../services/sdk.service";
  17
  18 @Component({
  19     templateUrl: './app/config/config.component.html',
  20     styleUrls: ['./app/config/config.component.css']
  21 })
  22
  23 // Inspired from https://embed.plnkr.co/jgDTXknPzAaqcg9XA9zq/
  24 // and from http://plnkr.co/edit/vCdjZM?p=preview
  25
  26 export class ConfigComponent implements OnInit {
  27
  28     config$: Observable<IConfig>;
  29     sdks$: Observable<ISdk[]>;
  30     serverStatus$: Observable<IServerStatus>;
  31     agentStatus$: Observable<IAgentStatus>;
  32     localSTStatus$: Observable<ISyncThingStatus>;
  33
  34     curProj: number;
  35     userEditedLabel: boolean = false;
  36     xdsAgentPackages: IxdsAgentPackage[] = [];
  37     projectTypes = ProjectTypes;
  38
  39     // TODO replace by reactive FormControl + add validation
  40     syncToolUrl: string;
  41     xdsAgentUrl: string;
  42     xdsAgentRetry: string;
  43     projectsRootDir: string;
  44     showApplyBtn = {    // Used to show/hide Apply buttons
  45         "retry": false,
  46         "rootDir": false,
  47     };
  48
  49     addProjectForm: FormGroup;
  50     pathCliCtrl = new FormControl("", Validators.required);
  51     pathSvrCtrl = new FormControl("", Validators.required);
  52
  53     constructor(
  54         private configSvr: ConfigService,
  55         private xdsServerSvr: XDSServerService,
  56         private xdsAgentSvr: XDSAgentService,
  57         private stSvr: SyncthingService,
  58         private sdkSvr: SdkService,
  59         private alert: AlertService,
  60         private fb: FormBuilder
  61     ) {
  62         // Define types (first one is special/placeholder)
  63         this.projectTypes.unshift({value: -1, display: "--Select a type--"});
  64         let selectedType = this.projectTypes[0].value;
  65
  66         this.curProj = 0;
  67         this.addProjectForm = fb.group({
  68             pathCli: this.pathCliCtrl,
  69             pathSvr: this.pathSvrCtrl,
  70             label: ["", Validators.nullValidator],
  71             type: [selectedType, Validators.pattern("[0-9]+")],
  72         });
  73     }
  74
  75     ngOnInit() {
  76         this.config$ = this.configSvr.conf;
  77         this.sdks$ = this.sdkSvr.Sdks$;
  78         this.serverStatus$ = this.xdsServerSvr.Status$;
  79         this.agentStatus$ = this.xdsAgentSvr.Status$;
  80         this.localSTStatus$ = this.stSvr.Status$;
  81
  82         // Bind xdsAgentUrl to baseURL
  83         this.config$.subscribe(cfg => {
  84             this.syncToolUrl = cfg.localSThg.URL;
  85             this.xdsAgentUrl = cfg.xdsAgent.URL;
  86             this.xdsAgentRetry = String(cfg.xdsAgent.retry);
  87             this.projectsRootDir = cfg.projectsRootDir;
  88             this.xdsAgentPackages = cfg.xdsAgentPackages;
  89         });
  90
  91         // Auto create label name
  92         this.pathCliCtrl.valueChanges
  93             .debounceTime(100)
  94             .filter(n => n)
  95             .map(n => "Project_" + n.split('/')[0])
  96             .subscribe(value => {
  97                 if (value && !this.userEditedLabel) {
  98                     this.addProjectForm.patchValue({ label: value });
  99                 }
 100             });
 101
 102         // Select 1 first type by default
 103         // SEB this.typeCtrl.setValue({type: ProjectTypes[0].value});
 104     }
 105
 106     onKeyLabel(event: any) {
 107         this.userEditedLabel = (this.addProjectForm.value.label !== "");
 108     }
 109
 110     submitGlobConf(field: string) {
 111         switch (field) {
 112             case "retry":
 113                 let re = new RegExp('^[0-9]+$');
 114                 let rr = parseInt(this.xdsAgentRetry, 10);
 115                 if (re.test(this.xdsAgentRetry) && rr >= 0) {
 116                     this.configSvr.xdsAgentRetry = rr;
 117                 } else {
 118                     this.alert.warning("Not a valid number", true);
 119                 }
 120                 break;
 121             case "rootDir":
 122                 this.configSvr.projectsRootDir = this.projectsRootDir;
 123                 break;
 124             default:
 125                 return;
 126         }
 127         this.showApplyBtn[field] = false;
 128     }
 129
 130     xdsAgentRestartConn() {
 131         let aUrl = this.xdsAgentUrl;
 132         this.configSvr.syncToolURL = this.syncToolUrl;
 133         this.configSvr.xdsAgentUrl = aUrl;
 134         this.configSvr.loadProjects();
 135     }
 136
 137     onSubmit() {
 138         let formVal = this.addProjectForm.value;
 139
 140         let type = formVal['type'].value;
 141         let numType = Number(formVal['type']);
 142         this.configSvr.addProject({
 143             label: formVal['label'],
 144             pathClient: formVal['pathCli'],
 145             pathServer: formVal['pathSvr'],
 146             type: numType,
 147             // FIXME: allow to set defaultSdkID from New Project config panel
 148         });
 149     }
 150
 151 }