feat: new layout and full screen scrolling

Cargo.toml

@@ -17,4 +17,5 @@ tracing-subscriber = "0.3"
 serde = { version = "1", features = ["derive"] }
 rand = "0.8.5"
 random_word = "0.3.0"
-catppuccin-egui = "2.0"
+catppuccin-egui = "2.0"
+egui_extras ="0.21"

src/app.rs

@@ -26,37 +26,31 @@ impl eframe::App for TypeFastApp {
         catppuccin_egui::set_theme(ctx, catppuccin_egui::MACCHIATO);
 
         egui::CentralPanel::default().show(ctx, |ui| {
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            TFSetting::render_state(&self.settings, ui);
-            ui.label("");
-            ui.collapsing("Settings", |ui| {
-                ui.with_layout(egui::Layout::top_down(egui::Align::LEFT), |ui| {
-                    ui.text_edit_singleline(&mut self.settings.command);
-                    TFSetting::process_command(&mut self.settings);
-                    ui.horizontal(|ui| {
-                        TFSetting::command_helpers(&mut self.settings, ui);
-                    });
-                })
-            });
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            ui.label("");
-            self.type_state.render(
-                ui,
-                &mut self.score,
-                &self.settings,
-                self.settings.provide_next_string().as_str(),
-            );
-            ui.label("");
-            self.score.render_scoring(ui);
+            egui::ScrollArea::vertical()
+                .id_source("all")
+                .show(ui, |ui| {
+                    self.type_state.render(
+                        ui,
+                        &mut self.score,
+                        &self.settings,
+                        self.settings.provide_next_string().as_str(),
+                    );
+                    ui.label("");
+                    self.score.render_scoring(ui);
+                    ui.horizontal_centered(|ui| {
+                        TFSetting::render_state(&self.settings, ui);
+                        ui.collapsing("Settings", |ui| {
+                            ui.with_layout(egui::Layout::top_down(egui::Align::LEFT), |ui| {
+                                egui::ScrollArea::vertical()
+                                    .id_source("settings")
+                                    .show(ui, |ui| {
+                                        TFSetting::process_command(&mut self.settings);
+                                        TFSetting::command_helpers(&mut self.settings, ui);
+                                    });
+                            })
+                        });
+                    })
+                });
         });
     }
 

src/random/mod.rs

@@ -23,7 +23,7 @@ pub const ALGS: [Algorithm; 4] = [
         id: "letters",
         version: "0.1",
         description: "some letters :)",
-        lang: "human",
+        lang: "western",
         out_size: &1,
         random_function: &random_letters_inner,
     },

src/settings/command_helper_render.rs

@@ -0,0 +1,43 @@
+use egui::Ui;
+use egui_extras::{Column, TableBuilder};
+
+use super::TFSetting;
+use crate::random::ALGS;
+
+pub fn render_commands(st: &mut TFSetting, ui: &mut Ui) {
+    TableBuilder::new(ui)
+        .auto_shrink([true, true])
+        .column(Column::exact(100.0))
+        .column(Column::exact(150.0))
+        .header(20.0, |mut header| {
+            header.col(|ui| {
+                ui.heading("Challenge");
+            });
+
+            header.col(|ui| {
+                ui.heading("Actions");
+            });
+        })
+        .body(|mut body| {
+            for alg in ALGS {
+                body.row(50.0, |mut row| {
+                    row.col(|ui| {
+                        ui.label(alg.description);
+                    });
+
+                    row.col(|ui| {
+                        ui.horizontal(|ui| {
+                            if ui.button("use").clicked() {
+                                st.command = "level".to_owned() + " " + alg.id + ";"
+                            }
+                        });
+                    });
+                });
+            }
+        });
+    ui.label("size");
+    ui.add(egui::DragValue::new(&mut st.size));
+    ui.collapsing("?", |ui| {
+        ui.label("a size of 3 with the challenge 'english words' means 3 words");
+    });
+}

