commit

Cargo.lock

@@ -442,6 +442,7 @@ version = "0.12.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e4bc7e09282a82a48d70ade0c4c1154b0fd7882a735a39c66766a5d0f4718ea9"
 dependencies = [
+ "bevy_dylib",
  "bevy_internal",
 ]
 
@@ -617,6 +618,15 @@ dependencies = [
  "sysinfo",
 ]
 
+[[package]]
+name = "bevy_dylib"
+version = "0.12.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "45b99001eb4837c78d9c63cc8b32fda61ea96b194a2cda54b569aeee69a9853c"
+dependencies = [
+ "bevy_internal",
+]
+
 [[package]]
 name = "bevy_ecs"
 version = "0.12.1"

Cargo.toml

@@ -6,13 +6,16 @@ resolver = "2"
 missing_docs = "warn"
 
 [workspace.lints.clippy]
+type_complexity = "allow"
 missing_docs_in_private_items = "warn"
 unwrap_in_result = "warn"
 unwrap_used = "warn"
 nursery = "warn"
 
+# Enable a small amount of optimization in debug mode
 [profile.dev]
 opt-level = 1
 
+# Enable high optimizations for dependencies (incl. Bevy), but not for our code:
 [profile.dev.package."*"]
 opt-level = 3

crates/border-wars/Cargo.toml

@@ -11,7 +11,7 @@ authors = ["CoCoSol"]
 workspace = true
 
 [dependencies]
-bevy = "0.12.1"
+bevy = { version = "0.12.1", features = ["dynamic_linking"] }
 bevy_egui = "0.24.0"
 noise = "0.8.2"
 paste = "1.0.14"

crates/border-wars/src/lib.rs

@@ -8,7 +8,7 @@ pub mod responsive_scale;
 pub mod scenes;
 
 /// The current scene of the game.
