From 397ed8a144e03e4eaeedeb2f766557d8b420e6e4 Mon Sep 17 00:00:00 2001 From: core Date: Mon, 24 Mar 2025 22:00:50 -0400 Subject: [PATCH] theme! --- crates/client/src/components.rs | 6 ++ crates/client/src/lib.rs | 6 ++ crates/client/src/networking/mod.rs | 16 ++--- crates/client/src/networking/ws_wasm.rs | 6 +- crates/client/src/rendering/mod.rs | 25 ++----- crates/client/src/ui/colors.rs | 32 +++++++++ crates/client/src/ui/mod.rs | 91 +++++++++++++++++++++++++ crates/client/src/ui/widgets.rs | 16 +++++ 8 files changed, 166 insertions(+), 32 deletions(-) create mode 100644 crates/client/src/ui/colors.rs create mode 100644 crates/client/src/ui/mod.rs create mode 100644 crates/client/src/ui/widgets.rs diff --git a/crates/client/src/components.rs b/crates/client/src/components.rs index c26c75321dceaa42b8ebdc9ed50d0f6677561f7d..d46c900f0e8e8ebec2d23cccce3c1b72068c3a56 100644 --- a/crates/client/src/components.rs +++ b/crates/client/src/components.rs @@ -13,6 +13,12 @@ pub struct Transform { pub rotation: Rotation2, pub scale: Scale3, } +#[derive(Resource, Debug)] +pub struct PlayerResources { + pub fuel_amount: u32, + pub fuel_max: u32 +} + impl Transform { pub fn to_matrix(&self) -> Matrix4 { self.translation.to_homogeneous() diff --git a/crates/client/src/lib.rs b/crates/client/src/lib.rs index b0ddd0259caba5776ff1cfc495d38455bafef93a..7fdbd424632db9ec1e6bdcbb8ef0cfb653a8ca7d 100644 --- a/crates/client/src/lib.rs +++ b/crates/client/src/lib.rs @@ -6,6 +6,7 @@ use rendering::{assets::Assets, App}; use starkingdoms_common::packet::Packet; use tracing::info; use winit::event_loop::{ControlFlow, EventLoop}; +use crate::components::PlayerResources; #[cfg(target_arch = "wasm32")] #[path = "wasm/mod.rs"] @@ -17,6 +18,7 @@ pub mod platform; pub mod components; pub mod networking; pub mod rendering; +pub mod ui; // Hi, you've found the real main function! This is called AFTER platform-specific initialization code. pub fn start() { @@ -43,6 +45,10 @@ pub fn start() { world.insert_resource(Assets::new()); world.insert_resource(Ws::new()); + world.insert_resource(PlayerResources { + fuel_amount: 0, + fuel_max: 0, + }); let mut send_packet_events = Events::::default(); let recv_packet_events = Events::::default(); diff --git a/crates/client/src/networking/mod.rs b/crates/client/src/networking/mod.rs index 65a1ed5e6ba3443c403e733034b23193f2ef6e58..915fd71b124cdca86f89274cd3732651ca242a28 100644 --- a/crates/client/src/networking/mod.rs +++ b/crates/client/src/networking/mod.rs @@ -9,10 +9,7 @@ use bevy_ecs::{ use nalgebra::{Rotation2, Scale2, Scale3, Translation3}; use starkingdoms_common::{packet::Packet, PartType, PlanetType}; -use crate::components::{ - Camera, Part, Planet, Player, RecvPacket, SendPacket, ServerId, SpriteBundle, Texture, - Transform, -}; +use crate::components::{Camera, Part, Planet, Player, PlayerResources, RecvPacket, SendPacket, ServerId, SpriteBundle, Texture, Transform}; #[cfg(target_arch = "wasm32")] #[path = "ws_wasm.rs"] @@ -51,8 +48,6 @@ pub fn process_packets( send_packet_events: &mut Events, recv_packet_events: &mut Events, planet_types: &mut HashMap, - amount: &mut u32, - max: &mut u32, ) { use Packet::*; let mut recv_cursor = recv_packet_events.get_cursor(); @@ -201,11 +196,12 @@ pub fn process_packets( } } EnergyUpdate { - amount: m_amount, - max: m_max, + amount, + max, } => { - *amount = *m_amount; - *max = *m_max; + let mut r = world.resource_mut::(); + r.fuel_amount = *amount; + r.fuel_max = *max; } PlayerLeave { id } => { let mut part_query = world.query_filtered::<(Entity, &ServerId), With>(); diff --git a/crates/client/src/networking/ws_wasm.rs b/crates/client/src/networking/ws_wasm.rs index 340e868bcfece1d50bedf3ca4b8a93db57853517..cbd4edf3aca6f28ff96206fd426fd2f072c8cc56 100644 --- a/crates/client/src/networking/ws_wasm.rs +++ b/crates/client/src/networking/ws_wasm.rs @@ -29,12 +29,12 @@ pub struct Ws { impl Ws { pub fn new() -> Self { let window = web_sys::window().unwrap(); - let ws = WebSocket::new(&format!( + /*let ws = WebSocket::new(&format!( "ws://{}:{}", window.location().hostname().unwrap(), PORT - )) - .expect("Couldn't connect to server"); + ))*/ + let ws = WebSocket::new("ws://100.64.0.45:3000").expect("Couldn't connect to server"); let (packet_sender, receiver) = unbounded(); //let packet_sender = Rc::new(RwLock::new(packet_sender)); let (sender, packet_receiver) = unbounded(); diff --git a/crates/client/src/rendering/mod.rs b/crates/client/src/rendering/mod.rs index d2904704cafab3028edc70efce26d6575d848949..e8de55e0a3cf231a3703d32302b34ce59bde060d 100644 --- a/crates/client/src/rendering/mod.rs +++ b/crates/client/src/rendering/mod.rs @@ -46,6 +46,8 @@ use winit::{ use crate::components::{Camera, Player, RecvPacket, SendPacket, Texture, Transform}; use crate::networking::process_packets; use crate::networking::ws::Ws; +use crate::ui::{draw_ui, init_ui}; + #[cfg(not(target_arch = "wasm32"))] #[path = "assets_native.rs"] pub mod assets; @@ -79,8 +81,6 @@ pub struct App { left: bool, right: bool, - amount: u32, - max: u32, mouse_pos: PhysicalPosition, } @@ -332,6 +332,9 @@ impl ApplicationHandler for App { )); let egui_glow = egui_glow::EguiGlow::new(event_loop, gl.clone(), None, None, true); + + init_ui(egui_glow.egui_ctx.clone()); + self.egui_glow = Some(egui_glow); self.gl = Some(gl); } @@ -484,8 +487,6 @@ impl ApplicationHandler for App { &mut self.send_packet_events, &mut self.recv_packet_events, &mut self.planet_types, - &mut self.amount, - &mut self.max, ); let window = self.window.as_ref().unwrap(); @@ -497,21 +498,7 @@ impl ApplicationHandler for App { .as_mut() .unwrap() .run(self.window.as_ref().unwrap(), |ctx| { - egui::Window::new("Main Menu") - .resizable(false) - .show(ctx, |ui| { - ui.heading("Starkingdoms.tk"); - - ui.add(Label::new("Fuel:")); - ui.add( - ProgressBar::new((self.amount as f32) / (self.max as f32)) - .corner_radius(0), - ); - ui.add(Label::new(format!( - "Pos: {}, {}", - player.translation.x as u32, player.translation.y as u32 - ))); - }); + draw_ui(ctx, &mut self.world); }); let camera = self.world.get_resource::().unwrap(); diff --git a/crates/client/src/ui/colors.rs b/crates/client/src/ui/colors.rs new file mode 100644 index 0000000000000000000000000000000000000000..3565e85a86859e4600f52cb006b80e48ac48c6e8 --- /dev/null +++ b/crates/client/src/ui/colors.rs @@ -0,0 +1,32 @@ +macro_rules! color { + ($n:ident,rgb($r:expr, $g:expr, $b:expr)) => { + pub const $n: ::egui::Color32 = ::egui::Color32::from_rgb($r, $g, $b); + }; +} + +color!(ROSEWATER, rgb(245, 224, 220)); +color!(FLAMINGO, rgb(242, 205, 205)); +color!(PINK, rgb(245, 194, 231)); +color!(MAUVE, rgb(203, 166, 247)); +color!(RED, rgb(243, 139, 168)); +color!(MAROON, rgb(235, 160, 172)); +color!(PEACH, rgb(250, 179, 135)); +color!(YELLOW, rgb(249, 226, 175)); +color!(GREEN, rgb(166, 227, 161)); +color!(TEAL, rgb(148, 226, 213)); +color!(SKY, rgb(137, 220, 235)); +color!(SAPPHIRE, rgb(116, 199, 236)); +color!(BLUE, rgb(137, 180, 250)); +color!(LAVENDER, rgb(180, 190, 254)); +color!(TEXT, rgb(205, 214, 244)); +color!(SUBTEXT_1, rgb(186, 194, 222)); +color!(SUBTEXT_0, rgb(166, 173, 200)); +color!(OVERLAY_2, rgb(147, 153, 178)); +color!(OVERLAY_1, rgb(127, 132, 156)); +color!(OVERLAY_0, rgb(108, 112, 132)); +color!(SURFACE_2, rgb(88, 91, 112)); +color!(SURFACE_1, rgb(69, 71, 90)); +color!(SURFACE_0, rgb(49, 50, 68)); +color!(BASE, rgb(30, 30, 46)); +color!(MANTLE, rgb(24, 24, 37)); +color!(CRUST, rgb(17, 17, 27)); \ No newline at end of file diff --git a/crates/client/src/ui/mod.rs b/crates/client/src/ui/mod.rs new file mode 100644 index 0000000000000000000000000000000000000000..a901dba95ea75f4de6281c1aeacbc40b78c9d6d5 --- /dev/null +++ b/crates/client/src/ui/mod.rs @@ -0,0 +1,91 @@ +mod colors; +mod widgets; + +use bevy_ecs::prelude::With; +use bevy_ecs::world::World; +use egui::{Align, Align2, CornerRadius, CursorIcon, Layout, Order, ProgressBar, RichText, Shadow, Stroke, Visuals}; +use crate::components::{Player, PlayerResources, Transform}; +use crate::ui::widgets::{progress_bar, RichTextExt}; + +pub fn init_ui(ctx: egui::Context) { + // set colors + let mut style = egui::Style::default(); + + let mut visuals = Visuals::default(); + visuals.dark_mode = true; + + + // TODO(core): code_bg_colors + + visuals.warn_fg_color = colors::YELLOW; // used for warning text + visuals.error_fg_color = colors::RED; // used for error text + + visuals.window_shadow = Shadow::NONE; + visuals.window_fill = colors::MANTLE; // window background color + visuals.extreme_bg_color = colors::CRUST; // must be darker than window_fill + visuals.faint_bg_color = colors::BASE; // slightly different than window background color + visuals.window_stroke.color = colors::SURFACE_0; + visuals.window_highlight_topmost = false; + + visuals.text_cursor.stroke.color = colors::ROSEWATER; + + // TODO(core): button_frame, collapsing_header_frame + visuals.striped = true; + + visuals.interact_cursor = Some(CursorIcon::PointingHand); + + visuals.selection.bg_fill = colors::OVERLAY_2.gamma_multiply(0.2); // selection background + + visuals.hyperlink_color = colors::BLUE; + + + + visuals.widgets.noninteractive.fg_stroke.color = colors::TEXT; // standard text color + + + style.visuals = visuals; + + ctx.set_style(style); +} + +pub fn draw_ui(ctx: &egui::Context, world: &mut World) { + draw_hud(ctx, world); +} + +pub fn draw_hud(ctx: &egui::Context, world: &mut World) { + let mut player = world.query_filtered::<&Transform, With>(); + let player_position = player.single(&world); + let player_resources = world.resource::(); + + egui::Window::new("hud") + .title_bar(false) + .movable(false) + .resizable(false) + .order(Order::Foreground) + .anchor(Align2::CENTER_BOTTOM, [0.0, -5.0]) + .show(ctx, |ui| { + + ui.horizontal(|ui| { + ui.vertical(|ui| { + ui.label(RichText::new("Position:").stk_weak()); + ui.label(RichText::new(format!("{:.0}, {:.0}", player_position.translation.x / 10.0, player_position.translation.y / 10.0))) + }); + + ui.add_space(8.0); + + ui.vertical(|ui| { + ui.horizontal(|ui| { + ui.label(RichText::new("Fuel:").stk_weak()); + ui.with_layout(Layout::right_to_left(Align::Center), |ui| { + ui.label(RichText::new(format!("{}/{} ({:.2}%)", player_resources.fuel_amount, player_resources.fuel_max, player_resources.fuel_amount as f32 / player_resources.fuel_max as f32 * 100.0))) + }); + + }); + + ui.add( + progress_bar(player_resources.fuel_amount as f32 / player_resources.fuel_max as f32) + ); + }) + }); + }); +} \ No newline at end of file diff --git a/crates/client/src/ui/widgets.rs b/crates/client/src/ui/widgets.rs new file mode 100644 index 0000000000000000000000000000000000000000..7affcde7331602b2ad4b20ff0871ed3304849b1f --- /dev/null +++ b/crates/client/src/ui/widgets.rs @@ -0,0 +1,16 @@ +use egui::RichText; + +pub fn progress_bar(progress: f32) -> egui::ProgressBar { + egui::ProgressBar::new(progress) + .fill(super::colors::BLUE) + .corner_radius(0) +} + +pub trait RichTextExt { + fn stk_weak(self) -> Self; +} +impl RichTextExt for RichText { + fn stk_weak(self) -> Self { + self.color(super::colors::OVERLAY_2) + } +} \ No newline at end of file