ctucx.git: smartie-pwa

[js] smarthome web-gui

commit 616ff0a94b96740d0c2cf8336282843f2b233dc3
parent bb6d3970bc3b1fa4d7666cd69600f188018436b8
Author: Milan Pässler <me@pbb.lc>
Date: Sun, 28 Jul 2019 16:54:08 +0200

powermeter total and fix redirect
6 files changed, 33 insertions(+), 29 deletions(-)
M
src/layout.js
|
10
++--------
M
src/power-meter/history.js
|
10
+++++++++-
M
src/power-meter/live.js
|
21
++++++++++++++++++---
M
src/prompt.js
|
8
++++----
M
src/temperature/history.js
|
1
-
M
src/temperature/live.js
|
12
------------
diff --git a/src/layout.js b/src/layout.js
@@ -18,19 +18,13 @@ import "./spinner.js";
 import "./row.js";
 import "./prompt.js";
 
-const createRedirect = (id) => {
-	const config = state.config.views.filter(view => view.url == id)[0] || state.config.views[0];
-	const redirect = document.createElement("script");
-	redirect.innerHTML = `window.location.href = "${config.destination}"; console.log(window.location.href)`;
-};
-
 const viewTypes = {
 	"noconfig": id => html`<smarthome-spinner>Waiting for initial connection...</smarthome-spinner>`,
 	"switches": id => html`<smarthome-switches .viewid="${id}"></smarthome-switches>`,
 	"powermeter": id => html`<smarthome-power-meter .viewid="${id}"></smarthome-power-meter>`, icon: "power" ,
 	"temperature": id => html`<smarthome-temperature .viewid="${id}"></smarthome-temperature>`, icon: "thermometer" ,
 	"departures": id => html`<smarthome-departures .viewid="${id}"></smarthome-departures>`,
-	"redirect": id => html`<smarthome-spinner .viewid="${id}">Redirecting...</smarthome-spinner> ${createRedirect(id)}`,
+	"redirect": id => html`<smarthome-spinner .viewid="${id}">Redirecting...</smarthome-spinner>}`,
 	"settings": id => html`<smarthome-settings></smarthome-settings>`,
 };
 

@@ -65,7 +59,7 @@ class SmartHomeLayout extends LitElement {
 			<mwc-drawer type="modal">
 				<div id="drawer-content">
 					${state.config.views.map(view => html`
-						<a href="#/${view.url}" class="${this.activeView === view ? "active" : "inactive"}">
+						<a href="${view.type == "redirect" ? view.destination : '#/' + view.url}" class="${this.activeView === view ? "active" : "inactive"}">
 							<mwc-icon>${view.icon}</mwc-icon>
 							<span>${view.name}</span>
 							<mwc-ripple></mwc-ripple>
diff --git a/src/power-meter/history.js b/src/power-meter/history.js
@@ -62,7 +62,6 @@ class PowerMeterHistory extends LitElement {
 		const years = get(archive.data, [ "metadata", "availableData" ], {});
 		const months = get(archive.data, [ "metadata", "availableData", this.year ], []);
 
-		console.log(config)
 		for (let d of config.meters) {
 			archive.load(`${this.type}/${d.device}_${this.sel}`);
 			const data = get(archive.data, [ `${this.type}/${d.device}_${this.sel}` ], {});

@@ -115,6 +114,15 @@ class PowerMeterHistory extends LitElement {
 								`)}
 							</div>
 						`)}
+						<div class="table-row">
+							<div class="table-column">Total</div>
+							${Object.entries(this.data).reverse().map(([day, data]) => {
+								const sum = config.meters.reduce((acc, d) => data[d.device] ? acc + data[d.device] : acc, 0);
+								return html`
+									<div class="table-column">${sum ? round(sum, 2) + " kWh" : "-"}</div>
+								`;
+							})}
+						</div>
 					</div>
 				</smarthome-card>
 			` : html`
diff --git a/src/power-meter/live.js b/src/power-meter/live.js
@@ -20,17 +20,23 @@ class PowerMeterLive extends LitElement {
 	getImport(d) {
 		const currentValue = state.data[d.device].import;
 		const now = new Date();
-		console.log(d);
 		const filename = `day/${d.device}_${now.getFullYear()}_${pad(now.getMonth() + 1, 2)}`;
 		if (this._cachedDayArchive[filename] !== now.getDate()) delete archive.data[filename];
 		archive.load(`day/${d.device}_${now.getFullYear()}_${pad(now.getMonth() + 1, 2)}`);
 		this._cachedDayArchive[filename] = now.getDate();
 		const lastValue = get(archive.data, [filename, `${now.getFullYear()}${pad(now.getMonth() + 1, 2)}${pad(now.getDate() - 1, 2)}`, "totalImported" ]);
-		return currentValue && lastValue ? round(currentValue - lastValue, 2) + " kWh" : "-";
+		return currentValue && lastValue ? currentValue - lastValue : 0;
 	}
 
 	render() {
 		const config = state.config.views.filter(view => view.url == this.viewid)[0];
+		const sum = config.meters.reduce((acc, d) => {
+			if (state.data[d.device].power) acc.power += state.data[d.device].power;
+			if (state.data[d.device].import) acc.import += state.data[d.device].import;
+			const totalImport = this.getImport(d);
+			if (totalImport) acc.totalImport += totalImport;
+			return acc;
+		}, { power: 0, import: 0, totalImport: 0 });
 		return html`
 			${state.data[config.meters[0].device] ? html`
 				<div id="connection-status">

@@ -60,9 +66,18 @@ class PowerMeterLive extends LitElement {
 								<div class="table-column">${round(state.data[d.device].cosphi, 2)}</div>
 								<div class="table-column">${round(state.data[d.device].frequency, 2)}</div>
 								<div class="table-column">${round(state.data[d.device].import, 2)} kWh</div>
-								<div class="table-column">${this.getImport(d)}</div>
+								<div class="table-column">${round(this.getImport(d), 2)} kWh</div>
 							</div>
 						`)}