src/settings/level_render.rs

@@ -0,0 +1,62 @@
+use egui::Ui;
+use egui_extras::{Column, TableBuilder};
+
+use crate::random::Algorithm;
+
+pub fn render_alg(level: &Algorithm, ui: &mut Ui) {
+    TableBuilder::new(ui)
+        .striped(true)
+        .vscroll(true)
+        .column(Column::exact(150.0))
+        .column(Column::exact(250.0))
+        .header(20.0, |mut header| {
+            header.col(|ui| {
+                ui.heading("Challenge");
+            });
+            header.col(|_ui| {});
+        })
+        .body(|mut body| {
+            body.row(30.0, |mut row| {
+                row.col(|ui| {
+                    ui.label("id");
+                });
+                row.col(|ui| {
+                    ui.label(level.id);
+                });
+            });
+
+            body.row(30.0, |mut row| {
+                row.col(|ui| {
+                    ui.label("version");
+                });
+                row.col(|ui| {
+                    ui.label(level.version);
+                });
+            });
+
+            body.row(30.0, |mut row| {
+                row.col(|ui| {
+                    ui.label("description");
+                });
+                row.col(|ui| {
+                    ui.label(level.description);
+                });
+            });
+            body.row(30.0, |mut row| {
+                row.col(|ui| {
+                    ui.label("lang");
+                });
+                row.col(|ui| {
+                    ui.label(level.lang);
+                });
+            });
+            body.row(30.0, |mut row| {
+                row.col(|ui| {
+                    ui.label("score multiplier");
+                });
+                row.col(|ui| {
+                    ui.label(level.out_size.to_string());
+                });
+            });
+        });
+}

src/settings/mod.rs

@@ -1,7 +1,12 @@
 use egui::Ui;
 
+mod command_helper_render;
+mod level_render;
+
 use crate::random::{none, Algorithm, ALGS};
 
+use self::level_render::render_alg;
+
 #[derive(serde::Deserialize, serde::Serialize)]
 #[serde(default)]
 pub struct TFSetting {
@@ -26,18 +31,7 @@ impl Default for TFSetting {
 impl TFSetting {
     pub fn render_state(&self, ui: &mut Ui) {
         ui.collapsing("Current", |ui| {
-            ui.horizontal_top(|ui| {
-                ui.label("|-|");
-                ui.label("last command");
-                ui.label(self.last_command.clone());
-                ui.label("|-|");
-                ui.label("level");
-                ui.label(self.level.description);
-                ui.label("|-|");
-                ui.label("size");
-                ui.label(format!("{}", self.size));
-                ui.label("|-|");
-            });
+            render_alg(&self.level, ui);
         });
     }
 
@@ -65,19 +59,7 @@ impl TFSetting {
     }
 
     pub fn command_helpers(&mut self, ui: &mut Ui) {
-        ui.spacing_mut().item_spacing.x = 0.5;
-
-        for alg in ALGS {
-            if ui.button(alg.description).clicked() {
-                self.command = "level".to_owned() + " " + alg.id
-            }
-        }
-
-        if ui.button("run command").clicked() {
-            self.command.push(';');
-        }
-
-        ui.add(egui::DragValue::new(&mut self.size));
+        command_helper_render::render_commands(self, ui)
     }
 
     #[allow(clippy::let_and_return)]

src/typewriter/mod.rs

@@ -36,10 +36,12 @@ impl TypeState {
         ui.heading(input_text);
 
         ui.separator();
-        ui.text_edit_multiline(&mut self.input);
-        if ui.button("new").clicked() {
-            self.challenge = provider.to_challenge();
-            self.input.clear();
-        }
+        ui.horizontal(|ui| {
+            ui.text_edit_multiline(&mut self.input);
+            if ui.button("new").clicked() {
+                self.challenge = provider.to_challenge();
+                self.input.clear();
+            }
+        });
     }
 }