Fix pwa manifest

Cargo.lock

@@ -206,7 +206,7 @@ dependencies = [
 
 [[package]]
 name = "common"
-version = "0.2.1"
+version = "0.2.3"
 dependencies = [
  "chrono",
  "lighter_lib",
@@ -576,7 +576,7 @@ checksum = "95505c38b4572b2d910cecb0281560f54b440a19336cbbcb27bf6ce6adc6f5a8"
 
 [[package]]
 name = "hemma"
-version = "0.2.1"
+version = "0.2.3"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -600,7 +600,7 @@ dependencies = [
 
 [[package]]
 name = "hemma_web"
-version = "0.2.1"
+version = "0.2.3"
 dependencies = [
  "chrono",
  "common",

backend/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "hemma"
-version = "0.2.1"
+version = "0.2.3"
 edition = "2021"
 
 [dependencies]

backend/src/tasks/lights.rs

@@ -53,7 +53,6 @@ pub async fn lights_task(state: &State) {
 
     loop {
         let notify = bulb_states.notify_on_change();
-        sleep(tokio::time::Duration::from_millis(1000 / 10)).await; // limit to 10 updates/second
         select! {
             _ = notify => {
                 let lights_state = lights_state.get();

common/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "common"
-version = "0.2.1"
+version = "0.2.3"
 edition = "2021"
 
 [dependencies]

frontend/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "hemma_web"
-version = "0.2.1"
+version = "0.2.3"
 authors = ["Joakim Hulthe <joakim@hulthe.net"]
 edition = "2021"
 

frontend/index.html

@@ -12,10 +12,8 @@
 		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu|Ubuntu+Mono&display=swap">
 
 		<!-- pwa manifest -->
-		<!--
 		<link data-trunk rel="copy-file" href="/static/manifest.json">
-		<link rel="manifest" href="/static/manifest.json">
+		<link rel="manifest" href="/manifest.json">
-		-->
 
 		<!-- copy image directory -->
 		<link data-trunk rel="copy-dir" href="/static/images">
@@ -26,7 +24,7 @@
 		<link rel="preload" href="/images/penguin3.svg" as="image">
 
 		<!-- icon -->
-		<link rel="icon" type="image/png" href="/images/icon.png">
+		<link rel="icon" type="image/png" href="/images/penguin2.svg">
 
 		<title>hemma</title>
 		<meta name="description" content="Home automation and information">

frontend/src/page/lights.rs

@@ -3,7 +3,7 @@ use crate::css::C;
 use chrono::{NaiveTime, Weekday};
 use common::{BulbGroup, BulbGroupShape, BulbMap, ClientMessage, ServerMessage};
 use lighter_lib::{BulbId, BulbMode};
-use seed::{attrs, button, div, input, C};
+use seed::{attrs, button, div, h2, input, table, td, tr, C};
 use seed::{prelude::*, IF};
 use seed_router::Page;
 use std::collections::{BTreeMap, HashMap, HashSet};
@@ -235,14 +235,14 @@ impl Page for Model {
                 .and_then(|b| b.wake_schedule.get(&day))
                 .map(|t| t.to_string())
                 .unwrap_or_default();
-            div![
+            tr![
                 C![C.calendar_day],
-                day.to_string(),
+                td![day.to_string()],
-                input![
+                td![input![
                     C![C.calendar_time_input],
                     attrs! {At::Placeholder => time},
                     input_ev(Ev::Input, move |input| Msg::LightTime(input, day))
-                ],
+                ]],
             ]
         };
 
@@ -251,14 +251,14 @@ impl Page for Model {
             div![
                 C![C.bulb_map],
                 attrs! {
-                    At::Style => format!("width: {}rem; height: {}rem;", bulb_map_width, bulb_map_height),
+                    At::Style => format!("min-width: {}rem; height: {}rem;", bulb_map_width, bulb_map_height),
                 },
                 ev(Ev::Click, |_| Msg::DeselectGroups),
                 self.bulb_map.groups.iter().enumerate().map(view_bulb_group),
             ],
             div![
                 C![C.bulb_controls],
-                IF!(selected_bulb.is_none() => C![C.bulb_controls_disable]),
+                IF!(selected_bulb.is_none() => C![C.cross_out]),
                 self.color_picker.view().map_msg(Msg::ColorPicker),
                 button![
                     if selected_bulb.map(|b| b.mode.power).unwrap_or(false) {
@@ -279,6 +279,9 @@ impl Page for Model {
             ],
             div![
                 C![C.calendar_box],
+                IF!(selected_bulb.is_none() => C![C.cross_out]),
+                h2!["Wake Schedule"],
+                table![
                     calendar_day(Weekday::Mon),
                     calendar_day(Weekday::Tue),
                     calendar_day(Weekday::Wed),
@@ -287,6 +290,7 @@ impl Page for Model {
                     calendar_day(Weekday::Sat),
                     calendar_day(Weekday::Sun),
                 ],
+            ],
         ]
     }
 }

frontend/static/images/icon.svg

@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="160"
+   height="160"
+   viewBox="0 0 42.333333 42.333333"
+   version="1.1"
+   id="svg8"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs2" />
+  <metadata
+     id="metadata5">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <rect
+     style="fill:#302f3b;fill-opacity:1;stroke:none;stroke-width:13.5876;stroke-linecap:round"
+     id="rect1"
+     width="42.333332"
+     height="42.333332"
+     x="0"
+     y="0" />
+  <g
+     id="layer1"
+     style="display:inline;fill:#ffffff"
+     transform="translate(5.2916666,4.9872409)">
+    <path
+       style="fill:#ffffff;stroke-width:0.177246"
+       d="m 13.134179,31.651166 c -1.367874,-0.18043 -3.4872278,-0.85238 -4.780367,-1.51563 -1.871747,-0.96002 -4.179215,-3.22966 -5.0074297,-4.92534 -1.5914865,-3.25839 -1.6801158,-7.72336 -0.2278948,-11.48085 1.0247424,-2.65144 2.7098602,-4.5706201 5.4768881,-6.2376401 4.4640374,-2.6894 6.9208324,-4.59636 8.5218534,-6.61464 0.435944,-0.54955 0.851411,-0.9404 0.923263,-0.86855 0.34663,0.34663 0.709996,2.45556 0.596276,3.46071 l -0.118698,1.04918 0.543199,-0.3868 c 0.298763,-0.21273 0.754695,-0.66407 1.013185,-1.00297 0.258491,-0.3389 0.531184,-0.55268 0.605988,-0.47507 0.277608,0.28804 0.872923,2.3693 0.872923,3.05181 0,0.78189 -0.07309,0.70941 2.140938,2.12277 3.360595,2.14527 5.28622,5.2741001 5.845846,9.4985401 0.238089,1.79727 0.119928,4.12317 -0.289284,5.69424 -0.438918,1.68512 -1.295306,3.20011 -2.596637,4.59356 -2.715779,2.90803 -6.119638,4.1954 -10.928887,4.13338 -1.132683,-0.0146 -2.298705,-0.0581 -2.591161,-0.0967 z m 5.683631,-1.1265 c 5.074026,-0.89873 8.492767,-3.70496 9.49005,-7.7898 0.358508,-1.46844 0.317005,-5.28368 -0.07569,-6.95754 -0.594746,-2.53514 -2.005266,-4.78931 -3.64922,-5.8318801 -1.428352,-0.90583 -1.561881,-0.82384 -2.840659,1.7442101 -0.615739,1.23654 -1.777129,3.21756 -2.580868,4.40229 l -1.461342,2.15404 0.927607,0.3153 c 1.188141,0.40386 2.476979,1.20634 2.848748,1.77373 0.272049,0.4152 0.269021,0.4806 -0.04735,1.02231 -0.778356,1.33273 -2.272203,1.79512 -5.849412,1.81056 l -2.340153,0.0101 -2.489801,2.46697 c -2.6276133,2.60352 -2.8788341,3.03045 -2.0880964,3.54856 1.8126654,1.18771 7.0732674,1.8772 10.1561944,1.33115 z m 3.183004,-13.17071 c -0.205126,-0.14999 -0.329285,-0.4602 -0.329285,-0.8227 0,-0.96498 1.087198,-1.43355 1.715448,-0.73934 0.872429,0.96402 -0.338235,2.3283 -1.386163,1.56204 z m -3.186586,4.78402 c 1.133944,-0.30198 1.619925,-0.56299 1.85054,-0.9939 0.246861,-0.46126 -0.269147,-0.94676 -1.770094,-1.66543 -1.062457,-0.50872 -1.296906,-0.55176 -3.013183,-0.55311 -1.794444,-0.001 -1.910137,0.0225 -3.231141,0.66815 -1.860639,0.90936 -2.118197,1.48499 -0.948717,2.12031 1.182601,0.64245 5.357705,0.89133 7.112595,0.42398 z m -5.26747,-0.96936 c -1.113796,-0.13246 -1.303724,-0.23853 -1.149022,-0.64168 0.08921,-0.23246 0.582443,-0.27351 3.286452,-0.27351 1.749822,0 3.307658,0.0484 3.461858,0.10758 0.350902,0.13466 0.365077,0.53097 0.02367,0.66198 -0.432127,0.16582 -4.555272,0.2726 -5.622968,0.14563 z m -3.7845902,-3.81466 c 0.7343882,-0.537 0.2478022,-1.88618 -0.6802563,-1.88618 -0.5030742,0 -0.9992445,0.51278 -0.9992445,1.03268 0,0.90987 0.9453857,1.39029 1.6795008,0.8535 z"
+       id="path865" />
+    <path
+       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
+       d="m 7.5967544,-6.2400058 c 0,0 -0.041418,0.1031026 -0.02862,0.2093299 0.012798,0.1062273 0.084435,0.1741091 0.084435,0.1741091 l -0.083147,0.088222 c 0,0 -0.1053512,-0.138166 -0.073877,-0.2774823 0.031474,-0.1393166 0.1012092,-0.1941783 0.101209,-0.1941787 z"
+       id="path1039" />
+  </g>
+  <g
+     id="layer2"
+     style="display:none" />
+  <g
+     id="layer3"
+     style="display:none" />
+</svg>

frontend/static/images/light.svg

@@ -0,0 +1,76 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="900px"
+   height="900px"
+   viewBox="0 0 900 900"
+   version="1.1"
+   xml:space="preserve"
+   id="SVGRoot"
+   inkscape:version="1.3.1 (91b66b0783, 2023-11-16, custom)"
+   sodipodi:docname="light.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"><defs
+   id="defs2" />
+<sodipodi:namedview
+   pagecolor="#302f3b"
+   bordercolor="#292929"
+   borderopacity="1"
+   inkscape:showpageshadow="2"
+   inkscape:pageopacity="0.0"
+   inkscape:pagecheckerboard="0"
+   inkscape:deskcolor="#232323"
+   id="namedview1"
+   inkscape:zoom="0.64016282"
+   inkscape:cx="414.73824"
+   inkscape:cy="449.88555"
+   inkscape:window-width="1684"
+   inkscape:window-height="1010"
+   inkscape:window-x="0"
+   inkscape:window-y="0"
+   inkscape:window-maximized="1"
+   inkscape:current-layer="SVGRoot" />
+<style
+   type="text/css"
+   id="style1">
+g.prefab path {
+  vector-effect:non-scaling-stroke;
+  -inkscape-stroke:hairline;
+  fill: none;
+  fill-opacity: 1;
+  stroke-opacity: 1;
+  stroke: #00349c;
+}
+</style>
+
+<circle
+   style="fill:#000000;fill-opacity:0.00697072;stroke:#ffffff;stroke-opacity:1;stroke-width:48;stroke-dasharray:none"
+   id="path3"
+   cx="450"
+   cy="450"
+   r="120" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="M 450,252 V 52"
+   id="path4" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="m 450.00045,848.81135 v -200"
+   id="path4-6" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="m 648.4059,450.40545 h 200"
+   id="path5" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="m 51.59455,450.4059 h 200"
+   id="path6" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="M 590.29406,310.11152 731.71542,168.69016"
+   id="path7" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="M 168.28503,732.12119 309.70639,590.69983"
+   id="path8" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="M 590.29438,590.69951 731.71574,732.12087"
+   id="path9" /><path
+   style="fill:#000000;fill-opacity:0.00697069;stroke:#ffffff;stroke-width:51.2769;stroke-dasharray:none;stroke-opacity:1;stroke-linecap:round"
+   d="M 168.28471,168.69048 309.70607,310.11184"
+   id="path10" /></svg>

frontend/static/manifest.json

@@ -0,0 +1,17 @@
+{
+  "name": "Hemma",
+  "short_name": "Hemma",
+  "start_url": "/lights",
+  "display": "standalone",
+  "background_color": "#302f3b",
+  "description": "Styr lampor",
+  "icons": [
+    { "src": "/images/icon_x72.png", "sizes": "72x72", "type": "image/png", "purpose": "maskable" },
+    { "src": "/images/icon_x128.png", "sizes": "128x128", "type": "image/png", "purpose": "maskable" },
+    { "src": "/images/icon_x144.png", "sizes": "144x144", "type": "image/png", "purpose": "maskable" },
+    { "src": "/images/icon_x192.png", "sizes": "192x192", "type": "image/png", "purpose": "maskable" },
+    { "src": "/images/icon_x512.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" },
+	{ "src": "/images/icon.svg", "sizes": "513x512", "purpose": "maskable" }
+  ]
+}
+

frontend/static/styles/common.scss

@@ -94,17 +94,12 @@ body {
 }
 
 .bulb_box {
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
-	align-items: center;
-	justify-content: space-around;
 	width: fit-content;
+	margin: auto;
 }
 
 .bulb_box > * {
-	margin-bottom: 1em;
+	margin-bottom: 1.5rem;
-	margin-right: 1em;
 }
 
 .bulb_controls {
@@ -112,21 +107,20 @@ body {
 	flex-direction: row;
 	align-items: center;
 	padding-right: 0.5em;
-	background: #56636e;
+	background: #00000000;
-	border: solid 0.25em #5b3f63;
 }
 
-.bulb_controls_disable {
+.cross_out {
 	position: relative;
 	overflow: hidden;
+	opacity: 0.5;
 }
 
-.bulb_controls_disable:before {
+.cross_out:before {
 	position: absolute;
 	content: '';
 	display: block;
-	background: #000000;
+	background: #00000000;
-	opacity: 0.5;
 	left: 0;
 	right: 0;
 	top: 0;
@@ -135,7 +129,7 @@ body {
 	z-index: 90;
 }
 
-.bulb_controls_disable:after {
+.cross_out:after {
 	position: absolute;
 	content: '';
 	background: #56636e;
@@ -151,23 +145,24 @@ body {
 	bottom: 0;
 	margin: auto;
 	z-index: 91;
-    animation: to_full_width .2s ease-out 0s 1 forwards;
+    box-shadow: black 0.5rem 0.6rem 1rem 0.3rem;
+    animation: to_width_90 .2s ease-out 0s 1 forwards;
 }
-@keyframes to_full_width { to { width: 100%; } }
+@keyframes to_width_90 { to { width: 90%; } }
 
 .bulb_map {
 	background: url(images/blueprint_bg.png);
 	background-size: auto;
 	background-size: 1em;
 	padding: 2rem;
-	border: solid 0.4rem #5b3f63;
+	border: solid 0.1rem;
+	border-radius: 0.2rem;
 }
 
 .bulb_map::after {
 	position: absolute;
 	width: 100%;
 	height: 100%;
-	content: #0003;
 }
 
 .bulb_group {
@@ -179,6 +174,7 @@ body {
 	font-size: 2em;
 	position: absolute;
 	box-shadow: #0006 0.1em 0.1em 0.1em;
+	user-select: none;
 	transition: 0.3s ease-in-out;
 }
 
@@ -326,7 +322,18 @@ body {
 	//margin-bottom: .7em;
 	margin-left: .5em;
 }
+
 .calendar_box {
-	with: 10em;
+	display: flex;
+	justify-content: center;
+}
+
+.calendar_box > h2 {
+	writing-mode: sideways-lr;
+	margin-top: auto;
+	margin-bottom: auto;
+}
+.calendar_box > * {
+	flex-shrink: 1;
 }