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