Add Cross SDKs support (part 2)

11 files changed, 227 insertions, 11 deletions

diff --git a/webapp/src/app/app.module.ts b/webapp/src/app/app.module.ts
index 5c33e43..d4a6918 100644
--- a/webapp/src/app/app.module.ts
+++ b/webapp/src/app/app.module.ts
@@ -19,12 +19,17 @@ import { ConfigComponent } from "./config/config.component";
 import { ProjectCardComponent } from "./projects/projectCard.component";
 import { ProjectReadableTypePipe } from "./projects/projectCard.component";
 import { ProjectsListAccordionComponent } from "./projects/projectsListAccordion.component";
+import { SdkCardComponent } from "./sdks/sdkCard.component";
+import { SdksListAccordionComponent } from "./sdks/sdksListAccordion.component";
+import { SdkSelectDropdownComponent } from "./sdks/sdkSelectDropdown.component";
+
 import { HomeComponent } from "./home/home.component";
 import { BuildComponent } from "./build/build.component";
 import { XDSServerService } from "./common/xdsserver.service";
 import { SyncthingService } from "./common/syncthing.service";
 import { ConfigService } from "./common/config.service";
 import { AlertService } from './common/alert.service';
+import { SdkService } from "./common/sdk.service";
 
 
 
@@ -51,6 +56,9 @@ import { AlertService } from './common/alert.service';
         ProjectCardComponent,
         ProjectReadableTypePipe,
         ProjectsListAccordionComponent,
+        SdkCardComponent,
+        SdksListAccordionComponent,
+        SdkSelectDropdownComponent,
     ],
     providers: [
         AppRoutingProviders,
@@ -61,7 +69,8 @@ import { AlertService } from './common/alert.service';
         XDSServerService,
         ConfigService,
         SyncthingService,
-        AlertService
+        AlertService,
+        SdkService,
     ],
     bootstrap: [AppComponent]
 })
diff --git a/webapp/src/app/build/build.component.html b/webapp/src/app/build/build.component.html
index d2a8da6..2ab7821 100644
--- a/webapp/src/app/build/build.component.html
+++ b/webapp/src/app/build/build.component.html
@@ -21,6 +21,16 @@
         </div>
     </div>
     &nbsp;
+    <div class="row">
+        <div class="col-xs-8">
+            <label>Cross SDK </label>
+            <!-- FIXME why not working ?
+                    <sdk-select-dropdown [sdks]="(sdks$ | async)"></sdk-select-dropdown>
+                    -->
+            <sdk-select-dropdown></sdk-select-dropdown>
+        </div>
+    </div>
+    &nbsp;
     <div class="row ">
         <div class="col-xs-8 pull-left ">
             <label>Sub-directory</label>
diff --git a/webapp/src/app/build/build.component.ts b/webapp/src/app/build/build.component.ts
index a1a965b..a99a1fe 100644
--- a/webapp/src/app/build/build.component.ts
+++ b/webapp/src/app/build/build.component.ts
@@ -8,6 +8,7 @@ import 'rxjs/add/operator/startWith';
 import { XDSServerService, ICmdOutput } from "../common/xdsserver.service";
 import { ConfigService, IConfig, IProject } from "../common/config.service";
 import { AlertService, IAlert } from "../common/alert.service";
