iot-web-ui/src/app/modules/overview/overall-ground/overall-ground.component.ts

import { Component, OnDestroy, OnInit } from '@angular/core';
import {SocketService} from "../../../shared/services/socket.service";
import {Subscription} from "rxjs";
import {ToastrService} from "ngx-toastr";


@Component({
  selector: 'app-overall-ground',
  templateUrl: './overall-ground.component.html',
  styleUrls: ['./overall-ground.component.scss']
})
export class OverallGroundComponent implements OnInit, OnDestroy {
  isConnected = false;
  state1 = false;
  state2 = false;
  state3 = '';
  state4 = '';
  state5 = false;
  state6 = false;
  switchArm = false;
  switchWarning = false;
  isReady = true;
  private statusSubscription?: Subscription;
  private messageSubscription?: Subscription;
  private intervalId: any;


  constructor(
    private socketService$: SocketService,
    private toastr: ToastrService
    ) {
  }

  ngOnInit() {
    // this.socketService$.connect();
    this.statusSubscription = this.socketService$.status$.subscribe(isConnected => {
      this.isConnected = isConnected;
      this.getReadings();
      if (this.isConnected) {
        this.intervalId = setInterval(() => this.getReadings(), 5000);
        this.messageSubscription = this.socketService$.messages$.subscribe(message => {
          this.onMessage(message);
        });
      }
    });
  }

  ngOnDestroy(): void {
    if (this.statusSubscription) {
      this.statusSubscription.unsubscribe();
    }
    if (this.messageSubscription) {
      this.messageSubscription.unsubscribe();
    }
    if (this.intervalId) {
      clearInterval(this.intervalId);
    }
    this.socketService$.close();
  }

  getReadings() {
    let str = {id: '0', type: 'get'};
    this.socketService$.sendMessage(str);
  }

  toggleState1() {
    this.switchArm = !this.switchArm;
    let str = {id: '0', type: 'cmd', state1: this.switchArm.toString()};
    this.socketService$.sendMessage(str);
  }

  getImageSource(): string {
    return (this.state5 && this.state6) || this.state5 ? 'assets/images/sensor-on.png' : 'assets/images/sensor-off.png';
  }

  onMessage(message: any) {
    if (message.id == '0' && message.type === 'get') {
      this.state1 = message.state1 === '0'; //  1 OFF // alarm 12h
      this.state2 = message.state2 === '0'; // 1 OFF // alarm 1h
      this.state3 = message.state3 === '1' ? 'ON' : 'OFF';
      this.state4 = message.state4 === '1' ? 'ON' : 'OFF';
      this.state5 = message.state5 === '1'; // alarm 9h && 6h // 1 ON, 0 OFF
      this.state6 = message.state6 === '1'; // ? 'ON' : 'OFF';

      this.switchArm = message.state5 === '1';// alarm 9h && 6h // 1 ON, 0 OFF
      this.switchWarning = message.state6 === '1';// alarm 9h && 6h // 1 ON, 0 OFF

      this.isReady = message.ready === '1';
      if (message.ready === '0' && this.state5){ // not ready and ON arm
        this.toastr.warning('System not ready', 'Warning', {timeOut: 5000});
      }
    }
  }

}