-#[derive(Debug, Clone, Copy, Default, Eq, PartialEq, Hash, States)]
+#[derive(Debug, Clone, Copy, Default, Eq, PartialEq, Hash, States, Component)]
 pub enum CurrentScene {
     /// When we are in the main menu.
     #[default]
@@ -19,4 +19,17 @@ pub enum CurrentScene {
 
     /// When we play this wonderful game.
     Game,
+
+    /// When we are in the settings menu.
+    Setting,
+}
+
+/// Calculates the ui_scale.0 depending on the size of the main node
+pub fn change_scaling(mut ui_scale: ResMut<UiScale>, window: Query<&Window>) {
+    let window = window.single();
+    let (a, b) = (
+        window.resolution.width() / 1280.,
+        window.resolution.height() / 720.,
+    );
+    ui_scale.0 = if a < b { a } else { b } as f64
 }

crates/border-wars/src/main.rs

@@ -1,6 +1,7 @@
 //! The main entry point of the game.
 
 use bevy::prelude::*;
+use bevy::text::TextSettings;
 use border_wars::camera::CameraPlugin;
 use border_wars::map::click_tile::TilesClickable;
 use border_wars::map::renderer::RendererPlugin;
@@ -8,6 +9,10 @@ use border_wars::scenes::ScenesPlugin;
 
 fn main() {
     App::new()
+        .insert_resource(TextSettings {
+            allow_dynamic_font_size: true,
+            ..default()
+        })
         .add_plugins(DefaultPlugins)
         .add_plugins(ScenesPlugin)
         .add_plugins(RendererPlugin)

crates/border-wars/src/responsive_scale.rs

@@ -29,6 +29,9 @@ pub fn change_scaling(
     size: Res<UILayoutSize>,
 ) {
     let window = windows.get_single().expect("Main window not found");
+    if window.resolution.physical_height() == 0 {
+        return;
+    };
     let (a, b) = (
         window.resolution.width() / size.0.x,
         window.resolution.height() / size.0.y,

crates/border-wars/src/scenes/menu.rs

@@ -1,7 +1,6 @@
 //! The main menu of the game.
 
 use bevy::prelude::*;
-use bevy_egui::{egui, EguiContexts};
 
 use crate::CurrentScene;
 
@@ -10,36 +9,325 @@ pub struct MenuPlugin;
 
 impl Plugin for MenuPlugin {
     fn build(&self, app: &mut App) {
-        app.add_systems(Update, menu_ui.run_if(in_state(CurrentScene::Menu)));
+        app.add_systems(OnEnter(CurrentScene::Menu), menu_ui);
+        app.add_systems(Update, hover_system);
+        app.add_systems(Update, pressed_system);
+        app.add_systems(OnExit(CurrentScene::Menu), destroy_menu);
     }
 }
+
+/// A Component to identify hovered textures.
+#[derive(Component, Clone)]
+struct HoveredTexture {
+    /// TODO
+    texture: Handle<Image>,
+
+    /// TODO
+    hovered_texture: Handle<Image>,
+}
+
+/// A Component to identify menus entities.
+/// In order to be able to remove them later.
+#[derive(Component)]
+struct MenuEntity;
+
 /// Display the UI of the menu to host a game or join one.
-fn menu_ui(
-    mut ctx: EguiContexts,
-    mut connection_string: Local<String>,
+fn menu_ui(mut commands: Commands, asset_server: Res<AssetServer>) {
+    commands
+        .spawn(ImageBundle {
+            style: Style {
+                margin: UiRect::all(Val::Auto),
+                width: Val::Px(1280.),
+                height: Val::Px(720.),
+                flex_direction: FlexDirection::Column,
+                ..default()
+            },
+            image: asset_server.load("bw_menu_bg.png").into(),
+            z_index: ZIndex::Local(0),
+            ..default()
+        })
+        .insert(MenuEntity)
+        .with_children(|child: &mut ChildBuilder| main_node(child, &asset_server));
+
+    create_side_button(
+        UiRect {
+            left: Val::Px(25.),
+            right: Val::Auto,
+            top: Val::Px(25.),
+            bottom: Val::Auto,
+        },
+        CurrentScene::Setting,
+        &mut commands,
+        HoveredTexture {
+            texture: asset_server.load("setting.png"),
+            hovered_texture: asset_server.load("info.png"),
+        },
+    );
+
+    create_side_button(
+        UiRect {
+            left: Val::Auto,
+            right: Val::Px(25.),
+            top: Val::Px(25.),
+            bottom: Val::Auto,
+        },
+        CurrentScene::Lobby,
+        &mut commands,
+        HoveredTexture {
+            texture: asset_server.load("info.png"),
+            hovered_texture: asset_server.load("setting.png"),
+        },
+    );
+}
+
+/// A function to create a side button.
+fn create_side_button(
+    margin: UiRect,
+    target_scene: CurrentScene,
+    commands: &mut Commands,
+    textures: HoveredTexture,
+) {
+    commands
+        .spawn(ButtonBundle {
+            style: Style {
+                width: Val::Px(53.),
+                aspect_ratio: Some(1.),
+                margin,
+                ..default()
+            },
+            z_index: ZIndex::Global(14),
+            image: textures.texture.clone().into(),
+            ..default()
+        })
+        .insert((target_scene, textures, MenuEntity));
+}
+
+/// TODO
+fn create_button(
+    target_scene: CurrentScene,
+    commands: &mut ChildBuilder,
+    textures: HoveredTexture,
+) {
+    commands
+        .spawn(ButtonBundle {
+            style: Style {
+                width: Val::Px(297.),
+                height: Val::Px(40.),
+                margin: UiRect::all(Val::Auto),
+                ..default()
+            },
+            z_index: ZIndex::Global(1),
+            image: textures.texture.clone().into(),
+            ..default()
+        })
+        .insert((target_scene, textures));
+}
+
+/// TODO
+fn pressed_system(
+    interaction_query: Query<(&Interaction, &CurrentScene), (Changed<Interaction>, With<Button>)>,
     mut next_scene: ResMut<NextState<CurrentScene>>,
 ) {
-    egui::CentralPanel::default().show(ctx.ctx_mut(), |ui| {
-        ui.heading("Border Wars");
-
-        ui.separator();
-
-        ui.label("Connect to an existing game:");
-        ui.horizontal(|ui| {
-            ui.label("Game ID: ");
-            ui.text_edit_singleline(&mut *connection_string);
-
-            if ui.button("Join").clicked() {
-                next_scene.set(CurrentScene::Game);
-                // TODO: connect to the game
-            }
-        });
-
-        ui.separator();
-
-        if ui.button("Create new game").clicked() {
-            next_scene.set(CurrentScene::Lobby);
-            // TODO: create a new game
+    for (interaction, target_scene) in interaction_query.iter() {
+        if *interaction == Interaction::Pressed {
+            next_scene.set(*target_scene);
         }
-    });
+    }
+}
+
+/// TODO
+fn hover_system(
+    mut interaction_query: Query<
+        (&Interaction, &HoveredTexture, &mut UiImage),
+        Changed<Interaction>,
+    >,
+) {
+    for (interaction, textures, mut image) in interaction_query.iter_mut() {
+        match *interaction {
+            Interaction::Hovered => image.texture = textures.hovered_texture.clone(),
+            Interaction::None => image.texture = textures.texture.clone(),
+            Interaction::Pressed => (),
+        }
+    }
+}
+
+/// TODO
+fn default_style() -> Style {
+    Style {
+        flex_direction: FlexDirection::Column,
+        width: Val::Percent(100.),
+        height: Val::Percent(40.),
+        margin: UiRect::all(Val::Auto),
+        ..default()
+    }
+}
+
+/// TODO
+fn main_node(main_node: &mut ChildBuilder<'_, '_, '_>, asset_server: &Res<AssetServer>) {
+    main_node.spawn(ImageBundle {
+        style: Style {
+            height: Val::Px(78.),
+            width: Val::Px(614.),
+            margin: UiRect {
+                left: Val::Auto,
+                right: Val::Auto,
+                top: Val::Px(25.),
+                bottom: Val::Px(25.),
+            },
+            ..default()
+        },
+        image: asset_server.load("border_wars.png").into(),
+        ..default()
+    });
+
+    main_node
+        .spawn(NodeBundle {
+            style: Style {
+                flex_direction: FlexDirection::Column,
+                margin: UiRect {
+                    left: (Val::Auto),
+                    right: (Val::Auto),
+                    top: (Val::Px(25.)),
+                    bottom: (Val::Auto),
+                },
+                width: Val::Px(500.),
+                height: Val::Percent(65.),
+                ..default()
+            },
+            ..default()
+        })
+        .with_children(|container| {
+            container
+                .spawn(NodeBundle {
+                    style: default_style(),
+                    ..default()
+                })
+                .with_children(|host| {
+                    host.spawn(NodeBundle {
+                        style: default_style(),
+                        ..default()
+                    })
+                    .with_children(|ui| {
+                        ui.spawn(NodeBundle {
+                            style: Style {
+                                flex_direction: FlexDirection::Row,
+                                ..default()
+                            },
+                            ..default()
+                        })
+                        .with_children(|ui2| {
+                            ui2.spawn(ImageBundle {
+                                style: Style {
+                                    height: Val::Px(41.),
+                                    width: Val::Px(51.),
+                                    margin: UiRect {
+                                        left: Val::Px(0.),
+                                        right: Val::Px(15.),
+                                        top: Val::Px(0.),
+                                        bottom: Val::Px(0.),
+                                    },
+                                    ..default()
+                                },
+                                image: asset_server.load("host_icon.png").into(),
+                                ..default()
+                            });
+                            ui2.spawn(ImageBundle {
+                                style: Style {
+                                    height: Val::Px(41.),
+                                    width: Val::Px(115.),
+                                    ..default()
+                                },
+                                image: asset_server.load("host.png").into(),
+                                ..default()
+                            });
+                        });
+                        ui.spawn(ImageBundle {
+                            style: Style {
+                                margin: UiRect::all(Val::Auto),
+                                ..default()
+                            },
+                            image: asset_server.load("trait.png").into(),
+                            ..default()
+                        });
+                    });
+                    create_button(
+                        CurrentScene::Lobby,
+                        host,
+                        HoveredTexture {
+                            texture: asset_server.load("button.png"),
+                            hovered_texture: asset_server.load("button.png"),
+                        },
+                    )
+                });
+
+            container
+                .spawn(NodeBundle {
+                    style: default_style(),
+                    ..default()
+                })
+                .with_children(|join| {
+                    join.spawn(NodeBundle {
+                        style: default_style(),
+                        ..default()
+                    })
+                    .with_children(|ui| {
+                        ui.spawn(NodeBundle {
+                            style: Style {
+                                flex_direction: FlexDirection::Row,
+                                ..default()
+                            },
+                            ..default()
+                        })
+                        .with_children(|ui2| {
+                            ui2.spawn(ImageBundle {
+                                style: Style {
+                                    height: Val::Px(33.),
+                                    width: Val::Px(51.),
+                                    margin: UiRect {
+                                        left: Val::Px(0.),
+                                        right: Val::Px(15.),
+                                        top: Val::Auto,
+                                        bottom: Val::Auto,
+                                    },
+                                    ..default()
+                                },
+                                image: asset_server.load("join_icon.png").into(),
+                                ..default()
+                            });
+                            ui2.spawn(ImageBundle {
+                                style: Style {
+                                    height: Val::Px(41.),
+                                    width: Val::Px(115.),
+                                    ..default()
+                                },
+                                image: asset_server.load("join.png").into(),
+                                ..default()
+                            });
+                        });
+                        ui.spawn(ImageBundle {
+                            style: Style {
+                                margin: UiRect::all(Val::Auto),
+                                ..default()
+                            },
+                            image: asset_server.load("trait.png").into(),
+                            ..default()
+                        });
+                    });
+                    create_button(
+                        CurrentScene::Game,
+                        join,
+                        HoveredTexture {
+                            texture: asset_server.load("button.png"),
+                            hovered_texture: asset_server.load("button.png"),
+                        },
+                    )
+                });
+        });
+}
+
+/// The function that destroys the menu.
+fn destroy_menu(mut commands: Commands, query: Query<Entity, With<MenuEntity>>) {
+    for entity in query.iter() {
+        commands.entity(entity).despawn_recursive();
+    }
 }