diff options
Diffstat (limited to 'webapp')
| -rw-r--r-- | webapp/src/app/config/config.component.css | 4 | ||||
| -rw-r--r-- | webapp/src/app/devel/build/build.component.html | 4 | ||||
| -rw-r--r-- | webapp/src/app/projects/projectAddModal.component.ts | 16 | ||||
| -rw-r--r-- | webapp/src/app/projects/projectCard.component.ts | 25 | ||||
| -rw-r--r-- | webapp/src/app/projects/projectsListAccordion.component.ts | 17 | ||||
| -rw-r--r-- | webapp/src/app/services/config.service.ts | 101 | ||||
| -rw-r--r-- | webapp/src/app/services/xdsserver.service.ts | 28 |
7 files changed, 146 insertions, 49 deletions
diff --git a/webapp/src/app/config/config.component.css b/webapp/src/app/config/config.component.css index 208ce6f..2bb3fea 100644 --- a/webapp/src/app/config/config.component.css +++ b/webapp/src/app/config/config.component.css @@ -24,3 +24,7 @@ tr.info>th { tr.info>td { vertical-align: middle; } + +.panel-heading { + background: aliceblue; +} diff --git a/webapp/src/app/devel/build/build.component.html b/webapp/src/app/devel/build/build.component.html index 7f85aa6..a66231c 100644 --- a/webapp/src/app/devel/build/build.component.html +++ b/webapp/src/app/devel/build/build.component.html @@ -18,7 +18,7 @@ </tr> <tr> <th>Project root path</th> - <td> <input type="text" disabled style="width:99%;" [value]="curProject && curProject.path"></td> + <td> <input type="text" disabled style="width:99%;" [value]="curProject && curProject.pathClient"></td> </tr> <tr> <th>Sub-path</th> @@ -105,4 +105,4 @@ </div> </div> </div> -</div>
\ No newline at end of file +</div> diff --git a/webapp/src/app/projects/projectAddModal.component.ts b/webapp/src/app/projects/projectAddModal.component.ts index 47e9c89..7ef5b5e 100644 --- a/webapp/src/app/projects/projectAddModal.component.ts +++ b/webapp/src/app/projects/projectAddModal.component.ts @@ -62,7 +62,17 @@ export class ProjectAddModalComponent { this.pathCliCtrl.valueChanges .debounceTime(100) .filter(n => n) - .map(n => "Project_" + n.split('/')[0]) + .map(n => { + let last = n.split('/'); + let nm = n; + if (last.length > 0) { + nm = last.pop(); + if (nm === "" && last.length > 0) { + nm = last.pop(); + } + } + return "Project_" + nm; + }) .subscribe(value => { if (value && !this.userEditedLabel) { this.addProjectForm.patchValue({ label: value }); @@ -97,10 +107,10 @@ export class ProjectAddModalComponent { onChangeLocalProject(e) { if e.target.files.length < 1 { - console.log('SEB NO files'); + console.log('NO files'); } let dir = e.target.files[0].webkitRelativePath; - console.log("SEB files: " + dir); + console.log("files: " + dir); let u = URL.createObjectURL(e.target.files[0]); } */ diff --git a/webapp/src/app/projects/projectCard.component.ts b/webapp/src/app/projects/projectCard.component.ts index 1b89fe7..a7ca9a3 100644 --- a/webapp/src/app/projects/projectCard.component.ts +++ b/webapp/src/app/projects/projectCard.component.ts @@ -8,7 +8,9 @@ import { AlertService } from "../services/alert.service"; <div class="row"> <div class="col-xs-12"> <div class="text-right" role="group"> - <button class="btn btn-link" (click)="delete(project)"><span class="fa fa-trash fa-size-x2"></span></button> + <button class="btn btn-link" (click)="delete(project)"> + <span class="fa fa-trash fa-size-x2"></span> + </button> </div> </div> </div> @@ -27,16 +29,18 @@ import { AlertService } from "../services/alert.service"; <th><span class="fa fa-fw fa-folder-open-o"></span> <span>Local path</span></th> <td>{{ project.pathClient }}</td> </tr> - <tr *ngIf="project.pathServer != ''"> + <tr *ngIf="project.pathServer && project.pathServer != ''"> <th><span class="fa fa-fw fa-folder-open-o"></span> <span>Server path</span></th> <td>{{ project.pathServer }}</td> </tr> - <!-- <tr> - <th><span class="fa fa-fw fa-status"></span> <span>Status</span></th> - <td>{{ project.remotePrjDef.status }}</td> + <th><span class="fa fa-fw fa-flag"></span> <span>Status</span></th> + <td>{{ project.status }} - {{ project.isInSync ? "Up to Date" : "Out of Sync"}} + <button *ngIf="!project.isInSync" class="btn btn-link" (click)="sync(project)"> + <span class="fa fa-refresh fa-size-x2"></span> + </button> + </td> </tr> - --> </tbody> </table > `, @@ -53,7 +57,6 @@ export class ProjectCardComponent { ) { } - delete(prj: IProject) { this.configSvr.deleteProject(prj) .subscribe(res => { @@ -62,6 +65,14 @@ export class ProjectCardComponent { }); } + sync(prj: IProject) { + this.configSvr.syncProject(prj) + .subscribe(res => { + }, err => { + this.alert.error("ERROR: " + err); + }); + } + } // Remove APPS. prefix if translate has failed diff --git a/webapp/src/app/projects/projectsListAccordion.component.ts b/webapp/src/app/projects/projectsListAccordion.component.ts index 1b43cea..6e697f4 100644 --- a/webapp/src/app/projects/projectsListAccordion.component.ts +++ b/webapp/src/app/projects/projectsListAccordion.component.ts @@ -5,12 +5,25 @@ import { IProject } from "../services/config.service"; @Component({ selector: 'projects-list-accordion', template: ` + <style> + .fa.fa-exclamation-triangle { + margin-right: 2em; + color: red; + } + .fa.fa-refresh { + margin-right: 10px; + color: darkviolet; + } + </style> <accordion> <accordion-group #group *ngFor="let prj of projects"> <div accordion-heading> {{ prj.label }} - <i class="pull-right float-xs-right fa" - [ngClass]="{'fa-chevron-down': group.isOpen, 'fa-chevron-right': !group.isOpen}"></i> + <div class="pull-right"> + <i *ngIf="prj.status == 'Syncing'" class="fa fa-refresh faa-spin animated"></i> + <i *ngIf="!prj.isInSync && prj.status != 'Syncing'" class="fa fa-exclamation-triangle"></i> + <i class="fa" [ngClass]="{'fa-chevron-down': group.isOpen, 'fa-chevron-right': !group.isOpen}"></i> + </div> </div> <project-card [project]="prj"></project-card> </accordion-group> diff --git a/webapp/src/app/services/config.service.ts b/webapp/src/app/services/config.service.ts index 3b51768..f5e353c 100644 --- a/webapp/src/app/services/config.service.ts +++ b/webapp/src/app/services/config.service.ts @@ -29,18 +29,15 @@ export var ProjectTypes = [ { value: ProjectType.SYNCTHING, display: "Cloud Sync" } ]; -export interface INativeProject { - // TODO -} - export interface IProject { id?: string; label: string; pathClient: string; pathServer?: string; type: ProjectType; - remotePrjDef?: INativeProject | ISyncThingProject; - localPrjDef?: any; + status?: string; + isInSync?: boolean; + serverPrjDef?: IXDSFolderConfig; isExpanded?: boolean; visible?: boolean; defaultSdkID?: string; @@ -139,6 +136,17 @@ export class ConfigService { ); this.confSubject.next(Object.assign({}, this.confStore)); }); + + // Update Project data + this.xdsServerSvr.FolderStateChange$.subscribe(prj => { + let i = this._getProjectIdx(prj.id); + if (i >= 0) { + // XXX for now, only isInSync and status may change + this.confStore.projects[i].isInSync = prj.isInSync; + this.confStore.projects[i].status = prj.status; + this.confSubject.next(Object.assign({}, this.confStore)); + } + }); } // Save config into cookie @@ -215,17 +223,8 @@ export class ConfigService { this.stSvr.getProjects().subscribe(localPrj => { remotePrj.forEach(rPrj => { let lPrj = localPrj.filter(item => item.id === rPrj.id); - if (lPrj.length > 0) { - let pp: IProject = { - id: rPrj.id, - label: rPrj.label, - pathClient: rPrj.path, - pathServer: rPrj.dataPathMap.serverPath, - type: rPrj.type, - remotePrjDef: Object.assign({}, rPrj), - localPrjDef: Object.assign({}, lPrj[0]), - }; - this.confStore.projects.push(pp); + if (lPrj.length > 0 || rPrj.type === ProjectType.NATIVE_PATHMAP) { + this._addProject(rPrj, true); } }); this.confSubject.next(Object.assign({}, this.confStore)); @@ -306,18 +305,15 @@ export class ConfigService { let newPrj = prj; return this.xdsServerSvr.addProject(xdsPrj) .flatMap(resStRemotePrj => { - newPrj.remotePrjDef = resStRemotePrj; - newPrj.id = resStRemotePrj.id; - newPrj.pathClient = resStRemotePrj.path; - - if (newPrj.type === ProjectType.SYNCTHING) { + xdsPrj = resStRemotePrj; + if (xdsPrj.type === ProjectType.SYNCTHING) { // FIXME REWORK local ST config // move logic to server side tunneling-back by WS - let stData = resStRemotePrj.dataCloudSync; + let stData = xdsPrj.dataCloudSync; // Now setup local config let stLocPrj: ISyncThingProject = { - id: resStRemotePrj.id, + id: xdsPrj.id, label: xdsPrj.label, path: xdsPrj.path, serverSyncThingID: stData.builderSThgID @@ -327,18 +323,11 @@ export class ConfigService { return this.stSvr.addProject(stLocPrj); } else { - newPrj.pathServer = resStRemotePrj.dataPathMap.serverPath; return Observable.of(null); } }) .map(resStLocalPrj => { - newPrj.localPrjDef = resStLocalPrj; - - // FIXME: maybe reduce subject to only .project - //this.confSubject.next(Object.assign({}, this.confStore).project); - this.confStore.projects.push(Object.assign({}, newPrj)); - this.confSubject.next(Object.assign({}, this.confStore)); - + this._addProject(xdsPrj); return newPrj; }); } @@ -351,7 +340,10 @@ export class ConfigService { } return this.xdsServerSvr.deleteProject(prj.id) .flatMap(res => { - return this.stSvr.deleteProject(prj.id); + if (prj.type === ProjectType.SYNCTHING) { + return this.stSvr.deleteProject(prj.id); + } + return Observable.of(null); }) .map(res => { this.confStore.projects.splice(idx, 1); @@ -359,8 +351,51 @@ export class ConfigService { }); } + syncProject(prj: IProject): Observable<string> { + let idx = this._getProjectIdx(prj.id); + if (idx === -1) { + throw new Error("Invalid project id (id=" + prj.id + ")"); + } + return this.xdsServerSvr.syncProject(prj.id); + } + private _getProjectIdx(id: string): number { return this.confStore.projects.findIndex((item) => item.id === id); } + private _addProject(rPrj: IXDSFolderConfig, noNext?: boolean) { + + // Convert XDSFolderConfig to IProject + let pp: IProject = { + id: rPrj.id, + label: rPrj.label, + pathClient: rPrj.path, + pathServer: rPrj.dataPathMap.serverPath, + type: rPrj.type, + status: rPrj.status, + isInSync: rPrj.isInSync, + defaultSdkID: rPrj.defaultSdkID, + serverPrjDef: Object.assign({}, rPrj), // do a copy + }; + + // add new project + this.confStore.projects.push(pp); + + // sort project array + this.confStore.projects.sort((a, b) => { + if (a.label < b.label) { + return -1; + } + if (a.label > b.label) { + return 1; + } + return 0; + }); + + // FIXME: maybe reduce subject to only .project + //this.confSubject.next(Object.assign({}, this.confStore).project); + if (!noNext) { + this.confSubject.next(Object.assign({}, this.confStore)); + } + } } diff --git a/webapp/src/app/services/xdsserver.service.ts b/webapp/src/app/services/xdsserver.service.ts index b11fe9f..b69a196 100644 --- a/webapp/src/app/services/xdsserver.service.ts +++ b/webapp/src/app/services/xdsserver.service.ts @@ -38,12 +38,13 @@ export interface IXDSFolderConfig { path: string; type: number; status?: string; + isInSync?: boolean; defaultSdkID: string; // FIXME better with union but tech pb with go code //data?: IXDSPathMapConfig|IXDSCloudSyncConfig; - dataPathMap?:IXDSPathMapConfig; - dataCloudSync?:IXDSCloudSyncConfig; + dataPathMap?: IXDSPathMapConfig; + dataCloudSync?: IXDSCloudSyncConfig; } export interface IXDSPathMapConfig { @@ -106,8 +107,10 @@ export class XDSServerService { public CmdOutput$ = <Subject<ICmdOutput>>new Subject(); public CmdExit$ = <Subject<ICmdExit>>new Subject(); + public FolderStateChange$ = <Subject<IXDSFolderConfig>>new Subject(); public Status$: Observable<IServerStatus>; + private baseUrl: string; private wsUrl: string; private _status = { WS_connected: false }; @@ -127,6 +130,7 @@ export class XDSServerService { } else { this.wsUrl = 'ws://' + re[1]; this._handleIoSocket(); + this._RegisterEvents(); } } @@ -172,6 +176,22 @@ export class XDSServerService { this.CmdExit$.next(Object.assign({}, <ICmdExit>data)); }); + this.socket.on('event:FolderStateChanged', ev => { + if (ev && ev.folder) { + this.FolderStateChange$.next(Object.assign({}, ev.folder)); + } + }); + } + + private _RegisterEvents() { + let ev = "FolderStateChanged"; + this._post('/events/register', { "name": ev }) + .subscribe( + res => { }, + error => { + this.alert.error("ERROR while registering events " + ev + ": ", error); + } + ); } getSdks(): Observable<ISdk[]> { @@ -194,6 +214,10 @@ export class XDSServerService { return this._delete('/folder/' + id); } + syncProject(id: string): Observable<string> { + return this._post('/folder/sync/' + id, {}); + } + exec(prjID: string, dir: string, cmd: string, sdkid?: string, args?: string[], env?: string[]): Observable<any> { return this._post('/exec', { |