0.2.3

Cargo.lock

@@ -206,7 +206,7 @@ dependencies = [
 
 [[package]]
 name = "common"
-version = "0.2.0"
+version = "0.2.3"
 dependencies = [
  "chrono",
  "lighter_lib",
@@ -475,8 +475,6 @@ dependencies = [
  "http",
  "js-sys",
  "pin-project",
- "serde",
- "serde_json",
  "thiserror",
  "wasm-bindgen",
  "wasm-bindgen-futures",
@@ -578,7 +576,7 @@ checksum = "95505c38b4572b2d910cecb0281560f54b440a19336cbbcb27bf6ce6adc6f5a8"
 
 [[package]]
 name = "hemma"
-version = "0.2.0"
+version = "0.2.3"
 dependencies = [
  "anyhow",
  "async-trait",
@@ -602,7 +600,7 @@ dependencies = [
 
 [[package]]
 name = "hemma_web"
-version = "0.2.0"
+version = "0.2.3"
 dependencies = [
  "chrono",
  "common",

backend/Cargo.toml

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

backend/src/collector/weatherapi.rs

@@ -144,7 +144,7 @@ fn wind_speed_to_beaufort(mps: f64) -> BeaufortScale {
     let index = beaufort_wind_speeds
         .iter()
         .enumerate()
-        .find_map(|(i, range)| range.contains(&mps).then(|| i))
+        .find_map(|(i, range)| range.contains(&mps).then_some(i))
         .unwrap_or(beaufort_wind_speeds.len());
 
     BeaufortScale(index as u8)

backend/src/main.rs

@@ -32,7 +32,7 @@ struct Opt {
     #[clap(short, long)]
     quiet: bool,
 
-    #[clap(long, short, default_value = "127.0.0.0:8000")]
+    #[clap(long, short, default_value = "127.0.0.1:8000")]
     bind: SocketAddr,
 
     #[clap(long, default_value = "./www")]

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();
@@ -112,20 +111,19 @@ pub async fn lights_task(state: &State) {
                         };
 
                         if let Some(time) = time {
-                        let handle = spawn(wake_task(
+                            let handle = spawn(wake_task(
-                            state.client_message.clone(),
+                                state.client_message.clone(),
-                            cmd.clone(),
+                                cmd.clone(),
-                            id.clone(),
+                                id.clone(),
-                            day,
+                                day,
-                            time,
+                                time,
-                        ));
+                            ));
 
-                        if let Some(old_handle) = wake_tasks.insert((id, day), handle) {
+                            if let Some(old_handle) = wake_tasks.insert((id, day), handle) {
-                            old_handle.abort();
-                        }} else {
-                            if let Some(old_handle) = wake_tasks.remove(&(id, day)) {
                                 old_handle.abort();
                             }
+                        } else if let Some(old_handle) = wake_tasks.remove(&(id, day)) {
+                            old_handle.abort();
                         }
                     }
                     _ => {}
@@ -181,7 +179,11 @@ fn next_alarm(now: DateTime<Local>, day: Weekday, time: NaiveTime) -> DateTime<L
     let day_now = now.weekday().num_days_from_monday() as i64;
 
     let alarm = now + chrono::Duration::days(day_of_alarm - day_now);
-    let mut alarm = alarm.date().and_time(time).unwrap();
+    let mut alarm = alarm
+        .date_naive()
+        .and_time(time)
+        .and_local_timezone(Local)
+        .unwrap();
 
     if alarm <= now {
         alarm += chrono::Duration::weeks(1);

common/Cargo.toml

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

frontend/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "hemma_web"
-version = "0.2.0"
+version = "0.2.3"
 authors = ["Joakim Hulthe <joakim@hulthe.net"]
 edition = "2021"
 
@@ -10,7 +10,7 @@ wasm-bindgen = "=0.2.87" # must match Trunk.toml
 serde = { version = "1.0.0", features = ['derive'] }
 ron = "0.7.1"
 chrono = { version = "0.4.20", features = ["serde"] }
-gloo-net = "0.4.0"
+gloo-net = { version = "0.4.0", default-features = false, features = ["websocket"] }
 gloo-console = "0.3.0"
 
 [dependencies.css_typegen]

frontend/Trunk.toml

@@ -7,7 +7,7 @@ wasm_bindgen = "0.2.87"
 [[proxy]]
 # This WebSocket proxy example has a backend and ws field. This example will listen for
 # WebSocket connections at `/api/ws` and proxy them to `ws://localhost:9000/api/ws`.
-backend = "ws://localhost:8000/api/ws"
+backend = "ws://127.0.0.1:8000/api/ws"
 ws = true
 
 #[[proxy]]

frontend/rust-toolchain.toml

@@ -0,0 +1,4 @@
+[toolchain]
+channel = "stable"
+components = ["rust-src", "rustfmt", "rust-src"]
+targets = ["wasm32-unknown-unknown"]

frontend/src/components/color_picker.rs

@@ -19,7 +19,7 @@ pub struct ColorPicker {
 #[derive(Default)]
 enum ColorPickerSetting {
     #[default]
-    HSB,
+    Hsb,
     Kelvin,
 }
 
@@ -55,14 +55,14 @@ impl ColorPicker {
                 }
 
                 match self.dragging.take() {
-                    Some(ColorPickerAttr::HueSat) => self.mode = ColorPickerSetting::HSB,
+                    Some(ColorPickerAttr::HueSat) => self.mode = ColorPickerSetting::Hsb,
                     Some(ColorPickerAttr::Brightness) => {}
                     Some(ColorPickerAttr::Temperature) => self.mode = ColorPickerSetting::Kelvin,
                     None => return,
                 }
 
                 let color = match self.mode {
-                    ColorPickerSetting::HSB => {
+                    ColorPickerSetting::Hsb => {
                         BulbColor::hsb(self.hue, self.saturation, self.brightness)
                     }
                     ColorPickerSetting::Kelvin => {
@@ -130,10 +130,12 @@ impl ColorPicker {
 
         let (r, g, b) = hsb_to_rgb(self.hue, 1.0, 1.0);
         let saturation_gradient = match self.mode {
-            ColorPickerSetting::HSB => {
+            ColorPickerSetting::Hsb => {
                 format!("background: linear-gradient(0deg, #000, rgba({r},{g},{b},1));")
             }
-            ColorPickerSetting::Kelvin => format!("background: linear-gradient(0deg, #000, #fff);"),
+            ColorPickerSetting::Kelvin => {
+                "background: linear-gradient(0deg, #000, #fff);".to_string()
+            }
         };
 
         div![
@@ -186,7 +188,7 @@ impl ColorPicker {
         self.hue = h;
         self.saturation = s;
         self.brightness = b;
-        self.mode = ColorPickerSetting::HSB;
+        self.mode = ColorPickerSetting::Hsb;
     }
 
     pub fn set_kelvin(&mut self, t: f32, b: f32) {

frontend/src/page/lights.rs

@@ -3,8 +3,8 @@ use crate::css::C;
 use chrono::{NaiveTime, Weekday};
 use common::{BulbGroup, BulbGroupShape, BulbMap, ClientMessage, ServerMessage};
 use lighter_lib::{BulbId, BulbMode};
-use seed::prelude::*;
+use seed::{attrs, button, div, h2, input, table, td, tr, C};
-use seed::{attrs, button, div, input, C};
+use seed::{prelude::*, IF};
 use seed_router::Page;
 use std::collections::{BTreeMap, HashMap, HashSet};
 use std::fmt::Write;
@@ -112,7 +112,7 @@ impl Page for Model {
             }
             Msg::ColorPicker(msg) => {
                 self.color_picker
-                    .update(msg, &mut orders.proxy(|msg| Msg::ColorPicker(msg)));
+                    .update(msg, &mut orders.proxy(Msg::ColorPicker));
             }
             Msg::SetBulbPower(power) => {
                 self.groups_interacted = true;
@@ -125,7 +125,7 @@ impl Page for Model {
                 });
             }
             Msg::LightTime(time, day) => {
-                if time == "" {
+                if time.is_empty() {
                     self.for_selected_bulbs(|id, _| {
                         let message = ClientMessage::SetBulbWakeTime {
                             id: id.clone(),
@@ -228,24 +228,21 @@ impl Page for Model {
             .next()
             .and_then(|&index| self.bulb_map.groups.get(index))
             .and_then(|group| group.bulbs.first())
-            .and_then(|id| self.bulb_states.get(id))
+            .and_then(|id| self.bulb_states.get(id));
-            .cloned() // TODO: remove clone
-            .unwrap_or_default();
 
         let calendar_day = |day: Weekday| {
             let time = selected_bulb
-                .wake_schedule
+                .and_then(|b| b.wake_schedule.get(&day))
-                .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))
-                ],
+                ]],
             ]
         };
 
@@ -254,25 +251,25 @@ 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],
-                self.color_picker
+                IF!(selected_bulb.is_none() => C![C.cross_out]),
-                    .view()
+                self.color_picker.view().map_msg(Msg::ColorPicker),
-                    .map_msg(|msg| Msg::ColorPicker(msg)),
                 button![
-                    if selected_bulb.mode.power {
+                    if selected_bulb.map(|b| b.mode.power).unwrap_or(false) {
                         C![C.bulb_power_button, C.bulb_power_button_on]
                     } else {
                         C![C.bulb_power_button]
                     },
-                    ev(Ev::Click, move |_| Msg::SetBulbPower(
+                    {
-                        !selected_bulb.mode.power
+                        let target_power = selected_bulb.map(|b| !b.mode.power);
-                    )),
+                        ev(Ev::Click, move |_| target_power.map(Msg::SetBulbPower))
+                    },
                     div![attrs! { At::Id => "switch_socket" }],
                     div![attrs! { At::Id => "off_label" }, "Off"],
                     div![attrs! { At::Id => "on_label" }, "On"],
@@ -282,13 +279,17 @@ impl Page for Model {
             ],
             div![
                 C![C.calendar_box],
-                calendar_day(Weekday::Mon),
+                IF!(selected_bulb.is_none() => C![C.cross_out]),
-                calendar_day(Weekday::Tue),
+                h2!["Wake Schedule"],
-                calendar_day(Weekday::Wed),
+                table![
-                calendar_day(Weekday::Thu),
+                    calendar_day(Weekday::Mon),
-                calendar_day(Weekday::Fri),
+                    calendar_day(Weekday::Tue),
-                calendar_day(Weekday::Sat),
+                    calendar_day(Weekday::Wed),
-                calendar_day(Weekday::Sun),
+                    calendar_day(Weekday::Thu),
+                    calendar_day(Weekday::Fri),
+                    calendar_day(Weekday::Sat),
+                    calendar_day(Weekday::Sun),
+                ],
             ],
         ]
     }

frontend/static/styles/common.scss

@@ -19,6 +19,16 @@ body {
 	font-size: x-large;
 }
 
+/* filthy hacks to make the page stop overflowing on mobile */
+@media (width <= 430px) {
+	body {
+		margin: 0;
+		transform-origin: top left;
+		scale: 0.9;
+	}
+}
+@media (width <= 390px) { body { scale: 0.85; } }
+
 .info_box {
 	margin: auto;
 	max-width: 40em;
@@ -84,16 +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: 0.5em;
+	margin-bottom: 1.5rem;
 }
 
 .bulb_controls {
@@ -101,24 +107,62 @@ body {
 	flex-direction: row;
 	align-items: center;
 	padding-right: 0.5em;
-	background: #56636e;
+	background: #00000000;
-	border: solid 0.25em #5b3f63;
-
 }
 
+.cross_out {
+	position: relative;
+	overflow: hidden;
+	opacity: 0.5;
+}
+
+.cross_out:before {
+	position: absolute;
+	content: '';
+	display: block;
+	background: #00000000;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	z-index: 90;
+}
+
+.cross_out:after {
+	position: absolute;
+	content: '';
+	background: #56636e;
+	display: block;
+	width: 0;
+    height: 10px;
+	border-radius: 8px;
+	-webkit-transform: rotate(-30deg);
+    transform: rotate(-30deg);
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	margin: auto;
+	z-index: 91;
+    box-shadow: black 0.5rem 0.6rem 1rem 0.3rem;
+    animation: to_width_90 .2s ease-out 0s 1 forwards;
+}
+@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 {
@@ -130,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;
 }
 
@@ -277,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;
 }