+import { SdkService } from "../common/sdk.service";
 
 @Component({
     selector: 'build',
@@ -32,8 +33,11 @@ export class BuildComponent implements OnInit, AfterViewChecked {
     private startTime: Map<string, number> = new Map<string, number>();
 
     // I initialize the app component.
-    constructor(private configSvr: ConfigService, private sdkSvr: XDSServerService,
-        private fb: FormBuilder, private alertSvr: AlertService
+    constructor(private configSvr: ConfigService,
+        private xdsSvr: XDSServerService,
+        private fb: FormBuilder,
+        private alertSvr: AlertService,
+        private sdkSvr: SdkService
     ) {
         this.cmdOutput = "";
         this.confValid = false;
@@ -54,12 +58,12 @@ export class BuildComponent implements OnInit, AfterViewChecked {
         });
 
         // Command output data tunneling
-        this.sdkSvr.CmdOutput$.subscribe(data => {
+        this.xdsSvr.CmdOutput$.subscribe(data => {
             this.cmdOutput += data.stdout + "\n";
         });
 
         // Command exit
-        this.sdkSvr.CmdExit$.subscribe(exit => {
+        this.xdsSvr.CmdExit$.subscribe(exit => {
             if (this.startTime.has(exit.cmdID)) {
                 this.cmdInfo = 'Last command duration: ' + this._computeTime(this.startTime.get(exit.cmdID));
                 this.startTime.delete(exit.cmdID);
@@ -93,7 +97,9 @@ export class BuildComponent implements OnInit, AfterViewChecked {
         let t0 = performance.now();
         this.cmdInfo = 'Start build of ' + prjID + ' at ' + t0;
 
-        this.sdkSvr.make(prjID, this.buildForm.value.subpath, args)
+        let sdkid = this.sdkSvr.getCurrentId();
+
+        this.xdsSvr.make(prjID, this.buildForm.value.subpath, args, sdkid)
             .subscribe(res => {
                 this.startTime.set(String(res.cmdID), t0);
             },
diff --git a/webapp/src/app/common/config.service.ts b/webapp/src/app/common/config.service.ts
index 67ee14c..201ee8b 100644
--- a/webapp/src/app/common/config.service.ts
+++ b/webapp/src/app/common/config.service.ts
@@ -35,6 +35,7 @@ export interface IProject {
     localPrjDef?: any;
     isExpanded?: boolean;
     visible?: boolean;
+    defaultSdkID?: string;
 }
 
 export interface ILocalSTConfig {
@@ -213,6 +214,7 @@ export class ConfigService {
             label: prj.label,
             path: prj.path,
             hostSyncThingID: this.confStore.localSThg.ID,
+            defaultSdkID: prj.defaultSdkID,
         };
 
         // Send config to XDS server
diff --git a/webapp/src/app/common/sdk.service.ts b/webapp/src/app/common/sdk.service.ts
new file mode 100644
index 0000000..3f2f32a
--- /dev/null
+++ b/webapp/src/app/common/sdk.service.ts
@@ -0,0 +1,43 @@
+import { Injectable, SecurityContext } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+
+import { XDSServerService } from "../common/xdsserver.service";
+
+export interface ISdk {
+    id: string;
+    profile: string;
+    version: string;
+    arch: number;
+    path: string;
+}
+
+@Injectable()
+export class SdkService {
+    public Sdks$: Observable<ISdk[]>;
+
+    private _sdksList = [];
+    private current: ISdk;
+    private sdksSubject = <BehaviorSubject<ISdk[]>>new BehaviorSubject(this._sdksList);
+
+    constructor(private xdsSvr: XDSServerService) {
+        this.current = null;
+        this.Sdks$ = this.sdksSubject.asObservable();
+
+        this.xdsSvr.getSdks().subscribe((s) => {
+            this._sdksList = s;
+            this.sdksSubject.next(s);
+        });
+    }
+
+    public setCurrent(s: ISdk) {
+        this.current = s;
+    }
+
+    public getCurrentId(): string {
+        if (this.current && this.current.id) {
+            return this.current.id;
+        }
+        return "";
+    }
+}
\ No newline at end of file
diff --git a/webapp/src/app/common/xdsserver.service.ts b/webapp/src/app/common/xdsserver.service.ts
index fd2e32a..6cd9ba3 100644
--- a/webapp/src/app/common/xdsserver.service.ts
+++ b/webapp/src/app/common/xdsserver.service.ts
@@ -7,6 +7,8 @@ import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 import * as io from 'socket.io-client';
 
 import { AlertService } from './alert.service';
+import { ISdk } from './sdk.service';
+
 
 // Import RxJs required methods
 import 'rxjs/add/operator/map';
@@ -20,6 +22,7 @@ export interface IXDSConfigProject {
     path: string;
     hostSyncThingID: string;
     label?: string;
+    defaultSdkID?: string;
 }
 
 interface IXDSBuilderConfig {
@@ -36,6 +39,7 @@ interface IXDSFolderConfig {
     syncThingID: string;
     builderSThgID?: string;
     status?: string;
+    defaultSdkID: string;
 }
 
 interface IXDSConfig {
@@ -136,6 +140,10 @@ export class XDSServerService {
 
     }
 
+    getSdks(): Observable<ISdk[]> {
+        return this._get('/sdks');
+    }
+
     getProjects(): Observable<IXDSFolderConfig[]> {
         return this._get('/folders');
     }
@@ -146,7 +154,8 @@ export class XDSServerService {
             label: cfg.label || "",
             path: cfg.path,
             type: FOLDER_TYPE_CLOUDSYNC,
-            syncThingID: cfg.hostSyncThingID
+            syncThingID: cfg.hostSyncThingID,
+            defaultSdkID: cfg.defaultSdkID || "",
         };
         return this._post('/folder', folder);
     }
@@ -163,8 +172,8 @@ export class XDSServerService {
             });
     }
 
-    make(prjID: string, dir: string, args: string): Observable<any> {
-        return this._post('/make', { id: prjID, rpath: dir, args: args });
+    make(prjID: string, dir: string, args: string, sdkid?: string): Observable<any> {
+        return this._post('/make', { id: prjID, rpath: dir, args: args, sdkid: sdkid });
     }
 
 
diff --git a/webapp/src/app/config/config.component.html b/webapp/src/app/config/config.component.html
index 45b0e14..2a3d322 100644
--- a/webapp/src/app/config/config.component.html
+++ b/webapp/src/app/config/config.component.html
@@ -40,6 +40,17 @@
 
 <div class="panel panel-default">
     <div class="panel-heading">
+        <h2 class="panel-title">Cross SDKs Configuration</h2>
+    </div>
+    <div class="panel-body">
+        <div class="row col-xs-12">
+            <sdks-list-accordion [sdks]="(sdks$ | async)"></sdks-list-accordion>
+        </div>
+    </div>
+</div>
+
+<div class="panel panel-default">
+    <div class="panel-heading">
         <h2 class="panel-title">Projects Configuration</h2>
     </div>
     <div class="panel-body">
diff --git a/webapp/src/app/config/config.component.ts b/webapp/src/app/config/config.component.ts
index 681c296..745e9f6 100644
--- a/webapp/src/app/config/config.component.ts
+++ b/webapp/src/app/config/config.component.ts
@@ -11,6 +11,7 @@ import { ConfigService, IConfig, IProject, ProjectType } from "../common/config.
 import { XDSServerService, IServerStatus } from "../common/xdsserver.service";
 import { SyncthingService, ISyncThingStatus } from "../common/syncthing.service";
 import { AlertService } from "../common/alert.service";
+import { ISdk, SdkService } from "../common/sdk.service";
 
 @Component({
     templateUrl: './app/config/config.component.html',
@@ -23,6 +24,7 @@ import { AlertService } from "../common/alert.service";
 export class ConfigComponent implements OnInit {
 
     config$: Observable<IConfig>;
+    sdks$: Observable<ISdk[]>;
     severStatus$: Observable<IServerStatus>;
     localSTStatus$: Observable<ISyncThingStatus>;
 
@@ -44,8 +46,9 @@ export class ConfigComponent implements OnInit {
 
     constructor(
         private configSvr: ConfigService,
-        private sdkSvr: XDSServerService,
+        private xdsSvr: XDSServerService,
         private stSvr: SyncthingService,
+        private sdkSvr: SdkService,
         private alert: AlertService,
         private fb: FormBuilder
     ) {
@@ -59,7 +62,8 @@ export class ConfigComponent implements OnInit {
 
     ngOnInit() {
         this.config$ = this.configSvr.conf;
-        this.severStatus$ = this.sdkSvr.Status$;
+        this.sdks$ = this.sdkSvr.Sdks$;
+        this.severStatus$ = this.xdsSvr.Status$;
         this.localSTStatus$ = this.stSvr.Status$;
 
         // Bind syncToolUrl to baseURL
@@ -117,6 +121,7 @@ export class ConfigComponent implements OnInit {
             label: formVal['label'],
             path: formVal['path'],
             type: ProjectType.SYNCTHING,
+            // FIXME: allow to set defaultSdkID from New Project config panel
         });
     }
 
diff --git a/webapp/src/app/sdks/sdkCard.component.ts b/webapp/src/app/sdks/sdkCard.component.ts
new file mode 100644
index 0000000..f5d2a54
--- /dev/null
+++ b/webapp/src/app/sdks/sdkCard.component.ts
@@ -0,0 +1,51 @@
+import { Component, Input } from '@angular/core';
+import { ISdk } from "../common/sdk.service";
+
+@Component({
+    selector: 'sdk-card',
+    template: `
+        <div class="row">
+            <div class="col-xs-12">
+                <div class="text-right" role="group">
+                    <button disabled class="btn btn-link" (click)="delete(sdk)"><span class="fa fa-trash fa-size-x2"></span></button>
+                </div>
+            </div>
+        </div>
+
+        <table class="table table-striped">
+            <tbody>
+            <tr>
+                <th><span class="fa fa-fw fa-id-badge"></span>&nbsp;<span>Profile</span></th>
+                <td>{{ sdk.profile }}</td>
+            </tr>
+            <tr>
+                <th><span class="fa fa-fw fa-tasks"></span>&nbsp;<span>Architecture</span></th>
+                <td>{{ sdk.arch }}</td>
+            </tr>
+            <tr>
+                <th><span class="fa fa-fw fa-code-fork"></span>&nbsp;<span>Version</span></th>
+                <td>{{ sdk.version }}</td>
+            </tr>
+            <tr>
+                <th><span class="fa fa-fw fa-folder-open-o"></span>&nbsp;<span>Sdk path</span></th>
+                <td>{{ sdk.path}}</td>
+            </tr>
+
+            </tbody>
+        </table >
+    `,
+    styleUrls: ['./app/config/config.component.css']
+})
+
+export class SdkCardComponent {
+
+    @Input() sdk: ISdk;
+
+    constructor() { }
+
+
+    delete(sdk: ISdk) {
+        // Not supported for now
+    }
+
+}
diff --git a/webapp/src/app/sdks/sdkSelectDropdown.component.ts b/webapp/src/app/sdks/sdkSelectDropdown.component.ts
new file mode 100644
index 0000000..5122cd2
--- /dev/null
+++ b/webapp/src/app/sdks/sdkSelectDropdown.component.ts
@@ -0,0 +1,44 @@
+import { Component, Input } from "@angular/core";
+
+import { ISdk, SdkService } from "../common/sdk.service";
+
+@Component({
+    selector: 'sdk-select-dropdown',
+    template: `
+        <div class="btn-group" dropdown *ngIf="curSdk" >
+            <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle" style="width: 20em;">
+                {{curSdk.name}} <span class="caret" style="float: right; margin-top: 8px;"></span>
+            </button>
+            <ul *dropdownMenu class="dropdown-menu" role="menu">
+                <li role="menuitem"><a class="dropdown-item" *ngFor="let sdk of sdks" (click)="select(sdk)">
+                    {{sdk.name}}</a>
+                </li>
+            </ul>
+        </div>
+    `
+})
+export class SdkSelectDropdownComponent {
+
+    // FIXME investigate to understand why not working with sdks as input
+    // <sdk-select-dropdown [sdks]="(sdks$ | async)"></sdk-select-dropdown>
+    //@Input() sdks: ISdk[];
+    sdks: ISdk[];
+
+    curSdk: ISdk;
+
+    constructor(private sdkSvr: SdkService) { }
+
+    ngOnInit() {
+        this.sdkSvr.Sdks$.subscribe((s) => {
+            this.sdks = s;
+            this.curSdk = this.sdks.length ? this.sdks[0] : null;
+            this.sdkSvr.setCurrent(this.curSdk);
+        });
+    }
+
+    select(s) {
+         this.sdkSvr.setCurrent(this.curSdk = s);
+    }
+}
+
+
diff --git a/webapp/src/app/sdks/sdksListAccordion.component.ts b/webapp/src/app/sdks/sdksListAccordion.component.ts
new file mode 100644
index 0000000..9094f27
--- /dev/null
+++ b/webapp/src/app/sdks/sdksListAccordion.component.ts
@@ -0,0 +1,26 @@
+import { Component, Input } from "@angular/core";
+
+import { ISdk } from "../common/sdk.service";
+
+@Component({
+    selector: 'sdks-list-accordion',
+    template: `
+        <accordion>
+            <accordion-group #group *ngFor="let sdk of sdks">
+                <div accordion-heading>
+                    {{ sdk.name }}
+                    <i class="pull-right float-xs-right fa"
+                    [ngClass]="{'fa-chevron-down': group.isOpen, 'fa-chevron-right': !group.isOpen}"></i>
+                </div>
+                <sdk-card [sdk]="sdk"></sdk-card>
+            </accordion-group>
+        </accordion>
+    `
+})
+export class SdksListAccordionComponent {
+
+    @Input() sdks: ISdk[];
+
+}
+
+