From ab793c5073902f7a88b6aa18c133d43a0afdcf4e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=B4me=20W?= <jerome@wnetworks.org>
Date: Wed, 27 Jan 2021 06:45:52 +0100
Subject: [PATCH] feat(invert): Negates/Inverts the data for a serie (#13)

---
 .devcontainer/ui-lovelace.yaml |  7 +++++++
 README.md                      |  1 +
 src/apexcharts-card.ts         | 22 +++++++++++++++-------
 src/types-config-ti.ts         |  1 +
 src/types-config.ts            |  1 +
 5 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/.devcontainer/ui-lovelace.yaml b/.devcontainer/ui-lovelace.yaml
index 6d979eb..08e4b44 100644
--- a/.devcontainer/ui-lovelace.yaml
+++ b/.devcontainer/ui-lovelace.yaml
@@ -169,6 +169,13 @@ views:
             dropShadow:
               enabled: true
         series:
+          - entity: sensor.random0_100
+            extend_to_end: false
+            type: column
+            invert: true
+            group_by:
+              func: avg
+              fill: 'null'
           - entity: sensor.random0_100
             extend_to_end: false
             type: column
diff --git a/README.md b/README.md
index cd2246f..b45dbec 100644
--- a/README.md
+++ b/README.md
@@ -116,6 +116,7 @@ The card stricly validates all the options available (but not for the `apex_conf
 | `extend_to_end` | boolean | `true` | v1.0.0 | If the last data is older than the end time displayed on the graph, setting to true will extend the value until the end of the timeline. Only works for `line` and `area` types. |
 | `unit` | string | | v1.0.0 | Override the unit of the sensor |
 | `group_by` | object | | v1.0.0 | See [group_by](#group_by-options) |
+| `invert` | boolean | `false` | NEXT_VERSION | Negates the data (`1` -> `-1`). Usefull to display opposites values like network in (standard)/out (inverted) |
 
 
 ### `show` Options
diff --git a/src/apexcharts-card.ts b/src/apexcharts-card.ts
index c4b2e5c..9e1fc82 100644
--- a/src/apexcharts-card.ts
+++ b/src/apexcharts-card.ts
@@ -336,13 +336,14 @@ class ChartsCard extends LitElement {
               this._lastState[index] = (this._lastState[index] as number).toFixed(1);
             }
           }
-          return {
-            data:
-              this._config?.series[index].extend_to_end && this._config?.series[index].type !== 'column'
-                ? // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                  [...graph.history, ...[[end.getTime(), graph.history.slice(-1)[0]![1]]]]
-                : graph.history,
-          };
+          let data: (number | null)[][] = [];
+          if (this._config?.series[index].extend_to_end && this._config?.series[index].type !== 'column') {
+            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+            data = [...graph.history, ...[[end.getTime(), graph.history.slice(-1)[0]![1]]]];
+          } else {
+            data = graph.history;
+          }
+          return this._config?.series[index].invert ? { data: this._invertData(data) } : { data };
         }),
         xaxis: {
           min: start.getTime(),
@@ -358,6 +359,13 @@ class ChartsCard extends LitElement {
     this._updating = false;
   }
 
+  private _invertData(data: (number | null)[][]): (number | null)[][] {
+    return data.map((item) => {
+      if (item[1] === null) return item;
+      return [item[0], -item[1]];
+    });
+  }
+
   private _getSpanDates(): { start: Date; end: Date } {
     let end = new Date();
     let start = new Date(end.getTime() - this._graphSpan + 1);
diff --git a/src/types-config-ti.ts b/src/types-config-ti.ts
index 7a486f6..ac48952 100644
--- a/src/types-config-ti.ts
+++ b/src/types-config-ti.ts
@@ -34,6 +34,7 @@ export const ChartCardSeriesExternalConfig = t.iface([], {
   "curve": t.opt(t.union(t.lit('smooth'), t.lit('straight'), t.lit('stepline'))),
   "extend_to_end": t.opt("boolean"),
   "unit": t.opt("string"),
+  "invert": t.opt("boolean"),
   "group_by": t.opt(t.iface([], {
     "duration": t.opt("string"),
     "func": t.opt("GroupByFunc"),
diff --git a/src/types-config.ts b/src/types-config.ts
index 0b8c085..a3a7164 100644
--- a/src/types-config.ts
+++ b/src/types-config.ts
@@ -28,6 +28,7 @@ export interface ChartCardSeriesExternalConfig {
   curve?: 'smooth' | 'straight' | 'stepline';
   extend_to_end?: boolean;
   unit?: string;
+  invert?: boolean;
   group_by?: {
     duration?: string;
     func?: GroupByFunc;