Browse Source

Support sending commands and receiving responses, autocmomplete attempt

master
NorbiPeti 3 years ago
parent
commit
eacfc89649
Signed by: NorbiPeti <szatmari.norbert.peter@gmail.com> GPG Key ID: DBA4C4549A927E56
6 changed files with 58 additions and 13 deletions
  1. +15
    -0
      package-lock.json
  2. +1
    -0
      package.json
  3. +12
    -2
      src/app/app.component.html
  4. +17
    -7
      src/app/app.component.ts
  5. +9
    -4
      src/app/app.module.ts
  6. +4
    -0
      src/styles.scss

+ 15
- 0
package-lock.json View File

@@ -335,6 +335,21 @@
"tslib": "^2.1.0"
}
},
"@angular/http": {
"version": "7.2.16",
"resolved": "https://registry.npmjs.org/@angular/http/-/http-7.2.16.tgz",
"integrity": "sha512-yvjbNyzFSmmz4UTjCdy5M8mk0cZqf9TvSf8yN5UVIwtw4joyuUdlgJCuin0qSbQOKIf/JjHoofpO2JkPCGSNww==",
"requires": {
"tslib": "^1.9.0"
},
"dependencies": {
"tslib": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg=="
}
}
},
"@angular/language-service": {
"version": "12.0.0",
"resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-12.0.0.tgz",


+ 1
- 0
package.json View File

@@ -18,6 +18,7 @@
"@angular/core": "~12.0.0",
"@angular/flex-layout": "^11.0.0-beta.33",
"@angular/forms": "~12.0.0",
"@angular/http": "^7.2.16",
"@angular/material": "^12.0.0",
"@angular/platform-browser": "~12.0.0",
"@angular/platform-browser-dynamic": "~12.0.0",


+ 12
- 2
src/app/app.component.html View File

@@ -5,8 +5,18 @@
<div style="border: 1px solid black; padding: 15px" fxFlex="80">
<pre>{{ logMessages }}</pre>
</div>
<input matInput type="text" placeholder="Enter a command..." [(ngModel)]="command"/>
<button mat-raised-button (click)="sendCommand(command)">Send</button>
<form>
<mat-form-field>
<input matInput type="text" placeholder="Enter a command..." [formControl]="commandControl"
[autocomplete]="commandCompletion"/>
</mat-form-field>
<mat-autocomplete #commandCompletion="matAutocomplete">
<mat-option [value]="'hmm'">
Hmm
</mat-option>
</mat-autocomplete>
<button mat-raised-button class="mat-primary" (click)="sendCommand()">Send</button>
</form>
</mat-card-content>
</mat-card>
</div>

+ 17
- 7
src/app/app.component.ts View File

@@ -1,4 +1,6 @@
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { FormControl } from '@angular/forms';

@Component({
selector: 'app-root',
@@ -8,14 +10,22 @@ import { Component } from '@angular/core';
export class AppComponent {
title = 'TBConsoleClient';

logMessages = `Message output
asd
dsa
Hmm`;
logMessages = '';

command: string;
commandControl: FormControl = new FormControl('');

sendCommand(command: string) {
alert(command);
constructor(private http: HttpClient) {
}

async sendCommand() {
try {
const res = await this.http.post('http://localhost:8019/', this.commandControl.value, {responseType: 'text'}).toPromise();
this.logMessages += res + "\n";
} catch (e) {
if (e.status == 0)
this.logMessages += "Failed to contact mod! Make sure it is running and listening.\n";
else
this.logMessages += e.message + "\n";
}
}
}

+ 9
- 4
src/app/app.module.ts View File

@@ -2,12 +2,14 @@ import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatCardModule } from '@angular/material/card';
import { FlexLayoutModule } from '@angular/flex-layout';
import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { HttpClientModule } from '@angular/common/http';
import { MatAutocompleteModule } from '@angular/material/autocomplete';

@NgModule({
declarations: [
@@ -15,12 +17,15 @@ import { MatButtonModule } from '@angular/material/button';
],
imports: [
BrowserModule,
NoopAnimationsModule,
BrowserAnimationsModule,
MatCardModule,
FlexLayoutModule,
MatInputModule,
FormsModule,
MatButtonModule
MatButtonModule,
HttpClientModule,
MatAutocompleteModule,
ReactiveFormsModule
],
providers: [],
bootstrap: [AppComponent]


+ 4
- 0
src/styles.scss View File

@@ -27,3 +27,7 @@ mat-card {
mat-card-title {
text-align: center;
}

pre {
white-space: pre-wrap;
}

Loading…
Cancel
Save