Various improvements (#17)

* Add ability to limit number of public transport connections

* Refactor time widget into today widget

* Allow user to change background color of display

app/src/renderer/config_to_widgets.rs

@@ -3,14 +3,14 @@ use crate::renderer::widgets::base::Widget;
 use crate::renderer::widgets::bernaqua::Bernaqua;
 use crate::renderer::widgets::cafete::Cafete;
 use crate::renderer::widgets::public_transport::PublicTransport;
-use crate::renderer::widgets::time::Time;
+use crate::renderer::widgets::today::Today;
 
 use common::models::WidgetConfiguration;
 
 pub fn config_to_widgets(config: &WidgetConfiguration) -> Vec<Box<dyn Widget>> {
     let mut widgets: Vec<Box<dyn Widget>> = vec![];
-    if config.time_config.enabled {
-        widgets.push(Box::new(Time::new()));
+    if config.today_config.enabled {
+        widgets.push(Box::new(Today::new()));
     }
     if config.cafete_config.enabled {
         widgets.push(Box::new(Cafete::new()));

app/src/renderer/mod.rs

@@ -1,8 +1,10 @@
 use std::thread;
 use std::time::Duration;
 
+use common::models::SystemConfiguration;
 use cursive::theme::BaseColor;
 use cursive::theme::BorderStyle;
+use cursive::theme::Color;
 use cursive::theme::Color::Dark;
 use cursive::theme::PaletteColor::Background;
 use cursive::view::Nameable;
@@ -37,12 +39,12 @@ impl Renderer {
     pub async fn run(&mut self) {
         let mut siv = cursive::default().into_runner();
         let mut config = Persistence::get_config().expect("Could not load config");
-        self.initialize_layout(&config.widget_config, &mut siv);
+        self.initialize_layout(&config, &mut siv);
 
         loop {
             if let Some(new_config) = Persistence::get_config_change() {
                 config = new_config;
-                self.initialize_layout(&config.widget_config, &mut siv)
+                self.initialize_layout(&config, &mut siv)
             }
 
             self.update_widgets(&mut siv, &config.widget_config).await;
@@ -54,14 +56,17 @@ impl Renderer {
 
     fn initialize_layout(
         &mut self,
-        config: &WidgetConfiguration,
+        config: &SystemConfiguration,
         siv: &mut CursiveRunner<CursiveRunnable>,
     ) {
-        let widgets = config_to_widgets(config);
+        let widgets = config_to_widgets(&config.widget_config);
         self.widgets = widgets;
         *siv = cursive::default().into_runner();
         siv.update_theme(|theme| theme.shadow = false);
-        siv.update_theme(|theme| theme.palette[Background] = Dark(BaseColor::Magenta));
+        siv.update_theme(|theme| {
+            theme.palette[Background] =
+                Color::parse(config.background_color.as_str()).unwrap_or(Dark(BaseColor::Magenta))
+        });
         siv.update_theme(|theme| theme.borders = BorderStyle::None);
         siv.add_layer(PaddedView::lrtb(1, 1, 0, 0, self.build_layout()));
     }

app/src/renderer/widgets/mod.rs

@@ -3,4 +3,4 @@ pub mod base;
 pub mod bernaqua;
 pub mod cafete;
 pub mod public_transport;
-pub mod time;
+pub mod today;

app/src/renderer/widgets/public_transport.rs

@@ -3,7 +3,7 @@ use std::time::{Duration, Instant};
 use common::models::WidgetConfiguration;
 use common::widget_meta_data::WidgetMetaData;
 use serde::Deserialize;
-use time::OffsetDateTime;
+use time::{format_description, OffsetDateTime};
 use time_humanize::{Accuracy, HumanTime, Tense};
 
 use super::base::Widget;
@@ -82,7 +82,7 @@ impl Widget for PublicTransport {
             return;
         }
 
-        self.update_departure_string(3);
+        self.update_departure_string(config.num_connections_to_show as usize);
 
         if let Some(last_updated) = self.last_updated {
             if last_updated.elapsed() < self.update_interval {
@@ -132,10 +132,27 @@ impl PublicTransport {
 
         for connection in connections {
             let departure = connection.from.departure;
-            let departure_offset = departure - OffsetDateTime::now_utc();
-            let departure = HumanTime::from(departure_offset.unsigned_abs())
-                .to_text_en(Accuracy::Rough, Tense::Future);
-            self.content += &format!("\n{}", departure).to_string();
+            self.content += &format!(
+                "\n{} ({})",
+                PublicTransport::format_departure_offset(departure),
+                PublicTransport::format_departure(departure)
+            )
+            .to_string();
         }
     }
+
+    fn format_departure(departure: OffsetDateTime) -> String {
+        let format = format_description::parse("[hour]:[minute]").unwrap();
+        match departure.format(&format) {
+            Ok(departure) => departure,
+            Err(e) => {
+                format!("Could not format departure: {}", e)
+            }
+        }
+    }
+
+    fn format_departure_offset(departure: OffsetDateTime) -> String {
+        let departure_offset = departure - OffsetDateTime::now_utc();
+        HumanTime::from(departure_offset.unsigned_abs()).to_text_en(Accuracy::Rough, Tense::Future)
+    }
 }

app/src/renderer/widgets/time.rs → app/src/renderer/widgets/today.rs

@@ -6,20 +6,20 @@ use common::widget_meta_data::WidgetMetaData;
 extern crate chrono;
 use chrono::Local;
 
-pub struct Time {
+pub struct Today {
     content: String,
 }
 
 #[async_trait]
-impl Widget for Time {
+impl Widget for Today {
     fn new() -> Self {
         Self {
             content: "Loading...".to_string(),
         }
     }
 
     fn get_meta_data(&self) -> common::widget_meta_data::WidgetMetaData {
-        WidgetMetaData::Time
+        WidgetMetaData::Today
     }
 
     fn get_content(&self) -> &str {
@@ -28,6 +28,6 @@ impl Widget for Time {
 
     async fn update(&mut self, _config: &WidgetConfiguration) {
         let date = Local::now();
-        self.content = date.format("%H:%M:%S").to_string();
+        self.content = date.format("%a, %e. %b  %H:%M:%S").to_string();
     }
 }

app/src/shared/persistence.rs

@@ -66,8 +66,7 @@ mod tests {
     #[test]
     fn test_persistence() {
         let config = SystemConfiguration {
-            ssid: "SSID".to_string(),
-            password: "PASSWORD".to_string(),
+            background_color: "#FF3A3A".to_string(),
             widget_config: WidgetConfiguration {
                 bernaqua_config: BaseWidgetConfig { enabled: true },
                 ..Default::default()

common/src/models.rs

@@ -5,11 +5,23 @@ use gloo_net::http::Request;
 use serde::{Deserialize, Serialize};
 use yew::functional::Reducible;
 
-#[derive(Deserialize, Serialize, Clone, PartialEq, Default, Debug)]
+#[derive(Deserialize, Serialize, Clone, PartialEq, Debug)]
 pub struct PublicTransportConfig {
     pub base_config: BaseWidgetConfig,
     pub from: String,
     pub to: String,
+    pub num_connections_to_show: u8,
+}
+
+impl Default for PublicTransportConfig {
+    fn default() -> Self {
+        Self {
+            base_config: BaseWidgetConfig::default(),
+            from: "".to_string(),
+            to: "".to_string(),
+            num_connections_to_show: 2,
+        }
+    }
 }
 
 #[derive(Deserialize, Serialize, Clone, PartialEq, Default, Debug)]
@@ -19,7 +31,7 @@ pub struct BaseWidgetConfig {
 
 #[derive(Deserialize, Serialize, Clone, PartialEq, Default, Debug)]
 pub struct WidgetConfiguration {
-    pub time_config: BaseWidgetConfig,
+    pub today_config: BaseWidgetConfig,
     pub aare_config: BaseWidgetConfig,
     pub cafete_config: BaseWidgetConfig,
     pub bernaqua_config: BaseWidgetConfig,
@@ -29,9 +41,7 @@ pub struct WidgetConfiguration {
 #[derive(Deserialize, Serialize, Clone, PartialEq, Default, Debug)]
 pub struct SystemConfiguration {
     #[serde(default)]
-    pub ssid: String,
-    #[serde(default)]
-    pub password: String,
+    pub background_color: String,
     #[serde(default)]
     pub widget_config: WidgetConfiguration,
 }
@@ -51,7 +61,8 @@ fn persist_system_config(config: SystemConfiguration) {
 #[derive(PartialEq)]
 pub enum SystemConfigurationAction {
     SetInitialConfig(SystemConfiguration),
-    SetTimeConfig(BaseWidgetConfig),
+    SetBackgroundColor(String),
+    SetTodayConfig(BaseWidgetConfig),
     SetAareConfig(BaseWidgetConfig),
     SetCafeteConfig(BaseWidgetConfig),
     SetBernaquaConfig(BaseWidgetConfig),
@@ -65,9 +76,13 @@ impl Reducible for SystemConfiguration {
     fn reduce(self: Rc<Self>, action: Self::Action) -> Rc<Self> {
         let config = match action {
             SystemConfigurationAction::SetInitialConfig(new_config) => new_config,
-            SystemConfigurationAction::SetTimeConfig(widget_config) => Self {
+            SystemConfigurationAction::SetBackgroundColor(background_color) => Self {
+                background_color,
+                ..(*self).clone()
+            },
+            SystemConfigurationAction::SetTodayConfig(widget_config) => Self {
                 widget_config: WidgetConfiguration {
-                    time_config: widget_config,
+                    today_config: widget_config,
                     ..self.widget_config.clone()
                 },
                 ..(*self).clone()

common/src/widget_meta_data.rs

@@ -2,7 +2,7 @@
 pub enum WidgetMetaData {
     Cafete,
     Aare,
-    Time,
+    Today,
     Bernaqua,
     PublicTransport,
 }
@@ -12,7 +12,7 @@ impl WidgetMetaData {
         match self {
             WidgetMetaData::Cafete => "Cafete",
             WidgetMetaData::Aare => "Aare",
-            WidgetMetaData::Time => "Time",
+            WidgetMetaData::Today => "Today",
             WidgetMetaData::Bernaqua => "Bernaqua",
             WidgetMetaData::PublicTransport => "Next departure",
         }
@@ -22,7 +22,7 @@ impl WidgetMetaData {
         match self {
             WidgetMetaData::Cafete => "Events happening at the Cafete Club in Bern",
             WidgetMetaData::Aare => "The temperature of the Aare river in Bern",
-            WidgetMetaData::Time => "The current time",
+            WidgetMetaData::Today => "The current date and time",
             WidgetMetaData::Bernaqua => "Occupancy of the Bernaqua facilities",
             WidgetMetaData::PublicTransport => "Next public transport departures",
         }

frontend/Cargo.toml

@@ -7,7 +7,10 @@ edition = "2021"
 common = { path = "../common" }
 
 yew = { version = "0.20.0", features = ["csr"] }
-web-sys = "0.3.60"
+web-sys = { version = "0.3.60", features = [
+    "HtmlSelectElement",
+    "HtmlInputElement",
+] }
 wasm-bindgen = "0.2.83"
 gloo-net = "0.2.4"
 gloo-console = "0.2.3"

frontend/src/components/background_color_config.rs

@@ -0,0 +1,38 @@
+use common::models::{SystemConfiguration, SystemConfigurationAction};
+use wasm_bindgen::JsCast;
+use web_sys::HtmlInputElement;
+use yew::prelude::*;
+
+use crate::components::config_card::ConfigCardComponent;
+
+#[derive(Properties, PartialEq)]
+pub struct BackgroundColorConfigProps {
+    pub config: UseReducerHandle<SystemConfiguration>,
+}
+
+#[function_component(BackgroundColorConfigComponent)]
+pub fn public_transport_config_component(props: &BackgroundColorConfigProps) -> Html {
+    let update_config = {
+        let system_config = props.config.clone();
+        Callback::from(move |color| {
+            system_config.dispatch(SystemConfigurationAction::SetBackgroundColor(color));
+        })
+    };
+
+    let on_changed = move |event: Event| {
+        let input = event
+            .target()
+            .and_then(|t| t.dyn_into::<HtmlInputElement>().ok());
+        if let Some(input) = input {
+            update_config.emit(input.value());
+        }
+    };
+
+    html! {
+        <ConfigCardComponent>
+            <div class="text-white text-md font-medium">{"Background color"}</div>
+            <div class="text-slate-300 text-sm">{"Changes the background color of the display"}</div>
+            <input name="background_color" type="color" class="mt-2 bg-transparent" onchange={on_changed}/>
+        </ConfigCardComponent>
+    }
+}

frontend/src/components/config_card.rs

@@ -7,7 +7,7 @@ pub struct ConfigCardProps {
 #[function_component(ConfigCardComponent)]
 pub fn config_card_component(props: &ConfigCardProps) -> Html {
     html! {
-        <div class="p-4 my-3 transition duration-800 rounded-md bg-zinc-700 shadow-md">
+        <div class="p-4 my-3 transition duration-800 rounded-md bg-zinc-700 shadow-md hover:scale-105 duration-500">
             { for props.children.iter() }
         </div>
     }

frontend/src/components/divider.rs

@@ -0,0 +1,20 @@
+use yew::prelude::*;
+
+#[derive(Properties, PartialEq)]
+pub struct DividerProps {
+    pub text: AttrValue,
+}
+
+#[function_component(DividerComponent)]
+pub fn divider_component(props: &DividerProps) -> Html {
+    html! {
+        <div class="relative">
+            <div class="absolute inset-0 flex items-center" aria-hidden="true">
+                <div class="w-full border-t border-gray-300"></div>
+            </div>
+            <div class="relative flex justify-center">
+                <span class="bg-zinc-200 px-2 text-sm text-gray-500">{props.text.clone()}</span>
+            </div>
+    </div>
+    }
+}

frontend/src/components/mod.rs

@@ -1,4 +1,6 @@
+pub mod background_color_config;
 pub mod config_card;
 pub mod default_widget_config;
+pub mod divider;
 pub mod public_transport_config;
 pub mod widget_config;