big update

2021-02-27 13:06:36 +01:00
parent 0dc3fdb9b8
commit eb5c9faa35
13 changed files with 746 additions and 169 deletions
--- a/Snapshot.go
+++ b/Snapshot.go
@@ -7,11 +7,19 @@ import (
 	"io/ioutil"
 )

-type SnapshotPayload struct {
-	Snapshots []*SnapshotRecord `json:"snapshots"`
+type UnixSnapshotPayload struct {
+	Snapshots []*UnixSnapshotRecord `json:"snapshots"`
 }

-type SnapshotRecord struct {
+type DatetimeSnapshotPayload struct {
+	Snapshots []*DatetimeSnapshotRecord `json:"snapshots"`
+}
+
+type UnixSnapshotRecord struct {
+
+}
+
+type DatetimeSnapshotRecord struct {
 	Id int `json:"id"`
 	JsonSnapshotSubmission
 }
@@ -30,8 +38,8 @@ type SnapshotSubmission struct {
 	Co2 interface{}
 }

-func createSnapshotSubFromJsonBodyStream(jsonBodyStream io.ReadCloser) (*SnapshotSubmission, error) {
-	var snapshotSub SnapshotSubmission
+func createSnapshotSubFromJsonBodyStream(jsonBodyStream io.ReadCloser) (*JsonSnapshotSubmission, error) {
+	var snapshotSub JsonSnapshotSubmission
 	body, err := ioutil.ReadAll(jsonBodyStream)
 	if err != nil {
 		return nil, fmt.Errorf("error reading body stream: %w", err)
@@ -47,8 +55,8 @@ func createSnapshotSubFromJsonBodyStream(jsonBodyStream io.ReadCloser) (*Snapsho
 	return &snapshotSub, nil
 }

-func createJsonFromSnapshotRecords(records []*SnapshotRecord) ([]byte, error) {
-	jsonResult, err := json.Marshal(SnapshotPayload{records})
+func createJsonFromSnapshotRecords(records []*DatetimeSnapshotRecord) ([]byte, error) {
+	jsonResult, err := json.Marshal(DatetimeSnapshotPayload{records})
 	if err != nil {
 		return nil, fmt.Errorf("couldn't marshal json: %w", err)
 	}
--- a/database.go
+++ b/database.go
@@ -49,8 +49,8 @@ func writeSnapshotToDb(snapshotSub *SnapshotSubmission) (int64, error) {
 	return id, nil
 }

-func getLastSnapshotRecordFromDb() (*SnapshotRecord, error) {
-	var snapshotRecord SnapshotRecord
+func fetchLastSnapshotWithDatetime() (*DatetimeSnapshotRecord, error) {
+	var snapshotRecord DatetimeSnapshotRecord
 	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` ORDER BY `id` DESC LIMIT 1;"
 	rows, err := ClimateDb.Query(fmt.Sprintf(query, "id", "temp", "humidity", "co2", "time"))
 	if err != nil {
@@ -70,15 +70,15 @@ func getLastSnapshotRecordFromDb() (*SnapshotRecord, error) {
 	return &snapshotRecord, nil
 }

-func getSnapshotRecordsFromDb(dateSince string) ([]*SnapshotRecord, error) {
-	snapshots := make([]*SnapshotRecord, 0)
-	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` WHERE TIMESTAMPDIFF(SECOND, `%s`, '%s') < 0 ORDER BY `id` DESC;"
+func fetchUnixTimeSnapshotsSince(dateSince int) ([]*DatetimeSnapshotRecord, error) {
+	snapshots := make([]*DatetimeSnapshotRecord, 0)
+	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` WHERE UNIX(SECOND, `%s`, '%s') < 0 ORDER BY `id` DESC;"
 	rows, err := ClimateDb.Query(fmt.Sprintf(query, "id", "temp", "humidity", "co2", "time", "time", dateSince))
 	if err != nil {
 		return nil, fmt.Errorf("couldn't execute select query: %w", err)
 	}
 	for rows.Next() {
-		var snapshotRecord SnapshotRecord
+		var snapshotRecord DatetimeSnapshotRecord
 		err = rows.Scan(
 			&snapshotRecord.Id,
 			&snapshotRecord.Temp,
@@ -87,7 +87,81 @@ func getSnapshotRecordsFromDb(dateSince string) ([]*SnapshotRecord, error) {
 			&snapshotRecord.Timestamp,
 		)
 		if err != nil {
-			return nil, fmt.Errorf("couldn't read rows from the database: %w", err)
+			return nil, fmt.Errorf("error reading rows since %v with unixtime from the database: %w", dateSince, err)
+		}
+		snapshots = append(snapshots, &snapshotRecord)
+	}
+	return snapshots, nil
+}
+
+func fetchDatetimeSnapshotsSince(dateSince string) ([]*DatetimeSnapshotRecord, error) {
+	snapshots := make([]*DatetimeSnapshotRecord, 0)
+	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` WHERE TIMESTAMPDIFF(SECOND, `%s`, '%s') < 0 ORDER BY `id` DESC;"
+	rows, err := ClimateDb.Query(fmt.Sprintf(query, "id", "temp", "humidity", "co2", "time", "time", dateSince))
+	if err != nil {
+		return nil, fmt.Errorf("couldn't execute select query: %w", err)
+	}
+	for rows.Next() {
+		var snapshotRecord DatetimeSnapshotRecord
+		err = rows.Scan(
+			&snapshotRecord.Id,
+			&snapshotRecord.Temp,
+			&snapshotRecord.Humidity,
+			&snapshotRecord.Co2,
+			&snapshotRecord.Timestamp,
+		)
+		if err != nil {
+			return nil, fmt.Errorf("error reading rows since %s with datetime from the database: %w", dateSince, err)
+		}
+		snapshots = append(snapshots, &snapshotRecord)
+	}
+	return snapshots, nil
+}
+
+func fetchUnixTimeSnapshotsBetween(startTime int, endTime int) ([]*DatetimeSnapshotRecord, error) {
+	snapshots := make([]*DatetimeSnapshotRecord, 0)
+	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` WHERE TIMESTAMPDIFF(SECOND, `%s`, '%s') < 0 ORDER BY `id` DESC;"
+	rows, err := ClimateDb.Query(fmt.Sprintf(query, "id", "temp", "humidity", "co2", "time", "time", startTime, endTime))
+	if err != nil {
+		return nil, fmt.Errorf("couldn't execute select query: %w", err)
+	}
+	for rows.Next() {
+		var snapshotRecord DatetimeSnapshotRecord
+		err = rows.Scan(
+			&snapshotRecord.Id,
+			&snapshotRecord.Temp,
+			&snapshotRecord.Humidity,
+			&snapshotRecord.Co2,
+			&snapshotRecord.Timestamp,
+		)
+		if err != nil {
+			return nil, fmt.Errorf(
+				"couldn't read rows from the database b/w %v and %v with datetime: %w", startTime, endTime, err)
+		}
+		snapshots = append(snapshots, &snapshotRecord)
+	}
+	return snapshots, nil
+}
+
+func fetchDatetimeSnapshotsBetween(startTime string, endTime string) ([]*DatetimeSnapshotRecord, error) {
+	snapshots := make([]*DatetimeSnapshotRecord, 0)
+	query := "SELECT `%s`, `%s`, `%s`, `%s`, `%s` FROM `snapshots` WHERE TIMESTAMPDIFF(SECOND, `%s`, '%s') < 0 ORDER BY `id` DESC;"
+	rows, err := ClimateDb.Query(fmt.Sprintf(query, "id", "temp", "humidity", "co2", "time", "time", startTime, endTime))
+	if err != nil {
+		return nil, fmt.Errorf("couldn't execute select query: %w", err)
+	}
+	for rows.Next() {
+		var snapshotRecord DatetimeSnapshotRecord
+		err = rows.Scan(
+			&snapshotRecord.Id,
+			&snapshotRecord.Temp,
+			&snapshotRecord.Humidity,
+			&snapshotRecord.Co2,
+			&snapshotRecord.Timestamp,
+		)
+		if err != nil {
+			return nil, fmt.Errorf(
+				"couldn't read rows from the database b/w %v and %v with unix time: %w", startTime, endTime, err)
 		}
 		snapshots = append(snapshots, &snapshotRecord)
 	}
--- a/server.go
+++ b/server.go
@@ -53,7 +53,7 @@ func sendData(w http.ResponseWriter, r *http.Request) {
 		}
 		dateSince = strings.Split(newDateSince.Format(time.RFC3339Nano), "Z")[0]
 	}
-	records, err := getSnapshotRecordsFromDb(dateSince)
+	records, err := fetchDatetimeSnapshotsSince(dateSince)
 	if internalErrorOnErr(fmt.Errorf("couldn't get snapshots from db: %w", err), w, r) { return }
 	json, err := createJsonFromSnapshotRecords(records)
 	if internalErrorOnErr(fmt.Errorf("couldn't create json from snapshots: %w", err), w, r) { return }
@@ -67,8 +67,8 @@ func createAndSendSnapshot(w http.ResponseWriter, r *http.Request) {
 	if internalErrorOnErr(fmt.Errorf("couldn't create a snapshot: %w", err), w, r) { return }
 	_, err = writeSnapshotToDb(snapshot)
 	if internalErrorOnErr(fmt.Errorf("couldn't save snapshot to db: %w", err), w, r) { return }
-	dbSnapshotRecord, err := getLastSnapshotRecordFromDb()
-	json, err := createJsonFromSnapshotRecords([]*SnapshotRecord{dbSnapshotRecord})
+	dbSnapshotRecord, err := fetchLastSnapshotWithDatetime()
+	json, err := createJsonFromSnapshotRecords([]*DatetimeSnapshotRecord{dbSnapshotRecord})
 	if internalErrorOnErr(fmt.Errorf("couldn't create json from last snapshots: %w", err), w, r) { return }
 	w.Header().Set("Content-Type", "application/json")
 	_, err = fmt.Fprintf(w, string(json))
--- a/webapp/dist/charts-dev.html
+++ b/webapp/dist/charts-dev.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Ledda's Room Climate</title>
+    <link href="styles.css" rel="stylesheet" />
+    <script src="main.js"></script>
+</head>
+<body>
+    <div id="root"></div>
+</body>
+</html>
--- a/webapp/dist/main.js.LICENSE.txt
+++ b/webapp/dist/main.js.LICENSE.txt
@@ -0,0 +1,6 @@
+/*!
+ * Chart.js v2.9.4
+ * https://www.chartjs.org
+ * (c) 2020 Chart.js Contributors
+ * Released under the MIT License
+ */
--- a/webapp/package-lock.json
+++ b/webapp/package-lock.json
@@ -189,8 +189,7 @@
    "@babel/helper-validator-identifier": {
      "version": "7.10.4",
      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.10.4.tgz",
-      "integrity": "sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw==",
-      "dev": true
+      "integrity": "sha512-3U9y+43hz7ZM+rzG24Qe2mufW5KhvFg/NhnNph+i9mgCtdTCtMJuI1TMkrIUiK7Ix4PYlRF9I5dhqaLYA/ADXw=="
    },
    "@babel/helpers": {
      "version": "7.12.5",
@@ -207,7 +206,6 @@
      "version": "7.10.4",
      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.10.4.tgz",
      "integrity": "sha512-i6rgnR/YgPEQzZZnbTHHuZdlE8qyoBNalD6F+q4vAFlcMEcqmkoG+mPqJYJCo63qPf74+Y1UZsl3l6f7/RIkmA==",
-      "dev": true,
      "requires": {
        "@babel/helper-validator-identifier": "^7.10.4",
        "chalk": "^2.0.0",
@@ -392,6 +390,43 @@
        "to-fast-properties": "^2.0.0"
      }
    },
+    "@eslint/eslintrc": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.3.0.tgz",
+      "integrity": "sha512-1JTKgrOKAHVivSvOYw+sJOunkBjUOvjqWk1DPja7ZFhIS2mX/4EgTT8M7eTK9jrKhL/FvXXEbQwIs3pg1xp3dg==",
+      "requires": {
+        "ajv": "^6.12.4",
+        "debug": "^4.1.1",
+        "espree": "^7.3.0",
+        "globals": "^12.1.0",
+        "ignore": "^4.0.6",
+        "import-fresh": "^3.2.1",
+        "js-yaml": "^3.13.1",
+        "lodash": "^4.17.20",
+        "minimatch": "^3.0.4",
+        "strip-json-comments": "^3.1.1"
+      },
+      "dependencies": {
+        "globals": {
+          "version": "12.4.0",
+          "resolved": "https://registry.npmjs.org/globals/-/globals-12.4.0.tgz",
+          "integrity": "sha512-BWICuzzDvDoH54NHKCseDanAhE3CeDorgDL5MT6LMXXj2WCnd9UC2szdk4AWLfjdgNBCXLUanXYcpBBKOSWGwg==",
+          "requires": {
+            "type-fest": "^0.8.1"
+          }
+        },
+        "ignore": {
+          "version": "4.0.6",
+          "resolved": "https://registry.npmjs.org/ignore/-/ignore-4.0.6.tgz",
+          "integrity": "sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg=="
+        },
+        "type-fest": {
+          "version": "0.8.1",
+          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.8.1.tgz",
+          "integrity": "sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA=="
+        }
+      }
+    },
    "@mrmlnc/readdir-enhanced": {
      "version": "2.2.1",
      "resolved": "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
@@ -451,11 +486,6 @@
        "moment": "^2.10.2"
      }
    },
-    "@types/chartist": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@types/chartist/-/chartist-0.11.0.tgz",
-      "integrity": "sha512-YDJuUm0TkKj2WW6GlYmhOuBkaYzZBGJMvZz1X+Qp0Oj8oY3aozQ/YeWw4aNhfpyk5df0DKf6psjMftJI+GThtA=="
-    },
    "@types/eslint": {
      "version": "7.2.4",
      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.4.tgz",
@@ -815,6 +845,11 @@
      "integrity": "sha512-XNP0PqF1XD19ZlLKvB7cMmnZswW4C/03pRHgirB30uSJTaS3A3V1/P4sS3HPvFmjoriPCJQs+JDSbm4bL1TxGQ==",
      "dev": true
    },
+    "acorn-jsx": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.1.tgz",
+      "integrity": "sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng=="
+    },
    "ajv": {
      "version": "6.12.6",
      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -839,8 +874,7 @@
    "ansi-colors": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz",
-      "integrity": "sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA==",
-      "dev": true
+      "integrity": "sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA=="
    },
    "ansi-escapes": {
      "version": "4.3.1",
@@ -859,8 +893,7 @@
    "ansi-regex": {
      "version": "5.0.0",
      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.0.tgz",
-      "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==",
-      "dev": true
+      "integrity": "sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg=="
    },
    "ansi-styles": {
      "version": "3.2.1",
@@ -984,6 +1017,14 @@
        }
      }
    },
+    "argparse": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+      "requires": {
+        "sprintf-js": "~1.0.2"
+      }
+    },
    "arr-diff": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
@@ -1077,6 +1118,11 @@
        }
      }
    },
+    "astral-regex": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
+      "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ=="
+    },
    "async": {
      "version": "2.6.3",
      "resolved": "https://registry.npmjs.org/async/-/async-2.6.3.tgz",
@@ -1405,6 +1451,11 @@
      "integrity": "sha1-JtII6onje1y95gJQoV8DHBak1ms=",
      "dev": true
    },
+    "callsites": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
+      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ=="
+    },
    "camelcase": {
      "version": "6.2.0",
      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.2.0.tgz",
@@ -1433,7 +1484,6 @@
      "version": "2.4.2",
      "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
      "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-      "dev": true,
      "requires": {
        "ansi-styles": "^3.2.1",
        "escape-string-regexp": "^1.0.5",
@@ -1443,14 +1493,12 @@
        "has-flag": {
          "version": "3.0.0",
          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
-          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
-          "dev": true
+          "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0="
        },
        "supports-color": {
          "version": "5.5.0",
          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
          "requires": {
            "has-flag": "^3.0.0"
          }
@@ -1472,11 +1520,6 @@
        "moment": "^2.10.2"
      }
    },
-    "chartist": {
-      "version": "0.11.4",
-      "resolved": "https://registry.npmjs.org/chartist/-/chartist-0.11.4.tgz",
-      "integrity": "sha512-H4AimxaUD738/u9Mq8t27J4lh6STsLi4BQHt65nOtpLk3xyrBPaLiLMrHw7/WV9CmsjGA02WihjuL5qpSagLYw=="
-    },
    "chartjs-color": {
      "version": "2.4.1",
      "resolved": "https://registry.npmjs.org/chartjs-color/-/chartjs-color-2.4.1.tgz",
@@ -1958,7 +2001,6 @@
      "version": "7.0.3",
      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",
      "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==",
-      "dev": true,
      "requires": {
        "path-key": "^3.1.0",
        "shebang-command": "^2.0.0",
@@ -2074,6 +2116,11 @@
      "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
      "dev": true
    },
+    "deep-is": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
+      "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ="
+    },
    "default-gateway": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/default-gateway/-/default-gateway-4.2.0.tgz",
@@ -2309,6 +2356,14 @@
        "buffer-indexof": "^1.0.0"
      }
    },
+    "doctrine": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-3.0.0.tgz",
+      "integrity": "sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==",
+      "requires": {
+        "esutils": "^2.0.2"
+      }
+    },
    "download-stats": {
      "version": "0.3.4",
      "resolved": "https://registry.npmjs.org/download-stats/-/download-stats-0.3.4.tgz",
@@ -2374,8 +2429,7 @@
    "emoji-regex": {
      "version": "8.0.0",
      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
    },
    "emojis-list": {
      "version": "3.0.0",
@@ -2411,7 +2465,6 @@
      "version": "2.3.6",
      "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.3.6.tgz",
      "integrity": "sha512-yjNnPr315/FjS4zIsUxYguYUPP2e1NK4d7E7ZOLiyYCcbFBiTMyID+2wvm2w6+pZ/odMA7cRkjhsPbltwBOrLg==",
-      "dev": true,
      "requires": {
        "ansi-colors": "^4.1.1"
      }
@@ -2497,30 +2550,209 @@
    "escape-string-regexp": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
-      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=",
-      "dev": true
+      "integrity": "sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ="
+    },
+    "eslint": {
+      "version": "7.20.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-7.20.0.tgz",
+      "integrity": "sha512-qGi0CTcOGP2OtCQBgWZlQjcTuP0XkIpYFj25XtRTQSHC+umNnp7UMshr2G8SLsRFYDdAPFeHOsiteadmMH02Yw==",
+      "requires": {
+        "@babel/code-frame": "7.12.11",
+        "@eslint/eslintrc": "^0.3.0",
+        "ajv": "^6.10.0",
+        "chalk": "^4.0.0",
+        "cross-spawn": "^7.0.2",
+        "debug": "^4.0.1",
+        "doctrine": "^3.0.0",
+        "enquirer": "^2.3.5",
+        "eslint-scope": "^5.1.1",
+        "eslint-utils": "^2.1.0",
+        "eslint-visitor-keys": "^2.0.0",
+        "espree": "^7.3.1",
+        "esquery": "^1.4.0",
+        "esutils": "^2.0.2",
+        "file-entry-cache": "^6.0.0",
+        "functional-red-black-tree": "^1.0.1",
+        "glob-parent": "^5.0.0",
+        "globals": "^12.1.0",
+        "ignore": "^4.0.6",
+        "import-fresh": "^3.0.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "js-yaml": "^3.13.1",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "levn": "^0.4.1",
+        "lodash": "^4.17.20",
+        "minimatch": "^3.0.4",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.1",
+        "progress": "^2.0.0",
+        "regexpp": "^3.1.0",
+        "semver": "^7.2.1",
+        "strip-ansi": "^6.0.0",
+        "strip-json-comments": "^3.1.0",
+        "table": "^6.0.4",
+        "text-table": "^0.2.0",
+        "v8-compile-cache": "^2.0.3"
+      },
+      "dependencies": {
+        "@babel/code-frame": {
+          "version": "7.12.11",
+          "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.11.tgz",
+          "integrity": "sha512-Zt1yodBx1UcyiePMSkWnU4hPqhwq7hGi2nFL1LeA3EUl+q2LQx16MISgJ0+z7dnmgvP9QtIleuETGOiOH1RcIw==",
+          "requires": {
+            "@babel/highlight": "^7.10.4"
+          }
+        },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.0.tgz",
+          "integrity": "sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==",
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        },
+        "glob-parent": {
+          "version": "5.1.1",
+          "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz",
+          "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==",
+          "requires": {
+            "is-glob": "^4.0.1"
+          }
+        },
+        "globals": {
+          "version": "12.4.0",
+          "resolved": "https://registry.npmjs.org/globals/-/globals-12.4.0.tgz",
+          "integrity": "sha512-BWICuzzDvDoH54NHKCseDanAhE3CeDorgDL5MT6LMXXj2WCnd9UC2szdk4AWLfjdgNBCXLUanXYcpBBKOSWGwg==",
+          "requires": {
+            "type-fest": "^0.8.1"
+          }
+        },
+        "ignore": {
+          "version": "4.0.6",
+          "resolved": "https://registry.npmjs.org/ignore/-/ignore-4.0.6.tgz",
+          "integrity": "sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg=="
+        },
+        "semver": {
+          "version": "7.3.4",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-7.3.4.tgz",
+          "integrity": "sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==",
+          "requires": {
+            "lru-cache": "^6.0.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "6.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
+          "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
+          "requires": {
+            "ansi-regex": "^5.0.0"
+          }
+        },
+        "type-fest": {
+          "version": "0.8.1",
+          "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.8.1.tgz",
+          "integrity": "sha512-4dbzIzqvjtgiM5rw1k5rEHtBANKmdudhGyBEajN01fEyhaAIhsoKNy6y7+IN93IfpFtwY9iqi7kD+xwKhQsNJA=="
+        }
+      }
    },
    "eslint-scope": {
      "version": "5.1.1",
      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
      "integrity": "sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==",
-      "dev": true,
      "requires": {
        "esrecurse": "^4.3.0",
        "estraverse": "^4.1.1"
      }
    },
+    "eslint-utils": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/eslint-utils/-/eslint-utils-2.1.0.tgz",
+      "integrity": "sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==",
+      "requires": {
+        "eslint-visitor-keys": "^1.1.0"
+      },
+      "dependencies": {
+        "eslint-visitor-keys": {
+          "version": "1.3.0",
+          "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz",
+          "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ=="
+        }
+      }
+    },
+    "eslint-visitor-keys": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz",
+      "integrity": "sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ=="
+    },
+    "espree": {
+      "version": "7.3.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-7.3.1.tgz",
+      "integrity": "sha512-v3JCNCE64umkFpmkFGqzVKsOT0tN1Zr+ueqLZfpV1Ob8e+CEgPWa+OxCoGH3tnhimMKIaBm4m/vaRpJ/krRz2g==",
+      "requires": {
+        "acorn": "^7.4.0",
+        "acorn-jsx": "^5.3.1",
+        "eslint-visitor-keys": "^1.3.0"
+      },
+      "dependencies": {
+        "acorn": {
+          "version": "7.4.1",
+          "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
+          "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A=="
+        },
+        "eslint-visitor-keys": {
+          "version": "1.3.0",
+          "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz",
+          "integrity": "sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ=="
+        }
+      }
+    },
    "esprima": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
-      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
-      "dev": true
+      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A=="
+    },
+    "esquery": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.4.0.tgz",
+      "integrity": "sha512-cCDispWt5vHHtwMY2YrAQ4ibFkAL8RbH5YGBnZBc90MolvvfkkQcJro/aZiAQUlQ3qgrYS6D6v8Gc5G5CQsc9w==",
+      "requires": {
+        "estraverse": "^5.1.0"
+      },
+      "dependencies": {
+        "estraverse": {
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
+          "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ=="
+        }
+      }
    },
    "esrecurse": {
      "version": "4.3.0",
      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
-      "dev": true,
      "requires": {
        "estraverse": "^5.2.0"
      },
@@ -2528,16 +2760,19 @@
        "estraverse": {
          "version": "5.2.0",
          "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.2.0.tgz",
-          "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==",
-          "dev": true
+          "integrity": "sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ=="
        }
      }
    },
    "estraverse": {
      "version": "4.3.0",
      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-4.3.0.tgz",
-      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==",
-      "dev": true
+      "integrity": "sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw=="
+    },
+    "esutils": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g=="
    },
    "etag": {
      "version": "1.8.1",
@@ -2931,6 +3166,11 @@
      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw=="
    },
+    "fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
+    },
    "faye-websocket": {
      "version": "0.10.0",
      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.10.0.tgz",
@@ -2948,6 +3188,14 @@
        "escape-string-regexp": "^1.0.5"
      }
    },
+    "file-entry-cache": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-6.0.1.tgz",
+      "integrity": "sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==",
+      "requires": {
+        "flat-cache": "^3.0.4"
+      }
+    },
    "file-uri-to-path": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
@@ -3120,6 +3368,30 @@
        }
      }
    },
+    "flat-cache": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
+      "integrity": "sha512-dm9s5Pw7Jc0GvMYbshN6zchCA9RgQlzzEZX3vylR9IqFfS8XciblUXOKfW6SiuJ0e13eDYZoZV5wdrev7P3Nwg==",
+      "requires": {
+        "flatted": "^3.1.0",
+        "rimraf": "^3.0.2"
+      },
+      "dependencies": {
+        "rimraf": {
+          "version": "3.0.2",
+          "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz",
+          "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==",
+          "requires": {
+            "glob": "^7.1.3"
+          }
+        }
+      }
+    },
+    "flatted": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.1.1.tgz",
+      "integrity": "sha512-zAoAQiudy+r5SvnSw3KJy5os/oRJYHzrzja/tBDqrZtNhUw8bt6y8OBzMWcjWr+8liV8Eb6yOhw8WZ7VFZ5ZzA=="
+    },
    "flow-parser": {
      "version": "0.137.0",
      "resolved": "https://registry.npmjs.org/flow-parser/-/flow-parser-0.137.0.tgz",
@@ -3209,6 +3481,11 @@
      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz",
      "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A=="
    },
+    "functional-red-black-tree": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
+      "integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc="
+    },
    "gensync": {
      "version": "1.0.0-beta.2",
      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
@@ -3498,8 +3775,7 @@
    "has-flag": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-      "dev": true
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
    },
    "has-symbols": {
      "version": "1.0.1",
@@ -3808,6 +4084,22 @@
      "integrity": "sha512-Pgs951kaMm5GXP7MOvxERINe3gsaVjUWFm+UZPSq9xYriQAksyhg0csnS0KXSNRD5NmNdapXEpjxG49+AKh/ug==",
      "dev": true
    },
+    "import-fresh": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
+      "integrity": "sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==",
+      "requires": {
+        "parent-module": "^1.0.0",
+        "resolve-from": "^4.0.0"
+      },
+      "dependencies": {
+        "resolve-from": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
+          "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g=="
+        }
+      }
+    },
    "import-local": {
      "version": "3.0.2",
      "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.0.2.tgz",
@@ -3821,8 +4113,7 @@
    "imurmurhash": {
      "version": "0.1.4",
      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
-      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=",
-      "dev": true
+      "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o="
    },
    "indexes-of": {
      "version": "1.0.1",
@@ -4060,8 +4351,7 @@
    "is-fullwidth-code-point": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
    },
    "is-glob": {
      "version": "4.0.1",
@@ -4254,8 +4544,16 @@
    "js-tokens": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
+    },
+    "js-yaml": {
+      "version": "3.14.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.1.tgz",
+      "integrity": "sha512-okMH7OXXJ7YrN9Ok3/SXrnu4iX9yOk+25nqX4imS2npuvTYDmo/QEZoqwZkYaIDk3jVvBOTOIEgEhaLOynBS9g==",
+      "requires": {
+        "argparse": "^1.0.7",
+        "esprima": "^4.0.0"
+      }
    },
    "jsbn": {
      "version": "0.1.1",
@@ -4430,6 +4728,11 @@
      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg=="
    },
+    "json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE="
+    },
    "json-stringify-safe": {
      "version": "5.0.1",
      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
@@ -4502,6 +4805,15 @@
      "integrity": "sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A==",
      "dev": true
    },
+    "levn": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
+      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
+      "requires": {
+        "prelude-ls": "^1.2.1",
+        "type-check": "~0.4.0"
+      }
+    },
    "line-column": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/line-column/-/line-column-1.0.2.tgz",
@@ -4616,6 +4928,14 @@
      "integrity": "sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==",
      "dev": true
    },
+    "lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "requires": {
+        "yallist": "^4.0.0"
+      }
+    },
    "make-dir": {
      "version": "2.1.0",
      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
@@ -4949,6 +5269,11 @@
        "to-regex": "^3.0.1"
      }
    },
+    "natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc="
+    },
    "negotiator": {
      "version": "0.6.2",
      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
@@ -5165,6 +5490,19 @@
        "is-wsl": "^1.1.0"
      }
    },
+    "optionator": {
+      "version": "0.9.1",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz",
+      "integrity": "sha512-74RlY5FCnhq4jRxVUPKDaRwrVNXMqsGsiW6AJw4XK8hmtm10wC0ypZBLw5IIp85NZMr91+qd1RvvENwg7jjRFw==",
+      "requires": {
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.3"
+      }
+    },
    "original": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/original/-/original-1.0.2.tgz",
@@ -5240,6 +5578,14 @@
        "axios": "^0.18.0"
      }
    },
+    "parent-module": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
+      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
+      "requires": {
+        "callsites": "^3.0.0"
+      }
+    },
    "parse-json": {
      "version": "5.1.0",
      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.1.0.tgz",
@@ -5292,8 +5638,7 @@
    "path-key": {
      "version": "3.1.1",
      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
-      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
-      "dev": true
+      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q=="
    },
    "path-parse": {
      "version": "1.0.6",
@@ -5461,6 +5806,11 @@
      "integrity": "sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==",
      "dev": true
    },
+    "prelude-ls": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
+      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g=="
+    },
    "prepend-http": {
      "version": "1.0.4",
      "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-1.0.4.tgz",
@@ -5484,6 +5834,11 @@
      "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
    },
+    "progress": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
+      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA=="
+    },
    "proxy-addr": {
      "version": "2.0.6",
      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
@@ -5865,6 +6220,11 @@
        }
      }
    },
+    "regexpp": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-3.1.0.tgz",
+      "integrity": "sha512-ZOIzd8yVsQQA7j8GCSlPGXwg5PfmA1mrq0JP4nGhh54LaKN3xdai/vHUDu74pKwV8OxseMS65u2NImosQcSD0Q=="
+    },
    "remove-trailing-separator": {
      "version": "1.1.0",
      "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
@@ -5919,6 +6279,11 @@
      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
    },
+    "require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="
+    },
    "require-main-filename": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
@@ -6258,7 +6623,6 @@
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
-      "dev": true,
      "requires": {
        "shebang-regex": "^3.0.0"
      }
@@ -6266,8 +6630,7 @@
    "shebang-regex": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
-      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
-      "dev": true
+      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A=="
    },
    "shelljs": {
      "version": "0.8.4",
@@ -6308,6 +6671,39 @@
      "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=",
      "dev": true
    },
+    "slice-ansi": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz",
+      "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==",
+      "requires": {
+        "ansi-styles": "^4.0.0",
+        "astral-regex": "^2.0.0",
+        "is-fullwidth-code-point": "^3.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+        }
+      }
+    },
    "snapdragon": {
      "version": "0.8.2",
      "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz",
@@ -6568,6 +6964,11 @@
        "extend-shallow": "^3.0.0"
      }
    },
+    "sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw="
+    },
    "sshpk": {
      "version": "1.16.1",
      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
@@ -6619,7 +7020,6 @@
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.0.tgz",
      "integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
-      "dev": true,
      "requires": {
        "emoji-regex": "^8.0.0",
        "is-fullwidth-code-point": "^3.0.0",
@@ -6630,7 +7030,6 @@
          "version": "6.0.0",
          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.0.tgz",
          "integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
-          "dev": true,
          "requires": {
            "ansi-regex": "^5.0.0"
          }
@@ -6719,6 +7118,11 @@
      "integrity": "sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==",
      "dev": true
    },
+    "strip-json-comments": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
+      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig=="
+    },
    "style-loader": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-2.0.0.tgz",
@@ -6733,11 +7137,39 @@
      "version": "7.2.0",
      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-      "dev": true,
      "requires": {
        "has-flag": "^4.0.0"
      }
    },
+    "table": {
+      "version": "6.0.7",
+      "resolved": "https://registry.npmjs.org/table/-/table-6.0.7.tgz",
+      "integrity": "sha512-rxZevLGTUzWna/qBLObOe16kB2RTnnbhciwgPbMMlazz1yZGVEgnZK762xyVdVznhqxrfCeBMmMkgOOaPwjH7g==",
+      "requires": {
+        "ajv": "^7.0.2",
+        "lodash": "^4.17.20",
+        "slice-ansi": "^4.0.0",
+        "string-width": "^4.2.0"
+      },
+      "dependencies": {
+        "ajv": {
+          "version": "7.1.1",
+          "resolved": "https://registry.npmjs.org/ajv/-/ajv-7.1.1.tgz",
+          "integrity": "sha512-ga/aqDYnUy/o7vbsRTFhhTsNeXiYb5JWDIcRIeZfwRNCefwjNTVYCGdGSUrEmiu3yDK3vFvNbgJxvrQW4JXrYQ==",
+          "requires": {
+            "fast-deep-equal": "^3.1.1",
+            "json-schema-traverse": "^1.0.0",
+            "require-from-string": "^2.0.2",
+            "uri-js": "^4.2.2"
+          }
+        },
+        "json-schema-traverse": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+          "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="
+        }
+      }
+    },
    "table-layout": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/table-layout/-/table-layout-1.0.1.tgz",
@@ -6812,8 +7244,7 @@
    "text-table": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/text-table/-/text-table-0.2.0.tgz",
-      "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=",
-      "dev": true
+      "integrity": "sha1-f17oI66AUgfACvLfSoTsP8+lcLQ="
    },
    "textextensions": {
      "version": "2.6.0",
@@ -6978,6 +7409,14 @@
      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
      "dev": true
    },
+    "type-check": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
+      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
+      "requires": {
+        "prelude-ls": "^1.2.1"
+      }
+    },
    "type-fest": {
      "version": "0.11.0",
      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.11.0.tgz",
@@ -7150,8 +7589,7 @@
    "v8-compile-cache": {
      "version": "2.2.0",
      "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.2.0.tgz",
-      "integrity": "sha512-gTpR5XQNKFwOd4clxfnhaqvfqMpqEwr4tOtCyz4MtYZX2JYhfr1JvBFKdS+7K/9rfpZR3VLX+YWBbKoxCgS43Q==",
-      "dev": true
+      "integrity": "sha512-gTpR5XQNKFwOd4clxfnhaqvfqMpqEwr4tOtCyz4MtYZX2JYhfr1JvBFKdS+7K/9rfpZR3VLX+YWBbKoxCgS43Q=="
    },
    "validate-npm-package-license": {
      "version": "3.0.4",
@@ -7561,7 +7999,6 @@
      "version": "2.0.2",
      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
-      "dev": true,
      "requires": {
        "isexe": "^2.0.0"
      }
@@ -7582,6 +8019,11 @@
        "pify": "^4.0.1"
      }
    },
+    "word-wrap": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
+      "integrity": "sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ=="
+    },
    "wordwrapjs": {
      "version": "4.0.0",
      "resolved": "https://registry.npmjs.org/wordwrapjs/-/wordwrapjs-4.0.0.tgz",
@@ -7666,6 +8108,11 @@
      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
      "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
    },
+    "yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
+    },
    "yargs": {
      "version": "13.3.2",
      "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -25,6 +25,7 @@
  "dependencies": {
    "@types/chart.js": "^2.9.27",
    "chart.js": "^2.9.4",
+    "eslint": "^7.20.0",
    "webpack-dev-server": "^3.11.0"
  }
 }
--- a/webapp/src/ClimateChartWidget.ts
+++ b/webapp/src/ClimateChartWidget.ts
@@ -14,7 +14,7 @@ class ClimateChartWidget implements UIComponent {
    private readonly skeleton: GridWidget;
    private chart: Chart | null;
    private displayMode: DisplayMode = "pastMins";
-    private displayedWin: TimeWindow;
+    private displayedWin: TimeWindow | null;
    private latestSnapshotInChartTime: number;
    private readonly canvasElement: HTMLCanvasElement = document.createElement("canvas");

@@ -23,7 +23,9 @@ class ClimateChartWidget implements UIComponent {
            ...gridProps,
            body: this.canvasElement,
        });
-        this.latestSnapshotInChartTime = new Date().getTime() - getAppState().minutesDisplayed * 60000;
+        const now = new Date().getTime();
+        this.latestSnapshotInChartTime = now - getAppState().minutesDisplayed * 60000;
+        this.displayedWin = { start: this.latestSnapshotInChartTime, stop: now };
        this.setupListeners();
        this.initChart().catch((e) => {
            AppStore().setLoading(false);
@@ -32,7 +34,7 @@ class ClimateChartWidget implements UIComponent {
    }

    private setupListeners() {
-        AppStore().subscribe("displayMode", () => this.update());
+        AppStore().subscribe("displayMode", () => this.updateDisplayMode());
        AppStore().subscribe("minutesDisplayed", () => this.update());
        AppStore().subscribe("displayWindow", () => this.update());
        AppStore().subscribe("snapshots", () => this.update());
@@ -45,16 +47,21 @@ class ClimateChartWidget implements UIComponent {
        AppStore().setLoading(false);
    }
    
+    private async updateDisplayMode() {
+        this.displayMode = getAppState().displayMode;
+        await this.update();
+    }
+
    private async update() {
        if (getAppState().displayMode === "window") {
-            await this.updateChartFromTimeWindow(getAppState().displayWindow);
            this.displayedWin = getAppState().displayWindow;
+            await this.updateChartFromTimeWindow(this.displayedWin);
        } else if (getAppState().displayMode === "pastMins" && this.displayMode !== "pastMins") {
            const now = new Date().getTime();
            const newTimeWindow = { start: now - getAppState().minutesDisplayed * 60000, stop: now };
            await this.updateChartFromTimeWindow(newTimeWindow);
        } else {
-            await this.updateChartFromMinuteSpan(getAppState().minutesDisplayed);
+            await this.updateChartFromMinuteSpan();
        }
        this.chart.update();
    }
@@ -75,19 +82,22 @@ class ClimateChartWidget implements UIComponent {
        }
    }

-    private async updateChartFromMinuteSpan(mins: number) {
+    private async updateChartFromMinuteSpan() {
        const now = new Date().getTime();
+        const mins = getAppState().minutesDisplayed;
        this.removePointsOlderThan(now - mins * 60000);
        this.appendSnapshots(await AppStore().snapshotsBetween(this.latestSnapshotInChartTime, now));
    }

    private appendSnapshots(snapshots: Snapshot[]) {
-        for (const snapshot of snapshots.reverse()) {
-            this.humidityPointList().push({x: snapshot.time, y: snapshot.humidity});
-            this.tempPointList().push({x: snapshot.time, y: snapshot.temp});
-            this.co2PointList().push({x: snapshot.time, y: snapshot.co2});
+        if (snapshots.length > 0) {
+            for (const snapshot of snapshots.reverse()) {
+                this.humidityPointList().push({x: snapshot.time, y: snapshot.humidity});
+                this.tempPointList().push({x: snapshot.time, y: snapshot.temp});
+                this.co2PointList().push({x: snapshot.time, y: snapshot.co2});
+            }
+            this.latestSnapshotInChartTime = new Date(snapshots[0].time).getTime();
        }
-        this.latestSnapshotInChartTime = new Date(snapshots[snapshots.length - 1].time).getTime();
    }

    private prependSnapshots(snapshots: Snapshot[]) {
--- a/webapp/src/ClimateDataStore.ts
+++ b/webapp/src/ClimateDataStore.ts
@@ -1,78 +0,0 @@
-import {AppStore, TimeWindow} from "./StateStore";
-import Snapshot from "./Snapshot";
-
-interface SnapshotRecords {
-    snapshots: Snapshot[]
-}
-
-class ClimateDataStore {
-    private cachedSpan: TimeWindow;
-    private cache: Snapshot[];
-
-    constructor() {
-        this.cache = [];
-        this.cachedSpan = null;
-    }
-
-    getCache() {
-        return this.cache;
-    }
-
-    async updateFromWindow(start: number, stop: number) {
-        if (!this.cacheValidForWindow(start, stop)) {
-            await this.fetchMissingSnapshotsBetween(start, stop);
-        }
-    }
-
-    async snapshotsBetween(start: number, stop: number): Promise<Snapshot[]> {
-        if (this.cacheValidForWindow(start, stop)) {
-            return this.cachedBetween(start, stop);
-        }
-        try {
-            await this.fetchMissingSnapshotsBetween(start, stop);
-            return this.cachedBetween(start, stop);
-        } catch (e) {
-            throw new Error(`Server error: ${e}`);
-        }
-    }
-
-    private cacheValidForWindow(start: number, stop: number) {
-        if (this.cachedSpan) {
-            return start >= this.cachedSpan.start && stop <= this.cachedSpan.stop;
-        } else {
-            return false;
-        }
-    }
-
-    private async fetchMissingSnapshotsBetween(start: number, stop: number) {
-        const dataEndpoint = `${ AppStore().getState().dataEndpointBase }?since=${ new Date(start).toISOString() }`;
-        const payload = await fetch(dataEndpoint);
-        this.cache = ((await payload.json()) as SnapshotRecords).snapshots.reverse();
-    }
-
-    private cachedBetween(start: number, stop: number) {
-        console.log(this.cache.length);
-        const cacheStart = this.findInCacheListRange(start, 0, this.cache.length - 1);
-        const cacheStop = this.findInCacheListRange(stop, 1, this.cache.length);
-        console.log(cacheStart, cacheStop, start, stop, this.cache);
-        return this.cache.slice(cacheStart, cacheStop);
-    }
-
-    private findInCacheListRange(soughtTime: number, listStart: number, listStop: number): number {
-        if (listStop - listStart === 1) {
-            return listStart;
-        } else {
-            const middle = Math.floor((listStop + listStart) / 2);
-            const middleTime = new Date(this.cache[middle].time).getTime();
-            if (middleTime > soughtTime) {
-                return this.findInCacheListRange(soughtTime, listStart, middle);
-            } else if (middleTime < soughtTime) {
-                return this.findInCacheListRange(soughtTime, middle, listStop);
-            } else {
-                return middle;
-            }
-        }
-    }
-}
-
-export default ClimateDataStore;
--- a/webapp/src/ListCache.ts
+++ b/webapp/src/ListCache.ts
@@ -0,0 +1,75 @@
+type ListCacheLoader<I, D> = (start: I, stop: I) => Promise<D[]>;
+type ListCacheComparator<I, D> = (data: D, index: I) => -1 | 1 | 0;
+
+class ListCache<IndexType, DataType> {
+    private cachedSpan: { start: IndexType, stop: IndexType } | null;
+    private cache: DataType[];
+    private loader: ListCacheLoader<IndexType, DataType>;
+    private comparator: ListCacheComparator<IndexType, DataType>;
+
+    constructor(loader: ListCacheLoader<IndexType, DataType>, comparator: ListCacheComparator<IndexType, DataType>) {
+        this.cache = [];
+        this.cachedSpan = null;
+        this.loader = loader;
+        this.comparator = comparator;
+    }
+
+    getCache() {
+        return this.cache;
+    }
+
+    async snapshotsBetween(start: IndexType, stop: IndexType): Promise<DataType[]> {
+        if (this.cacheValidForWindow(start, stop)) {
+            return this.cachedBetween(start, stop);
+        }
+        try {
+            await this.updateFromWindow(start, stop);
+            return this.cachedBetween(start, stop);
+        } catch (e) {
+            throw new Error(`Server error: ${e}`);
+        }
+    }
+
+    async updateFromWindow(start: IndexType, stop: IndexType) {
+        if (!this.cacheValidForWindow(start, stop)) {
+            await this.fetchMissingElementsBetween(start, stop);
+        }
+    }
+
+    private cacheValidForWindow(start: IndexType, stop: IndexType) {
+        if (this.cachedSpan) {
+            return start >= this.cachedSpan.start && stop <= this.cachedSpan.stop;
+        } else {
+            return false;
+        }
+    }
+
+    private async fetchMissingElementsBetween(start: IndexType, stop: IndexType) {
+        this.cache = await this.loader(start, stop);
+    }
+
+    private cachedBetween(start: IndexType, stop: IndexType) {
+        return this.cache.slice(
+            this.findIndexInCache(start),
+            this.findIndexInCache(stop)
+        );
+    }
+
+    private findIndexInCache(soughtVal: IndexType, listStart: number = 0, listStop: number = this.cache.length): number {
+        if (listStop - listStart === 1) {
+            return listStart;
+        } else {
+            const middle = Math.floor((listStop + listStart) / 2);
+            const comparison = this.comparator(this.cache[middle], soughtVal);
+            if (comparison === 1) {
+                return this.findIndexInCache(soughtVal, listStart, middle);
+            } else if (comparison === -1) {
+                return this.findIndexInCache(soughtVal, middle, listStop);
+            } else {
+                return middle;
+            }
+        }
+    }
+}
+
+export default ListCache;
--- a/webapp/src/StateStore.ts
+++ b/webapp/src/StateStore.ts
@@ -1,5 +1,5 @@
 import Snapshot from "./Snapshot";
-import ClimateDataStore from "./ClimateDataStore";
+import ListCache from "./ListCache";

 export class AppStateError extends Error {
    constructor(message: string) {
@@ -29,10 +29,30 @@ interface AppState {
    fatalError: Error | null;
 }

+type StoreUpdateCallback<T> = (newValue?: T, oldValue?: T) => void;
+type SubscriptionType<T, K extends keyof T> = Record<K, StoreUpdateCallback<T[K]>[]>;
+type IAppStateSubscriptions = SubscriptionType<AppState, keyof AppState>;
+
 class AppStateStore {
-    private readonly subscriptions: Record<keyof AppState, Function[]>;
+    private readonly subscriptions: IAppStateSubscriptions;
    private readonly state: AppState;
-    private readonly climateDataStore: ClimateDataStore = new ClimateDataStore();
+    private readonly climateDataStore: ListCache<number, Snapshot> = new ListCache<number, Snapshot>(
+        async (start, stop) => {
+            const dataEndpoint = `${ this.state.dataEndpointBase }?since=${ new Date(start).toISOString() }`;
+            const payload = await fetch(dataEndpoint);
+            return ((await payload.json()) as any).snapshots.reverse();
+        },
+        (data, index) => {
+            const time = new Date(data.time).getTime();
+            if (time > index) {
+                return 1;
+            } else if (time < index) {
+                return -1;
+            } else {
+                return 0;
+            }
+        }
+);
    private initialised: boolean = false;

    constructor(initialState: AppState) {
@@ -41,7 +61,7 @@ class AppStateStore {
        for (const key in this.state) {
            subscriptions[key] = [];
        }
-        this.subscriptions = subscriptions as Record<keyof AppState, Function[]>;
+        this.subscriptions = subscriptions as IAppStateSubscriptions;
        setInterval(() => this.updateClimateData(), this.state.updateIntervalSeconds * 1000);
    }

@@ -85,7 +105,7 @@ class AppStateStore {
        return this.state;
    }

-    subscribe(dataName: keyof AppState, callback: () => any) {
+    subscribe<T extends keyof AppState>(dataName: T, callback: StoreUpdateCallback<AppState[T]>) {
        this.subscriptions[dataName].push(callback);
    }

--- a/webapp/src/config.json
+++ b/webapp/src/config.json
@@ -1,5 +1,5 @@
 {
-  "development": false,
+  "development": true,
  "defaultMinuteSpan": 60,
  "reloadIntervalSec": 30,
  "dataEndpoint": "http://tortedda.local/climate/data"
--- a/webapp/src/main.ts
+++ b/webapp/src/main.ts
@@ -1,5 +1,5 @@
 import config from "./config.json";
-import {initStore} from "./StateStore";
+import {AppStore, getAppState, initStore} from "./StateStore";
 import AppUI from "./AppUI";
 export {config};

@@ -40,5 +40,7 @@ async function init() {

 document.onreadystatechange = (e) => {
    init();
+    //@ts-ignore
+    window.store = AppStore();
    document.onreadystatechange = () => {};
 };