APIv2.2

common/utils/websrv/frontend/src/app/api/commands.api.ts

@@ -29,14 +29,12 @@ const route = '/oaisoftmodem';
 export class CommandsApi {
     constructor(private httpClient: HttpClient) { }
 
-    public readVariables$ = () => this.httpClient.get<IVariable[]>(environment.backend + route + '/variables/');
+    public readVariables$ = (moduleName?: string) => this.httpClient.get<IVariable[]>(environment.backend + route + '/' + (moduleName ? ('/' + moduleName) : "") + '/variables/');
 
-    public readCommands$ = () => this.httpClient.get<ICommand[]>(environment.backend + route + '/commands/');
+    public readCommands$ = (moduleName?: string) => this.httpClient.get<ICommand[]>(environment.backend + route + '/' + (moduleName ? ('/' + moduleName) : "") + '/commands/');
 
-    public readModuleVariables$ = (moduleName: string) => this.httpClient.get<IVariable[]>(environment.backend + route + '/' + moduleName + '/variables/');
+    public runCommand$ = (moduleName: string, command: ICommand) => this.httpClient.post<string>(environment.backend + route + '/' + moduleName + '/commands/', command);
 
-    public readModuleCommands$ = (moduleName: string) => this.httpClient.get<ICommand[]>(environment.backend + route + '/' + moduleName + '/commands/');
-
-    public runCommand$ = (moduleName: string, variable: IVariable) => this.httpClient.post<string>(environment.backend + route + '/' + moduleName + '/commands/', variable);
+    public setVariable$ = (variable: IVariable, moduleName?: string) => this.httpClient.post<string>(environment.backend + route + (moduleName ? ('/' + moduleName) : "") + '/variables/', variable);
 
 }

common/utils/websrv/frontend/src/app/components/commands/commands.component.html

 <div *ngIf="vars$ | async as vars">
-  <h1 mat-dialog-title>Variables</h1>
+  <h1 mat-dialog-title>Softmodem variables</h1>
   <div *ngFor="let variable of vars">
     <mat-form-field>
       <mat-label>{{ variable.nameFC.value }}</mat-label>
@@ -12,54 +12,59 @@
 </div>
 
 <div *ngIf="cmds$ | async as cmds" fxLaypout="row">
-  <h1 mat-dialog-title>Menus</h1>
   <mat-form-field>
-    <mat-label>Command</mat-label>
+    <mat-label>Module</mat-label>
     <mat-select [formControl]="selectedCmd!.nameFC" [value]="selectedCmd!.nameFC.value"
-      (selectionChange)="onCmdSelect()">
-      <mat-option *ngFor="let cmd of cmds" [value]="cmd">{{ cmd.nameFC.value }}
+      (selectionChange)=" onCmdSelect()">
+      <mat-option *ngFor="let cmd of cmds" [value]="cmd.nameFC.value">{{ cmd.nameFC.value }}
       </mat-option>
     </mat-select>
   </mat-form-field>
 
   <div *ngIf="subvars$ | async as subvars" fxLaypout="column">
-    <h1 mat-dialog-title>Sub-Variables</h1>
-    <div *ngFor="let variable of subvars">
-      <mat-form-field>
-        <mat-label>{{ variable.nameFC.value }}</mat-label>
-        <input input matInput [formControl]="variable.valueFC" />
-      </mat-form-field>
-      <button mat-raised-button color="primary" [disabled]="!variable.modifiableFC.value"
-        (click)="onVarSubmit(variable)">
-        submit
-      </button>
-    </div>
-  </div>
-
-  <div *ngIf="subcmds$ | async as subcmds" fxLaypout="column" fxLayoutGap="10px">
-    <h1 mat-dialog-title>Sub-commands</h1>
-    <mat-form-field>
-      <mat-label>Command</mat-label>
-      <mat-select [formControl]="selectedSubCmd!.nameFC" [value]="selectedSubCmd!.nameFC.value"
-        (selectionChange)="onSubCmdSelect()">
-        <mat-option *ngFor="let cmd of subcmds" [value]="cmd">{{ cmd.nameFC.value }}
-        </mat-option>
-      </mat-select>
-    </mat-form-field>
-
-    <div *ngIf="args$ | async as args" fxLaypout="column">
-      <h1 mat-dialog-title>Sub-Variables</h1>
-      <div *ngFor="let variable of args">
+    <div *ngIf="subvars.length">
+      <h1 mat-dialog-title>{{ selectedCmd!.nameFC.value }} variables</h1>
+      <div *ngFor="let variable of subvars">
         <mat-form-field>
           <mat-label>{{ variable.nameFC.value }}</mat-label>
           <input input matInput [formControl]="variable.valueFC" />
         </mat-form-field>
         <button mat-raised-button color="primary" [disabled]="!variable.modifiableFC.value"
-          (click)="onSubVarSubmit(variable)">
-          submit
+          (click)="onVarSubmit(variable)">
+          set
         </button>
       </div>
     </div>
