Added LED display

client/.vscode/c_cpp_properties.json

 {
-  "configurations": [
-    {
-      "browse": {
-        "databaseFilename": "",
-        "limitSymbolsToIncludedHeaders": true
-      },
-      "includePath": [
-        "/home/lars/catkin_ws/devel/include/**",
-        "/opt/ros/melodic/include/**",
-        "/home/lars/catkin_ws/src/drone_lift/include/**",
-        "/home/lars/catkin_ws/src/mavros/libmavconn/include/**",
-        "/home/lars/catkin_ws/src/mavros/mavros/include/**",
-        "/home/lars/catkin_ws/src/mavros/mavros_msgs/include/**",
-        "/home/lars/catkin_ws/src/mavros/test_mavros/include/**",
-        "/usr/include/**"
-      ],
-      "name": "ROS"
-    }
-  ]
+    "configurations": [
+        {
+            "browse": {
+                "databaseFilename": "",
+                "limitSymbolsToIncludedHeaders": true
+            },
+            "includePath": [
+                "/home/lars/catkin_ws/devel/include/**",
+                "/opt/ros/melodic/include/**",
+                "/home/lars/catkin_ws/src/drone_lift/include/**",
+                "/home/lars/catkin_ws/src/mavros/libmavconn/include/**",
+                "/home/lars/catkin_ws/src/mavros/mavros/include/**",
+                "/home/lars/catkin_ws/src/mavros/mavros_msgs/include/**",
+                "/home/lars/catkin_ws/src/mavros/test_mavros/include/**",
+                "/usr/include/**"
+            ],
+            "name": "ROS",
+            "intelliSenseMode": "gcc-x64",
+            "compilerPath": "/usr/bin/clang",
+            "cStandard": "c11",
+            "cppStandard": "c++17"
+        }
+    ],
+    "version": 4
 }
\ No newline at end of file

client/src/app/led-presentation/led-presentation.component.css

+.container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.spinner {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: 100px;
+}
+
+ul {
+    list-style-type: none;
+}
\ No newline at end of file

client/src/app/led-presentation/led-presentation.component.html

 <div class="container" *ngIf="!loading; else spinner">
     <h1>LEDs</h1>
+    <div>
+        <ul>
+            <li *ngFor="let led of leds">
+                Status : {{led.value}}
+                <button id={{led.id}} (click)="SetOn($event)">ON</button> 
+                <button id={{led.id}} (click)="SetOff($event)">OFF</button>
+            </li>
+        </ul>
+    </div>
 
-    
 </div>
 <ng-template #spinner>
     <app-loading-spinner class="spinner"></app-loading-spinner>

client/src/app/led-presentation/led-presentation.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { SensorService } from '../sensor.service';
 import { takeUntil } from "rxjs/operators";
 import { Subject } from 'rxjs';
-import { LED } from './models/led.model';
+import { LED } from '../models/led.model';
 
 @Component({
   selector: 'app-led-presentation',
@@ -12,20 +12,34 @@ import { LED } from './models/led.model';
 
 export class LedPresentationComponent implements OnInit {
   unsubscribe = new Subject<void>();
-  LEDs = new LED[];
+  leds: LED[]
 
   constructor(private sensorService: SensorService) { }
 
   ngOnInit() {
+    this.getLEDs()
+  }
+
+  getLEDs() {
     this.sensorService.getLEDs().pipe(takeUntil(this.unsubscribe)).subscribe(result => {
-      this.LEDs = result.value;
+      this.leds = result.leds;
     });
   }
 
-
   ngOnDestroy() {
     this.unsubscribe.next();
     this.unsubscribe.complete();
   }
 
+  SetOff(e) {
+    this.sensorService.setLED(e.target.id, false).pipe(takeUntil(this.unsubscribe)).subscribe(result => {
+      this.getLEDs()
+    });
+  }
+  SetOn(e) {
+    this.sensorService.setLED(e.target.id, true).pipe(takeUntil(this.unsubscribe)).subscribe(result => {
+      this.getLEDs()
+    });
+  }
+
 }

client/src/app/models/led.model.ts

 export class LED {
     value: number;
-    id: string;
+    id: string
 }
\ No newline at end of file