Make font sizes configurable (#34)

* Add configurable font sizes * Update CHANGELOG * Only update font definitions when they change * Fix clippy * Move fonts to separate module
vv9k · Nov 30, 2021 · 4f0a86b · 4f0a86b
1 parent 405d219
commit 4f0a86b
Show file tree

Hide file tree

Showing 4 changed files with 158 additions and 0 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,3 +6,4 @@
 - Add ability to change docker socket location in settings
 - Display a confirmation popup when deleting a container/image
 - A lot of ui fixes and tweaks, more readable text
+- Add configurable font sizes to the settings window
diff --git a/src/app/fonts.rs b/src/app/fonts.rs
@@ -0,0 +1,108 @@
+use egui::{FontDefinitions, FontFamily, TextStyle};
+use serde::{Deserialize, Serialize};
+
+#[derive(Debug, Deserialize, Serialize)]
+pub struct FontSizes {
+    pub small: f32,
+    pub body: f32,
+    pub button: f32,
+    pub heading: f32,
+    pub monospace: f32,
+}
+
+impl Default for FontSizes {
+    fn default() -> Self {
+        Self {
+            small: 10.,
+            body: 14.,
+            button: 14.,
+            heading: 20.,
+            monospace: 14.,
+        }
+    }
+}
+
+impl FontSizes {
+    fn fonts_differ(&self, current_fonts: &FontDefinitions) -> bool {
+        for (style, (_, size)) in &current_fonts.family_and_size {
+            let size = *size;
+            match style {
+                TextStyle::Small => {
+                    if (self.small - size).abs() > f32::EPSILON {
+                        return true;
+                    }
+                }
+                TextStyle::Body => {
+                    if (self.body - size).abs() > f32::EPSILON {
+                        return true;
+                    }
+                }
+                TextStyle::Button => {
+                    if (self.button - size).abs() > f32::EPSILON {
+                        return true;
+                    }
+                }
+                TextStyle::Heading => {
+                    if (self.heading - size).abs() > f32::EPSILON {
+                        return true;
+                    }
+                }
+                TextStyle::Monospace => {
+                    if (self.monospace - size).abs() > f32::EPSILON {
+                        return true;
+                    }
+                }
+            }
+        }
+        false
+    }
+
+    pub fn update_ctx(&self, ctx: &egui::CtxRef) {
+        let current_fonts = ctx.fonts();
+
+        if !self.fonts_differ(current_fonts.definitions()) {
+            return;
+        }
+
+        let mut fonts = FontDefinitions::default();
+
+        fonts
+            .family_and_size
+            .insert(TextStyle::Small, (FontFamily::Proportional, self.small));
+        fonts
+            .family_and_size
+            .insert(TextStyle::Small, (FontFamily::Monospace, self.small));
+
+        fonts
+            .family_and_size
+            .insert(TextStyle::Body, (FontFamily::Proportional, self.body));
+        fonts
+            .family_and_size
+            .insert(TextStyle::Body, (FontFamily::Monospace, self.body));
+
+        fonts
+            .family_and_size
+            .insert(TextStyle::Button, (FontFamily::Proportional, self.button));
+        fonts
+            .family_and_size
+            .insert(TextStyle::Button, (FontFamily::Monospace, self.button));
+
+        fonts
+            .family_and_size
+            .insert(TextStyle::Heading, (FontFamily::Proportional, self.heading));
+        fonts
+            .family_and_size
+            .insert(TextStyle::Heading, (FontFamily::Monospace, self.heading));
+
+        fonts.family_and_size.insert(
+            TextStyle::Monospace,
+            (FontFamily::Proportional, self.monospace),
+        );
+        fonts.family_and_size.insert(
+            TextStyle::Monospace,
+            (FontFamily::Monospace, self.monospace),
+        );
+
+        ctx.set_fonts(fonts);
+    }
+}
diff --git a/src/app/mod.rs b/src/app/mod.rs
@@ -1,4 +1,5 @@
 mod containers;
+mod fonts;
 mod images;
 pub mod settings;
 mod ui;
@@ -91,6 +92,7 @@ impl App {
         self.read_worker_events();
         self.handle_notifications();
         self.handle_popups();
+        self.settings_window.settings.fonts.update_ctx(ctx);
 
         self.top_panel(ctx);
         self.side_panel(ctx);

diff --git a/src/app/settings.rs b/src/app/settings.rs
@@ -1,9 +1,12 @@
+use crate::app::fonts::FontSizes;
+
 use anyhow::{Context, Result};
 use serde::{Deserialize, Serialize};
 use std::fs;
 use std::path::{Path, PathBuf};
 
 pub const FILENAME: &str = "dockeye.yml";
+const ALLOWED_FONT_SIZE: std::ops::RangeInclusive<f32> = 10.0..=50.0;
 
 pub fn dir() -> Option<PathBuf> {
     dirs::config_dir()
@@ -12,12 +15,14 @@ pub fn dir() -> Option<PathBuf> {
 #[derive(Debug, Deserialize, Serialize)]
 pub struct Settings {
     pub docker_addr: String,
+    pub fonts: FontSizes,
 }
 
 impl Default for Settings {
     fn default() -> Self {
         Self {
             docker_addr: crate::DEFAULT_DOCKER_ADDR.to_string(),
+            fonts: FontSizes::default(),
         }
     }
 }
@@ -100,6 +105,10 @@ impl SettingsWindow {
 "#,
                         );
                     ui.end_row();
+
+                    self.fonts_ui(ui);
+                    ui.end_row();
+
                     if ui.button("save").clicked() {
                         if let Err(e) = self.save_settings() {
                             msg = Some(Message::Error(format!("{:?}", e)));
@@ -118,4 +127,42 @@ impl SettingsWindow {
         self.show = show;
         self.msg = msg;
     }
+    fn fonts_ui(&mut self, ui: &mut egui::Ui) {
+        egui::CollapsingHeader::new("fonts")
+            .default_open(false)
+            .show(ui, |ui| {
+                egui::Grid::new("fonts_grid").show(ui, |ui| {
+                    ui.label("small");
+                    ui.add(
+                        egui::DragValue::new(&mut self.settings.fonts.small)
+                            .clamp_range(ALLOWED_FONT_SIZE),
+                    );
+                    ui.end_row();
+                    ui.label("body");
+                    ui.add(
+                        egui::DragValue::new(&mut self.settings.fonts.body)
+                            .clamp_range(ALLOWED_FONT_SIZE),
+                    );
+                    ui.end_row();
+                    ui.label("button");
+                    ui.add(
+                        egui::DragValue::new(&mut self.settings.fonts.button)
+                            .clamp_range(ALLOWED_FONT_SIZE),
+                    );
+                    ui.end_row();
+                    ui.label("heading");
+                    ui.add(
+                        egui::DragValue::new(&mut self.settings.fonts.heading)
+                            .clamp_range(ALLOWED_FONT_SIZE),
+                    );
+                    ui.end_row();
+                    ui.label("monospace");
+                    ui.add(
+                        egui::DragValue::new(&mut self.settings.fonts.monospace)
+                            .clamp_range(ALLOWED_FONT_SIZE),
+                    );
+                    ui.end_row();
+                });
+            });
+    }
 }