diff --git a/src/app/app.component.html b/src/app/app.component.html index 4191210..3a17bc5 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -2,17 +2,17 @@ Techblox console - + {{ logMessages }} - + + [matAutocomplete]="commandCompletion" (focus)="commands || getCommandList()"/> - - Hmm + + {{ cmd.line }} Send diff --git a/src/app/app.component.ts b/src/app/app.component.ts index f1089da..33c3f03 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -9,17 +9,17 @@ import { FormControl } from '@angular/forms'; }) export class AppComponent { title = 'TBConsoleClient'; - logMessages = ''; - commandControl: FormControl = new FormControl(''); + commands: { command: string, line: string }[] = []; constructor(private http: HttpClient) { + this.getCommandList(); } async sendCommand() { try { - const res = await this.http.post('http://localhost:8019/', this.commandControl.value, {responseType: 'text'}).toPromise(); + const res = await this.http.post('http://localhost:8019/command', this.commandControl.value, {responseType: 'text'}).toPromise(); this.logMessages += res + "\n"; } catch (e) { if (e.status == 0) @@ -28,4 +28,9 @@ export class AppComponent { this.logMessages += e.message + "\n"; } } + + async getCommandList() { + const res = await this.http.post('http://localhost:8019/commands', '', {responseType: 'text'}).toPromise(); + this.commands = res.split('\n').map(cmd => ({command: cmd.split(' - ')[0], line: cmd})); + } } diff --git a/src/styles.scss b/src/styles.scss index a56eeb9..14daecb 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -31,3 +31,10 @@ mat-card-title { pre { white-space: pre-wrap; } + +.logMessages { + border: 1px solid black; + padding: 15px; + overflow: scroll; + max-height: 40em; +}
{{ logMessages }}