+						<div class="table-row">
+							<div class="table-column">Total</div>
+							<div class="table-column">-</div>
+              <div class="table-column">${round(sum.power, 2)} W</div>
+              <div class="table-column">-</div>
+              <div class="table-column">-</div>
+              <div class="table-column">${round(sum.import, 2)} kWh</div>
+              <div class="table-column">${round(sum.totalImport, 2)} kWh</div>
+						</div>
 					</div>
 				</smarthome-card>
 			` : html`
diff --git a/src/prompt.js b/src/prompt.js
@@ -31,13 +31,13 @@ class Prompt extends LitElement {
 				align-items: center;
 			}
 			input {
-    		padding: 0;
-    		border: none;
-    		height: 3em;
+				padding: 0;
+				border: none;
+				height: 3em;
 				color: black;
 			}
 			smarthome-card {
-    		display: flex;
+    				display: flex;
 				margin: 0;
 				margin-right: 20px;
 			}
diff --git a/src/temperature/history.js b/src/temperature/history.js
@@ -62,7 +62,6 @@ class TemperatureHistory extends LitElement {
 		const years = get(archive.data, [ "metadata", "availableData" ], {});
 		const months = get(archive.data, [ "metadata", "availableData", this.year ], []);
 
-		console.log(config)
 		for (let d of config.meters) {
 			archive.load(`${this.type}/${d.device}_${this.sel}`);
 			const data = get(archive.data, [ `${this.type}/${d.device}_${this.sel}` ], {});
diff --git a/src/temperature/live.js b/src/temperature/live.js
@@ -17,18 +17,6 @@ class TemperatureLive extends LitElement {
 		archive.subscribe(this.requestUpdate.bind(this));
 	}
 
-	getImport(d) {
-		const currentValue = state.data[d.device].import;
-		const now = new Date();
-		console.log(d);
-		const filename = `day/${d.device}_${now.getFullYear()}_${pad(now.getMonth() + 1, 2)}`;
-		if (this._cachedDayArchive[filename] !== now.getDate()) delete archive.data[filename];
-		archive.load(`day/${d.device}_${now.getFullYear()}_${pad(now.getMonth() + 1, 2)}`);
-		this._cachedDayArchive[filename] = now.getDate();
-		const lastValue = get(archive.data, [filename, `${now.getFullYear()}${pad(now.getMonth() + 1, 2)}${pad(now.getDate() - 1, 2)}`, "totalImported" ]);
-		return currentValue && lastValue ? round(currentValue - lastValue, 2) + " kWh" : "-";
-	}
-
 	render() {
 		const config = state.config.views.filter(view => view.url == this.viewid)[0];
 		return html`