diff --git a/src/features/hud/mod.rs b/src/features/hud/mod.rs index 92f5bbe..6091430 100644 --- a/src/features/hud/mod.rs +++ b/src/features/hud/mod.rs @@ -39,37 +39,27 @@ fn setup(mut commands: Commands) { }, BackgroundColor(Color::srgba(0.0, 0.0, 0.0, 0.8)), children![ - ( - TextType::Phase, - Text::new("..."), - TextFont::from_font_size(16.0), - TextColor(Color::WHITE) - ), - ( - TextType::Timer, - Text::new("--:--"), - TextFont::from_font_size(16.0), - TextColor(Color::WHITE) - ), - ( - Button, + text_with_component(TextType::Phase, "...", 16.0, Color::WHITE), + text_with_component(TextType::Timer, "...", 16.0, Color::WHITE), + button( inventory::components::ButtonType::InventoryOpen, - Node::default(), - children![( - Text::new("Inventar"), - TextFont::from_font_size(16.0), - TextColor(Color::WHITE) - )] + ButtonVariant::Secondary, + Node { + padding: UiRect::all(px(10)), + ..default() + }, + "Inventar", + 16.0 ), - ( - Button, + button( ButtonType::SettingsOpen, - Node::default(), - children![( - Text::new("Einstellungen"), - TextFont::from_font_size(16.0), - TextColor(Color::WHITE) - )] + ButtonVariant::Secondary, + Node { + padding: UiRect::all(px(10)), + ..default() + }, + "Einstellungen", + 16.0 ) ], )); diff --git a/src/features/hud/ui/settings.rs b/src/features/hud/ui/settings.rs index 902b89f..dd8868d 100644 --- a/src/features/hud/ui/settings.rs +++ b/src/features/hud/ui/settings.rs @@ -10,9 +10,7 @@ pub fn open_settings(commands: &mut Commands) { position_type: PositionType::Absolute, width: percent(100), height: percent(100), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, - ..default() + ..Node::center() }, ZIndex(1), BackgroundColor(Color::srgba(0.0, 0.0, 0.0, 0.8)), @@ -21,10 +19,9 @@ pub fn open_settings(commands: &mut Commands) { parent .spawn(( Node { - flex_direction: FlexDirection::Column, - align_items: AlignItems::Center, + width: px(700), padding: UiRect::all(px(20.0)), - ..default() + ..Node::vstack(px(20)) }, BackgroundColor(Color::srgb(0.2, 0.2, 0.2)), BorderRadius::all(px(10.0)), @@ -32,145 +29,97 @@ pub fn open_settings(commands: &mut Commands) { .with_children(|parent| { parent.spawn(( Node { - width: percent(100.0), justify_content: JustifyContent::SpaceBetween, - align_items: AlignItems::Center, - margin: UiRect::bottom(px(20.0)), - column_gap: px(20.0), - ..default() + ..Node::hstack(px(20)) }, children![ - ( - Text::new("Spiel Einstellungen"), - TextFont::from_font_size(40.0), - TextColor(Color::WHITE), - ), - ( - Button, + text("Spiel Einstellungen", 40.0, Color::WHITE), + pill_button( ButtonType::SettingsClose, + ButtonVariant::Destructive, Node { - width: px(40.0), - height: px(40.0), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, + width: px(40), + height: px(40), ..default() }, - BackgroundColor(Color::srgb(0.8, 0.2, 0.2)), - BorderRadius::MAX, - children![( - Text::new("X"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE), - )] - ) + "X", + 24.0 + ), ], )); parent - .spawn(Node { - width: percent(100), - flex_direction: FlexDirection::Column, - margin: UiRect::top(px(10.0)), - row_gap: px(10.0), - ..default() - }) + .spawn(Node::vstack(px(10))) .with_children(|parent| { - parent.spawn(( - Button, + parent.spawn(button( ButtonType::SettingsExit, + ButtonVariant::Secondary, Node { - width: percent(100), - height: px(80), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, - padding: UiRect::horizontal(px(10.0)), + padding: UiRect::all(px(10)), ..default() }, - BackgroundColor(NORMAL_BUTTON), - BorderRadius::all(px(10)), - children![( - Text::new("Spiel verlassen"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE) - )], + "Spiel verlassen", + 24.0, )); - parent.spawn(( - Button, + parent.spawn(button( ButtonType::SettingsSave, + ButtonVariant::Secondary, Node { - width: percent(100), - height: px(80), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, - padding: UiRect::horizontal(px(10.0)), + padding: UiRect::all(px(10)), ..default() }, - BackgroundColor(NORMAL_BUTTON), - BorderRadius::all(px(10)), - children![( - Text::new("Spiel speichern"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE) - )], + "Spiel speichern", + 24.0, )); parent.spawn(( Node { - width: percent(100), - flex_direction: FlexDirection::Row, - justify_content: JustifyContent::SpaceBetween, - align_items: AlignItems::Center, - column_gap: px(10), - padding: UiRect::horizontal(px(10.0)), - ..default() + justify_content: JustifyContent::Center, + ..Node::hstack(px(30)) }, children![ ( Node { - flex_direction: FlexDirection::Column, - align_items: AlignItems::Center, - row_gap: px(10), - ..default() + width: percent(40), + ..Node::vstack(px(10)) }, children![ - ( - Text::new("Fokus Phase"), - TextFont::from_font_size(12.0), - TextColor(Color::WHITE) + text("Spiel Einstellungen", 18.0, Color::WHITE), + text( + "Tipp: Benutze [Umstellen] um in 10er Schritten zu inkrementieren oder dekrementieren!", + 16.0, + Color::WHITE ), + ] + ), + ( + Node { + align_items: AlignItems::Center, + ..Node::vstack(px(10)) + }, + children![ + text("Fokus Phase", 12.0, Color::WHITE), timer_settings(TimerType::Focus) ] ), ( Node { - flex_direction: FlexDirection::Column, align_items: AlignItems::Center, - row_gap: px(10), - ..default() + ..Node::vstack(px(10)) }, children![ - ( - Text::new("Kurze Pause"), - TextFont::from_font_size(12.0), - TextColor(Color::WHITE) - ), + text("Kurze Pause", 12.0, Color::WHITE), timer_settings(TimerType::ShortBreak) ] ), ( Node { - flex_direction: FlexDirection::Column, align_items: AlignItems::Center, - row_gap: px(10), - ..default() + ..Node::vstack(px(10)) }, children![ - ( - Text::new("Lange Pause"), - TextFont::from_font_size(12.0), - TextColor(Color::WHITE) - ), + text("Lange Pause", 12.0, Color::WHITE), timer_settings(TimerType::LongBreak) ] ) diff --git a/src/features/hud/ui/timer_settings.rs b/src/features/hud/ui/timer_settings.rs index 014e4f0..49fce78 100644 --- a/src/features/hud/ui/timer_settings.rs +++ b/src/features/hud/ui/timer_settings.rs @@ -4,17 +4,12 @@ use crate::prelude::*; pub fn timer_settings(timer_type: TimerType) -> impl Bundle { ( Node { - flex_direction: FlexDirection::Row, align_items: AlignItems::Center, - ..default() + ..Node::hstack(px(0)) }, children![ timer_settings_part(SettingsTimerInput::Minutes(timer_type.clone()), 1), - ( - Text::new(":"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE) - ), + text(":", 24.0, Color::WHITE), timer_settings_part(SettingsTimerInput::Seconds(timer_type.clone()), 1), ], ) @@ -22,52 +17,34 @@ pub fn timer_settings(timer_type: TimerType) -> impl Bundle { fn timer_settings_part(input: SettingsTimerInput, amount: u32) -> impl Bundle { ( - Node { - flex_direction: FlexDirection::Column, - ..default() - }, + Node::vstack(px(0)), children![ - ( - Button, + button( ButtonType::SettingsTimerChange { input: input.clone(), amount: amount as i32 }, + ButtonVariant::Secondary, Node { - width: auto(), - justify_content: JustifyContent::Center, + width: percent(100), ..default() }, - BackgroundColor(NORMAL_BUTTON), - children![ - Text::new("+"), - TextFont::from_font_size(12.0), - TextColor(Color::WHITE) - ] + "+", + 12.0 ), - ( - input.clone(), - Text::new("--"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE) - ), - ( - Button, + text_with_component(input.clone(), "--", 24.0, Color::WHITE), + button( ButtonType::SettingsTimerChange { input: input.clone(), - amount: -(amount as i32), + amount: -(amount as i32) }, + ButtonVariant::Secondary, Node { - width: auto(), - justify_content: JustifyContent::Center, + width: percent(100), ..default() }, - BackgroundColor(NORMAL_BUTTON), - children![ - Text::new("-"), - TextFont::from_font_size(12.0), - TextColor(Color::WHITE) - ] + "-", + 12.0 ), ], ) diff --git a/src/features/inventory/ui/inventory.rs b/src/features/inventory/ui/inventory.rs index 7c981d9..e77d9cc 100644 --- a/src/features/inventory/ui/inventory.rs +++ b/src/features/inventory/ui/inventory.rs @@ -9,9 +9,7 @@ pub fn open_inventory(commands: &mut Commands, items: Query<&ItemStack>) { position_type: PositionType::Absolute, width: percent(100), height: percent(100), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, - ..default() + ..Node::center() }, ZIndex(1), BackgroundColor(Color::srgba(0.0, 0.0, 0.0, 0.8)), @@ -20,10 +18,8 @@ pub fn open_inventory(commands: &mut Commands, items: Query<&ItemStack>) { parent .spawn(( Node { - flex_direction: FlexDirection::Column, - align_items: AlignItems::Center, padding: UiRect::all(px(20.0)), - ..default() + ..Node::vstack(px(0)) }, BackgroundColor(Color::srgb(0.2, 0.2, 0.2)), BorderRadius::all(px(10.0)), @@ -33,45 +29,30 @@ pub fn open_inventory(commands: &mut Commands, items: Query<&ItemStack>) { Node { width: percent(100.0), justify_content: JustifyContent::SpaceBetween, - align_items: AlignItems::Center, margin: UiRect::bottom(px(20.0)), - column_gap: px(20.0), - ..default() + ..Node::hstack(px(20)) }, children![ - ( - Text::new("Inventar"), - TextFont::from_font_size(40.0), - TextColor(Color::WHITE), - ), - ( - Button, + text("Inventar", 40.0, Color::WHITE), + pill_button( ButtonType::InventoryClose, + ButtonVariant::Destructive, Node { - width: px(40.0), - height: px(40.0), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, + width: px(40), + height: px(40), ..default() }, - BackgroundColor(Color::srgb(0.8, 0.2, 0.2)), - BorderRadius::MAX, - children![( - Text::new("X"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE), - )] - ) + "X", + 24.0 + ), ], )); parent .spawn(Node { width: percent(100), - flex_direction: FlexDirection::Column, margin: UiRect::top(px(10.0)), - row_gap: px(10.0), - ..default() + ..Node::vstack(px(10)) }) .with_children(|parent| { for itemstack in items.iter() { diff --git a/src/features/inventory/ui/item.rs b/src/features/inventory/ui/item.rs index d674bc6..cb9517b 100644 --- a/src/features/inventory/ui/item.rs +++ b/src/features/inventory/ui/item.rs @@ -8,13 +8,10 @@ pub fn list_itemstack(itemstack: &ItemStack) -> impl Bundle { ( Node { - flex_direction: FlexDirection::Row, - column_gap: px(8), - align_items: AlignItems::Center, padding: UiRect::all(px(4)), - ..default() + ..Node::hstack(px(8)) }, - BackgroundColor(NORMAL_BUTTON), + BackgroundColor(ButtonVariant::Secondary.normal_background()), BorderRadius::all(px(10)), children![ ( @@ -24,28 +21,22 @@ pub fn list_itemstack(itemstack: &ItemStack) -> impl Bundle { aspect_ratio: Some(1.0), ..default() }, - BackgroundColor(HOVERED_BUTTON), + BackgroundColor(ButtonVariant::Secondary.hover_background()), BorderRadius::all(px(10)) ), ( Node { - flex_direction: FlexDirection::Column, justify_content: JustifyContent::Center, - row_gap: px(4), padding: UiRect::vertical(px(4)), - ..default() + ..Node::vstack(px(4)) }, children![ - ( - Text::new(format!("{} ({})", name, itemstack.amount)), - TextFont::from_font_size(14.0), - TextColor(Color::WHITE) + text( + format!("{} ({})", name, itemstack.amount), + 14.0, + Color::WHITE ), - ( - Text::new(itemstack.item_type.description()), - TextFont::from_font_size(10.0), - TextColor(Color::WHITE) - ) + text(itemstack.item_type.description(), 10.0, Color::WHITE) ] ) ], diff --git a/src/features/savegame/components.rs b/src/features/savegame/components.rs index c8690ae..c167311 100644 --- a/src/features/savegame/components.rs +++ b/src/features/savegame/components.rs @@ -92,3 +92,15 @@ impl SavegamePath { Self::new(next_index) } } + +#[derive(Component)] +pub enum RootMarker { + PopupSavegameLoad, +} + +#[derive(Component)] +pub enum ButtonType { + SavegameLoad { savegame_path: SavegamePath }, + SavegameDelete { savegame_path: SavegamePath }, + PopupClose, +} diff --git a/src/features/savegame/mod.rs b/src/features/savegame/mod.rs index a492b1c..eb6d0e3 100644 --- a/src/features/savegame/mod.rs +++ b/src/features/savegame/mod.rs @@ -1,4 +1,5 @@ use crate::features::phase::components::{SessionTracker, TimerSettings}; +use crate::features::savegame::ui::load_popup_handler; use crate::prelude::*; use messages::*; use std::fs::File; @@ -6,6 +7,7 @@ use std::io::{Read, Write}; pub mod components; pub mod messages; +pub mod ui; pub struct SavegamePlugin; @@ -16,6 +18,8 @@ impl Plugin for SavegamePlugin { app.add_systems(Update, dump_savegame.run_if(in_state(AppState::GameScreen))); app.add_systems(Update, load_savegame.run_if(in_state(AppState::GameScreen))); + + app.add_systems(Update, load_popup_handler); } } diff --git a/src/features/start_screen/ui/load.rs b/src/features/savegame/ui/load.rs similarity index 54% rename from src/features/start_screen/ui/load.rs rename to src/features/savegame/ui/load.rs index d820591..80b405e 100644 --- a/src/features/start_screen/ui/load.rs +++ b/src/features/savegame/ui/load.rs @@ -1,5 +1,5 @@ -use super::super::components::*; -use crate::prelude::*; +use super::super::components::{ButtonType, RootMarker}; +use crate::{features::savegame::messages::SavegameLoadMessage, prelude::*}; pub fn spawn_load_popup(commands: &mut Commands) { commands @@ -9,9 +9,7 @@ pub fn spawn_load_popup(commands: &mut Commands) { position_type: PositionType::Absolute, width: percent(100), height: percent(100), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, - ..default() + ..Node::center() }, ZIndex(1), BackgroundColor(Color::srgba(0.0, 0.0, 0.0, 0.8)), @@ -22,13 +20,12 @@ pub fn spawn_load_popup(commands: &mut Commands) { Node { width: px(600.0), height: px(500.0), - flex_direction: FlexDirection::Column, - align_items: AlignItems::Center, padding: UiRect::all(px(20.0)), - ..default() + align_items: AlignItems::Center, + ..Node::vstack(px(10)) }, BackgroundColor(Color::srgb(0.2, 0.2, 0.2)), - BorderRadius::all(Val::Px(10.0)), + BorderRadius::all(px(10.0)), )) .with_children(|parent| { parent.spawn(( @@ -40,27 +37,17 @@ pub fn spawn_load_popup(commands: &mut Commands) { ..default() }, children![ - ( - Text::new("Spielstand Auswahl"), - TextFont::from_font_size(40.0), - TextColor(Color::WHITE), - ), - ( - Button, + text("Spielstand Auswahl", 40.0, Color::WHITE), + pill_button( ButtonType::PopupClose, + ButtonVariant::Destructive, Node { - width: px(40.0), - height: px(40.0), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, + width: px(40), + height: px(40), ..default() }, - BackgroundColor(Color::srgb(0.8, 0.2, 0.2)), - children![( - Text::new("X"), - TextFont::from_font_size(24.0), - TextColor(Color::WHITE), - )] + "X", + 24.0 ) ], )); @@ -78,20 +65,20 @@ pub fn spawn_load_popup(commands: &mut Commands) { for savegame in SavegamePath::list() { parent.spawn(( Button, - ButtonType::PopupSavegameLoad { + ButtonType::SavegameLoad { savegame_path: savegame.path.clone(), }, + ButtonVariant::Secondary, Node { width: percent(100), height: px(80), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, flex_direction: FlexDirection::Row, column_gap: px(10.0), padding: UiRect::horizontal(px(10.0)), - ..default() + ..Node::center() }, - BackgroundColor(NORMAL_BUTTON), + BackgroundColor(ButtonVariant::Secondary.normal_background()), + BorderRadius::all(px(10)), children![ ( Node { @@ -102,43 +89,35 @@ pub fn spawn_load_popup(commands: &mut Commands) { ..default() }, children![ - ( - Text::new(format!( - "Spielstand {}", - savegame.index + 1 - )), - TextFont::from_font_size(24.0), - TextColor(Color::srgb(0.9, 0.9, 0.9)) + text( + format!("Spielstand {}", savegame.index + 1), + 24.0, + Color::WHITE ), - ( - Text::new(format!( + text( + format!( "Beeren: {}, Fokusphasen abgeschlossen: {}", savegame.total_berries, savegame.completed_focus - )), - TextFont::from_font_size(18.0), - TextColor(Color::srgb(0.9, 0.9, 0.9)) - ) + ), + 18.0, + Color::WHITE, + ), ] ), - ( - Button, - ButtonType::PopupSavegameDelete { + pill_button( + ButtonType::SavegameDelete { savegame_path: savegame.path.clone() }, + ButtonVariant::Destructive, Node { - width: px(40.0), - height: px(40.0), - justify_content: JustifyContent::Center, - align_items: AlignItems::Center, + width: px(40), + height: px(40), ..default() }, - children![( - Text::new("X"), - TextFont::from_font_size(24.0), - TextColor(Color::srgb(0.9, 0.9, 0.9)) - )] - ) + "X", + 24.0 + ), ], )); } @@ -146,3 +125,38 @@ pub fn spawn_load_popup(commands: &mut Commands) { }); }); } + +pub fn load_popup_handler( + mut commands: Commands, + mut next_state: ResMut>, + mut interaction_query: Query<(&Interaction, &ButtonType), (Changed, With