+  </div>
+
+  <div *ngIf="subcmds$ | async as subcmds" fxLaypout="column" fxLayoutGap="10px">
+    <div *ngIf="subcmds.length">
+      <h1 mat-dialog-title>{{ selectedCmd!.nameFC.value }} commands</h1>
+      <mat-form-field>
+        <mat-label>Command</mat-label>
+        <mat-select [formControl]="selectedSubCmd!.nameFC" [value]="selectedSubCmd!.nameFC.value"
+          (selectionChange)="onSubCmdSelect()">
+          <mat-option *ngFor="let cmd of subcmds" [value]="cmd.nameFC.value">{{ cmd.nameFC.value }}
+          </mat-option>
+        </mat-select>
+      </mat-form-field>
+    </div>
+
+    <div *ngIf="args$ | async as args" fxLaypout="column">
+      <div *ngIf="args.length">
+        <h1 mat-dialog-title>Sub-Variables</h1>
+        <div *ngFor="let variable of args">
+          <mat-form-field>
+            <mat-label>{{ variable.nameFC.value }}</mat-label>
+            <input input matInput [formControl]="variable.valueFC" />
+          </mat-form-field>
+          <button mat-raised-button color="primary" [disabled]="!variable.modifiableFC.value"
+            (click)="onSubVarSubmit(variable)">
+            submit
+          </button>
+        </div>
+      </div>
+    </div>
 
   </div>
 </div>
\ No newline at end of file

common/utils/websrv/frontend/src/app/components/commands/commands.component.ts

 import { Component } from '@angular/core';
-import { FormControl } from '@angular/forms';
 import { Observable } from 'rxjs/internal/Observable';
 import { map } from 'rxjs/internal/operators/map';
+import { tap } from 'rxjs/internal/operators/tap';
 import { CommandsApi, IArgType } from 'src/app/api/commands.api';
 import { CmdCtrl } from 'src/app/controls/cmd.control';
-import { VariableCtrl as VarCtrl } from 'src/app/controls/var.control';
+import { VarCtrl } from 'src/app/controls/var.control';
 import { LoadingService } from 'src/app/services/loading.service';
 
 
@@ -35,38 +35,39 @@ export class CommandsComponent {
     public loadingService: LoadingService,
   ) {
     this.vars$ = this.commandsApi.readVariables$().pipe(
-      map((ivars) => ivars.map(ivar => new VarCtrl(ivar)))
+      map((vars) => vars.map(ivar => new VarCtrl(ivar)))
     );
 
     this.cmds$ = this.commandsApi.readCommands$().pipe(
-      map((ivars) => ivars.map(ivar => new CmdCtrl(ivar)))
+      map((cmds) => cmds.map(ivar => new CmdCtrl(ivar))),
+      tap(controls => [this.selectedCmd] = controls)
     );
   }
 
   onCmdSelect() {
-    this.subcmds$ = this.commandsApi.readModuleCommands$(`${this.selectedCmd?.nameFC.value}`).pipe(
+
+    this.subcmds$ = this.commandsApi.readCommands$(`${this.selectedCmd!.nameFC.value}`).pipe(
       map(cmds => cmds.map(cmd => new CmdCtrl(cmd))),
-      // tap(cmds => [this.selectedSubCmd] = cmds)
+      tap(controls => [this.selectedSubCmd] = controls)
     )
 
-    this.subvars$ = this.commandsApi.readModuleVariables$(`${this.selectedCmd?.nameFC.value}`).pipe(
-      map(vars => vars.map(v => new VarCtrl(v))),
-      // tap(vars => [this.selectedSubVar] = vars)
+    this.subvars$ = this.commandsApi.readVariables$(`${this.selectedCmd!.nameFC.value}`).pipe(map(vars => vars.map(v => new VarCtrl(v))),
+      tap(controls => [this.selectedSubVar] = controls)
     )
   }
 
   onSubCmdSelect() {
-    this.args$ = this.commandsApi.readModuleVariables$(`${this.selectedCmd?.nameFC.value}/${this.selectedSubCmd?.nameFC.value}`).pipe(
+    this.args$ = this.commandsApi.readVariables$(`${this.selectedCmd!.nameFC.value}/${this.selectedSubCmd!.nameFC.value}`).pipe(
       map(vars => vars.map(v => new VarCtrl(v))),
-      // tap(vars => [this.selectedSubVar] = vars)
+      tap(vars => [this.selectedArg] = vars)
     )
   }
 
   onVarSubmit(control: VarCtrl) {
-    this.commandsApi.runCommand$(`${this.selectedCmd?.nameFC.value}/${control.nameFC.value}`, control.valueFC.value).subscribe();
+    this.commandsApi.setVariable$(control.api()).subscribe();
   }
 
   onSubVarSubmit(control: VarCtrl) {
-    this.commandsApi.runCommand$(`${this.selectedCmd?.nameFC.value}/${this.selectedSubCmd?.nameFC.value}/${control.nameFC.value}`, control.valueFC.value).subscribe();
+    this.commandsApi.setVariable$(control.api(), `${this.selectedCmd?.nameFC.value}/${this.selectedSubCmd?.nameFC.value}/${control.nameFC.value}`).subscribe();
   }
 }

common/utils/websrv/frontend/src/app/controls/var.control.ts

@@ -10,7 +10,7 @@ const enum VariablesFCN {
 }
 
 
-export class VariableCtrl extends FormGroup {
+export class VarCtrl extends FormGroup {
 
   constructor(ivar: IVariable) {
     super({});
@@ -49,11 +49,11 @@ export class VariableCtrl extends FormGroup {
   }
 
   get typeFC() {
-    return this.get(VariablesFCN.value) as FormControl;
+    return this.get(VariablesFCN.type) as FormControl;
   }
 
   set typeFC(control: FormControl) {
-    this.setControl(VariablesFCN.value, control);
+    this.setControl(VariablesFCN.type, control);
   }
 
   get modifiableFC() {