add custom action for LED Strip

src/app/control/control.component.ts

@@ -5,6 +5,7 @@ import { Router } from '@angular/router';
 import { ConfigService } from '../config/config.service';
 import { OctoprintPrinterProfileAPI } from '../octoprint-api/printerProfileAPI';
 import { OctoprintService } from '../octoprint.service';
+import { EnclosureService } from '../plugin-service/enclosure.service';
 import { PsuControlService } from '../plugin-service/psu-control.service';
 import { PrinterService } from '../printer.service';
 import { PrinterProfileService } from '../printerprofile.service';
@@ -29,6 +30,7 @@ export class ControlComponent {
     private octoprintService: OctoprintService,
     private configService: ConfigService,
     private psuControlService: PsuControlService,
+    private enclosureService: EnclosureService,
     private router: Router,
   ) {
     this.printerProfile = {
@@ -121,6 +123,9 @@ export class ControlComponent {
       default: {
         if (command.includes('[!WEB]')) {
           this.openIFrame(command.replace('[!WEB]', ''));
+        } else if (command.includes('[!NEOPIXEL]')) {
+          const values = command.replace('[!NEOPIXEL]', '').split(',');
+          this.setLEDColor(values[0], values[1], values[2], values[3]);
         } else {
           this.printerService.executeGCode(command);
         }
@@ -178,6 +183,10 @@ export class ControlComponent {
       this.iFrameURL = 'about:blank';
     }, 500);
   }
+
+  public setLEDColor(identifier: string, red: string, green: string, blue: string): void {
+    this.enclosureService.setLEDColor(Number(identifier), Number(red), Number(green), Number(blue));
+  }
 }
 
 interface ActionToConfirm {

src/app/plugin-service/enclosure.service.ts

@@ -12,6 +12,7 @@ import { NotificationService } from '../notification/notification.service';
 })
 export class EnclosureService {
   private httpGETRequest: Subscription;
+  private httpPOSTRequest: Subscription;
   private observable: Observable<TemperatureReading>;
   private initialRequest = true;
 
@@ -56,6 +57,35 @@ export class EnclosureService {
   public getObservable(): Observable<TemperatureReading> {
     return this.observable;
   }
+
+  public setLEDColor(identifier: number, red: number, green: number, blue: number): Promise<void> {
+    return new Promise((resolve, reject): void => {
+      const colorBody: EnclosureColorBody = {
+        red,
+        green,
+        blue,
+      };
+      if (this.httpPOSTRequest) {
+        this.httpPOSTRequest.unsubscribe();
+      }
+      console.log(colorBody);
+      console.log(identifier);
+      this.httpPOSTRequest = this.http
+        .patch(
+          this.configService.getURL('plugin/enclosure/neopixel/' + identifier).replace('/api', ''),
+          colorBody,
+          this.configService.getHTTPHeaders(),
+        )
+        .subscribe(
+          (): void => resolve(),
+          (error: HttpErrorResponse): void => {
+            console.log(error.message);
+            this.notificationService.setError("Can't set LED color!", error.message);
+            reject();
+          },
+        );
+    });
+  }
 }
 
 interface EnclosurePluginAPI {
@@ -80,3 +110,9 @@ interface EnclosurePluginAPI {
   use_fahrenheit: boolean;
   gpio_pin: string;
 }
+
+interface EnclosureColorBody {
+  red: number;
+  green: number;
+  blue: number;
+}

src/app/plugin-service/filament-manager.service.ts

@@ -97,6 +97,9 @@ export class FilamentManagerService {
           spool: spool,
         },
       };
+      if (this.httpPOSTRequest) {
+        this.httpPOSTRequest.unsubscribe();
+      }
       this.httpPOSTRequest = this.http
         .patch(
           this.configService.getURL('plugin/filamentmanager/selections/0').replace('/api', ''),