From 5282108e289acbe25ebaff6a8ceaf0c4fd690f5b Mon Sep 17 00:00:00 2001
From: Chris Kaczor <chris@kaczorzoo.net>
Date: Wed, 16 Oct 2019 20:40:14 -0400
Subject: [PATCH] Add light to power chart

---
 .../power/charts/power-charts.component.ts    | 34 +++++++++++++++----
 .../models/weather/weather-value-grouped.ts   |  4 +++
 2 files changed, 32 insertions(+), 6 deletions(-)
 create mode 100644 Display/src/app/models/weather/weather-value-grouped.ts

diff --git a/Display/src/app/components/power/charts/power-charts.component.ts b/Display/src/app/components/power/charts/power-charts.component.ts
index 1ab88c0..59104ef 100644
--- a/Display/src/app/components/power/charts/power-charts.component.ts
+++ b/Display/src/app/components/power/charts/power-charts.component.ts
@@ -2,12 +2,15 @@ import { Component, OnInit } from '@angular/core';
 import { Chart } from 'angular-highcharts';
 import { SeriesLineOptions, SeriesWindbarbOptions } from 'highcharts';
 import { HttpClient } from '@angular/common/http';
-import { PowerStatusGrouped } from '../../../models/power/power-status-grouped';
+import { forkJoin } from 'rxjs';
+import { WeatherValueGrouped } from 'src/app/models/weather/weather-value-grouped';
+import { PowerStatusGrouped } from 'src/app/models/power/power-status-grouped';
 
 import * as moment from 'moment';
 
 import * as Highcharts from 'highcharts';
 import HC_exporting from 'highcharts/modules/exporting';
+
 HC_exporting(Highcharts);
 
 enum TimeSpan {
@@ -79,24 +82,31 @@ export class PowerChartsComponent implements OnInit {
         return moment(this.selectedDate).format('LL');
     }
 
-    private loadPowerChart(start: moment.Moment, end: moment.Moment) {
+    private async loadPowerChart(start: moment.Moment, end: moment.Moment) {
         const startString = start.toISOString();
         const endString = end.toISOString();
 
-        const request = this.httpClient.get<PowerStatusGrouped[]>(`/api/power/status/history-grouped?start=${startString}&end=${endString}&bucketMinutes=5`);
-
-        request.subscribe(data => {
+        forkJoin([
+            this.httpClient.get<PowerStatusGrouped[]>(`/api/power/status/history-grouped?start=${startString}&end=${endString}&bucketMinutes=5`),
+            this.httpClient.get<WeatherValueGrouped[]>(`/api/weather/readings/value-history-grouped?weatherValueType=LightLevel&start=${startString}&end=${endString}&bucketMinutes=5`)
+        ]).subscribe(data => {
             const seriesData: Array<SeriesLineOptions> = [];
 
             seriesData.push({ name: 'Generation', data: [], yAxis: 0, marker: { enabled: false }, tooltip: { valueSuffix: ' W' } } as SeriesLineOptions);
             seriesData.push({ name: 'Consumption', data: [], yAxis: 0, marker: { enabled: false }, tooltip: { valueSuffix: ' W' } } as SeriesLineOptions);
+            seriesData.push({ name: 'Light', data: [], yAxis: 1, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions);
 
-            data.forEach(dataElement => {
+            data[0].forEach(dataElement => {
                 const date = Date.parse(dataElement.bucket);
                 seriesData[0].data.push([date, dataElement.averageGeneration < 0 ? 0 : dataElement.averageGeneration]);
                 seriesData[1].data.push([date, dataElement.averageConsumption < 0 ? 0 : dataElement.averageConsumption]);
             });
 
+            data[1].forEach(dataElement => {
+                const date = Date.parse(dataElement.bucket);
+                seriesData[2].data.push([date, dataElement.averageValue * 100]);
+            });
+
             const title = this.selectedTimeSpan === TimeSpan.Last24Hours ? this.timeSpanItems[TimeSpan.Last24Hours] : this.getSelectedDateDisplayString();
 
             this.chart = new Chart({
@@ -131,6 +141,18 @@ export class PowerChartsComponent implements OnInit {
                         title: {
                             text: 'Power'
                         }
+                    },
+                    {
+                        visible: true,
+                        labels: {
+                            format: '{value:.2f}%'
+                        },
+                        title: {
+                            text: 'Light'
+                        },
+                        min: 0,
+                        max: 100,
+                        opposite: true
                     }
                 ],
                 time: {
diff --git a/Display/src/app/models/weather/weather-value-grouped.ts b/Display/src/app/models/weather/weather-value-grouped.ts
new file mode 100644
index 0000000..b4c1e0f
--- /dev/null
+++ b/Display/src/app/models/weather/weather-value-grouped.ts
@@ -0,0 +1,4 @@
+export class WeatherValueGrouped {
+    bucket: string;
+    averageValue: number;
+}