ctucx.git: smartie-pwa

foo

diff --git a/src/layout.js b/src/layout.js
@@ -48,6 +48,7 @@ class SmartHomeLayout extends LitElement {
 	_handleNavEvent(evt) {
 		const drawer = this.shadowRoot.querySelector("mwc-drawer");
 		drawer.open = !drawer.open;
+		this.shadowRoot.getElementById("menu-button").blur();
 	}
 
 	render() {

@@ -67,7 +68,7 @@ class SmartHomeLayout extends LitElement {
 				<div id="title-container" slot="title">
 					<span>${this.activePage.name}</span>
 				</div>
-				<mwc-icon-button slot="navigationIcon" icon="menu"></mwc-icon-button>
+				<mwc-icon-button id="menu-button" slot="navigationIcon" icon="menu"></mwc-icon-button>
 			</mwc-top-app-bar>
 			<div class="top-app-bar-adjust"></div>
 			${this.activePage.content}

diff --git a/src/lights.js b/src/lights.js
@@ -19,9 +19,11 @@ class Lights extends LitElement {
 	_clickHandler(evt) {
 		evt.preventDefault();
 		const row = evt.composedPath().filter(el => el instanceof Row)[0];
+		if (row.attributes.disabled) return;
 		const sw = row.querySelector("mwc-switch");
 		sw.checked = !sw.checked;
 		state.ws.send(`set ${Number(sw.id)} ${sw.checked ? "on" : "off"}`);
+		if (evt.clientX !== 0 || evt.clientY !== 0) sw.blur();
 		return true;
 	}
 

@@ -30,7 +32,7 @@ class Lights extends LitElement {
 			${state.data.lights ? html`
 				<smarthome-card>
 					${state.data.lights.map(sw => html`
-						<smarthome-row @click="${this._clickHandler}">
+						<smarthome-row @click="${this._clickHandler}" ?disabled="${!state.connected}">
 							<span slot="left">${sw.name}</span>
 							<mwc-ripple slot="center"></mwc-ripple>
 							<mwc-switch slot="right" .id="${sw.id}" ?disabled="${!state.connected}" ?checked="${sw.value}"></mwc-switch>

@@ -54,6 +56,12 @@ class Lights extends LitElement {
 				--mdc-theme-secondary: #616161;
 				user-select: none;
 			}
+			smarthome-row[disabled] {
+				color: #999;
+			}
+			smarthome-row[disabled] mwc-ripple {
+				display: none;
+			}
 		`;
 	}
 }

diff --git a/src/power-meter.js b/src/power-meter.js
@@ -55,7 +55,7 @@ class PowerMeter extends LitElement {
 							<div class="table-column">Frequency</div>
 							<div class="table-column">Import</div>
 						</div>
-						${state.data.powermeter.map(d => html`
+						${Object.entries(state.data.powermeter).map(([_, d]) => html`
 							<div class="table-row">
 								<div class="table-column">${d.name}</div>
 								<div class="table-column">${round(d.values.voltage, 2)} V</div>

diff --git a/src/state.js b/src/state.js
@@ -28,7 +28,7 @@ class State {
 	}
 
 	_initWS() {
-		this.ws = new WebSocket(`ws://192.168.1.1/relay/ws`);
+		this.ws = new WebSocket(`${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.hostname}/${window.location.pathname}/relay/ws`);
 		this.ws.onclose = () => {
 			this.connected = false;
 			this._initWS();

diff --git a/sw.js b/sw.js
@@ -9,7 +9,7 @@ let preCache = [
 	'https://fonts.gstatic.com/s/materialicons/v47/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2',
 ];
 
-const CACHE = 'cache-v2';
+const CACHE = 'cache-v4';
 
 self.addEventListener('install', function (evt) {
 	self.skipWaiting();