started on LED presentation

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"
+    }
+  ]
+}
\ No newline at end of file

client/src/app/app-routing.module.ts

@@ -4,11 +4,13 @@ import { FrontPageComponent } from './front-page/front-page.component';
 import { DhtPresentationComponent } from './dht-presentation/dht-presentation.component';
 import { UltraSonicPresentationComponent } from './ultra-sonic-presentation/ultra-sonic-presentation.component';
 import { AllSensorsPresentationComponent } from './all-sensors-presentation/all-sensors-presentation.component';
+import { LedPresentationComponent } from './led-presentation/led-presentation.component';
 
 
 const routes: Routes = [
   {path: "dht", component: DhtPresentationComponent},
   {path: "ultra-sonic", component: UltraSonicPresentationComponent},
+  {path: "led", component: LedPresentationComponent},
   {path: "all-sensors", component: AllSensorsPresentationComponent},
   {path: "frontpage", component: FrontPageComponent},
   { path: '',

client/src/app/app.module.ts

@@ -10,6 +10,7 @@ import { UltraSonicPresentationComponent } from './ultra-sonic-presentation/ultr
 import { AllSensorsPresentationComponent } from './all-sensors-presentation/all-sensors-presentation.component';
 import { FrontPageComponent } from './front-page/front-page.component';
 import { LoadingSpinnerComponent } from './loading-spinner/loading-spinner.component';
+import { LedPresentationComponent } from './led-presentation/led-presentation.component';
 
 @NgModule({
   declarations: [
@@ -19,7 +20,8 @@ import { LoadingSpinnerComponent } from './loading-spinner/loading-spinner.compo
     UltraSonicPresentationComponent,
     AllSensorsPresentationComponent,
     FrontPageComponent,
-    LoadingSpinnerComponent
+    LoadingSpinnerComponent,
+    LedPresentationComponent
   ],
   imports: [
     BrowserModule,

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

+<div class="container" *ngIf="!loading; else spinner">
+    <h1>LEDs</h1>
+
+    
+</div>
+<ng-template #spinner>
+    <app-loading-spinner class="spinner"></app-loading-spinner>
+</ng-template>
\ No newline at end of file

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

+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LedPresentationComponent } from './led-presentation.component';
+
+describe('LedPresentationComponent', () => {
+  let component: LedPresentationComponent;
+  let fixture: ComponentFixture<LedPresentationComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ LedPresentationComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(LedPresentationComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

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

+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';
+
+@Component({
+  selector: 'app-led-presentation',
+  templateUrl: './led-presentation.component.html',
+  styleUrls: ['./led-presentation.component.css']
+})
+
+export class LedPresentationComponent implements OnInit {
+  unsubscribe = new Subject<void>();
+  LEDs = new LED[];
+
+  constructor(private sensorService: SensorService) { }
+
+  ngOnInit() {
+    this.sensorService.getLEDs().pipe(takeUntil(this.unsubscribe)).subscribe(result => {
+      this.LEDs = result.value;
+    });
+  }
+
+
+  ngOnDestroy() {
+    this.unsubscribe.next();
+    this.unsubscribe.complete();
+  }
+
+}

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

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

client/src/app/nav-bar/nav-bar.component.html

@@ -6,19 +6,24 @@
             </a>
         </li>
         <li class="link-element">
-                <a class="link-tag" [routerLink]="['dht']">
-                    DHT
-                </a>
+            <a class="link-tag" [routerLink]="['dht']">
+                DHT
+            </a>
+        </li>
+        <li class="link-element">
+            <a class="link-tag" [routerLink]="['ultra-sonic']">
+                Ultra Sonic
+            </a>
         </li>
         <li class="link-element">
-                <a class="link-tag" [routerLink]="['ultra-sonic']">
-                    Ultra Sonic
-                </a>
+            <a class="link-tag" [routerLink]="['led']">
+                LEDs
+            </a>
         </li>
         <li class="link-element">
-                <a class="link-tag" [routerLink]="['all-sensors']">
-                    All
-                </a>
+            <a class="link-tag" [routerLink]="['all-sensors']">
+                All
+            </a>
         </li>
     </ul>
-</nav>
+</nav>
\ No newline at end of file

client/src/app/sensor.service.ts

@@ -11,7 +11,7 @@ export class SensorService {
 
   rootUrl: string;
 
-  constructor(private http: HttpClient) { 
+  constructor(private http: HttpClient) {
     this.rootUrl = environment.rootUrl;
   }
 
@@ -19,6 +19,27 @@ export class SensorService {
     return this.http.get<Dht>(`${this.rootUrl}api/sensor/dht`);
   }
 
+  getLEDs(): Observable<any> {
+    return this.http.get<any>(`${this.rootUrl}api/actuator/led`);
+  }
+
+  setLED(id: number, status: boolean): Observable<any> {
+    let data = null
+
+    if (status) {
+      data = {
+        "value": 1
+      }
+    }
+    else {
+      data = {
+        "value": 0
+      }
+    }
+
+    return this.http.post<any>(`${this.rootUrl}api/actuator/led/${id}`, data);
+  }
+
   getUltraSonic(): Observable<number> {
     return this.http.get<number>(`${this.rootUrl}api/sensor/ultra`);
   }