add leaderboard to home screen

Author: it-me-joda

assets/images/leaderboard-button.png

@@ -71,6 +71,7 @@ pub enum ImageKey {
     StartButton,
     CreditsButton,
     SubmitButton,
+    LeaderboardButton,
 }
 
 impl AssetKey for ImageKey {
@@ -342,6 +343,15 @@ impl FromWorld for HandleMap<ImageKey> {
                     },
                 ),
             ),
+            (
+                ImageKey::LeaderboardButton,
+                asset_server.load_with_settings(
+                    "images/leaderboard-button.png",
+                    |settings: &mut ImageLoaderSettings| {
+                        settings.sampler = ImageSampler::nearest();
+                    },
+                ),
+            ),
         ]
         .into()
     }

src/game/assets.rs

@@ -23,7 +23,7 @@ pub(super) fn plugin(app: &mut App) {
 
 #[derive(Component, Debug, Clone, Copy, PartialEq, Eq, Reflect)]
 #[reflect(Component)]
-enum CreditsAction {
+pub enum CreditsAction {
     Back,
 }
 

src/screen/credits.rs

@@ -0,0 +1,151 @@
+//! A loading screen during which game assets are loaded.
+//! This reduces stuttering, especially for audio on WASM.
+
+use bevy::prelude::*;
+use bevy_http_client::prelude::{TypedRequest, TypedResponse};
+
+use super::{
+    credits::CreditsAction,
+    playing::{get_scores, LeaderboardRecord},
+    PlayingState, Screen,
+};
+use crate::{
+    game::{
+        assets::{HandleMap, ImageKey, SoundtrackKey},
+        audio::soundtrack::PlaySoundtrack,
+    },
+    ui::prelude::*,
+};
+
+pub(super) fn plugin(app: &mut App) {
+    app.add_systems(OnEnter(Screen::Leaderboard), enter_leaderboard);
+    app.add_systems(
+        Update,
+        handle_credits_action.run_if(in_state(Screen::Leaderboard)),
+    );
+
+    app.add_systems(
+        Update,
+        handle_response.run_if(in_state(Screen::Leaderboard)),
+    );
+}
+
+fn enter_leaderboard(
+    mut commands: Commands,
+    mut ev_request: EventWriter<TypedRequest<Vec<LeaderboardRecord>>>,
+    image_handles: Res<HandleMap<ImageKey>>,
+) {
+    get_scores(ev_request);
+
+    commands.spawn((
+        SpriteBundle {
+            texture: image_handles[&ImageKey::TitleBackground].clone_weak(),
+            transform: Transform {
+                translation: Vec3::new(0.0, -110.0, -100.0),
+                ..default()
+            },
+            sprite: Sprite {
+                custom_size: Some(Vec2::new(1280.0, 1280.0)),
+                ..default()
+            },
+            ..default()
+        },
+        StateScoped(Screen::Leaderboard),
+    ));
+
+    commands.spawn((
+        TextBundle {
+            text: Text::from_section(
+                "Leaderboard",
+                TextStyle {
+                    font_size: 30.0,
+                    color: Color::WHITE,
+                    ..default()
+                },
+            ),
+            style: Style {
+                justify_self: JustifySelf::Center,
+                margin: UiRect {
+                    top: Val::Px(50.0),
+                    ..default()
+                },
+                ..default()
+            },
+            ..default()
+        },
+        StateScoped(Screen::Leaderboard),
+    ));
+
+    commands
+        .ui_root()
+        .insert(StateScoped(Screen::Leaderboard))
+        .with_children(|children| {
+            children
+                .button("Back")
+                .insert(CreditsAction::Back)
+                .insert(Style {
+                    margin: UiRect {
+                        top: Val::Px(600.0),
+                        ..default()
+                    },
+                    padding: UiRect {
+                        top: Val::Px(10.0),
+                        bottom: Val::Px(10.0),
+                        left: Val::Px(20.0),
+                        right: Val::Px(20.0),
+                    },
+                    ..default()
+                });
+        });
+}
+
+fn handle_credits_action(
+    mut commands: Commands,
+    mut next_screen: ResMut<NextState<Screen>>,
+    mut button_query: InteractionQuery<&CreditsAction>,
+) {
+    for (interaction, action) in &mut button_query {
+        if matches!(interaction, Interaction::Pressed) {
+            match action {
+                CreditsAction::Back => {
+                    next_screen.set(Screen::Title);
+                    commands.trigger(PlaySoundtrack::Key(SoundtrackKey::Menu));
+                }
+            }
+        }
+    }
+}
+
+fn handle_response(
+    mut commands: Commands,
+    mut ev_response: EventReader<TypedResponse<Vec<LeaderboardRecord>>>,
+) {
+    for res in ev_response.read() {
+        for (i, score) in res.iter().take(25).enumerate() {
+            let text = format!("{}. {} - {:.2}", i + 1, score.name, score.score);
+            commands.spawn((
+                TextBundle {
+                    text: Text::from_section(
+                        text,
+                        TextStyle {
+                            font_size: 20.0,
+                            color: Color::WHITE,
+                            ..default()
+                        },
+                    ),
+                    style: Style {
+                        justify_self: JustifySelf::Center,
+                        margin: UiRect {
+                            top: Val::Px(90.0 + (i as f32 * 20.0)),
+                            ..default()
+                        },
+                        ..default()
+                    },
+                    ..default()
+                },
+                StateScoped(PlayingState::GameOver),
+                StateScoped(Screen::Leaderboard),
+            ));
+        }
+    }
+}

src/screen/leaderboard.rs

@@ -1,6 +1,7 @@
 //! The game's main screen states and transitions between them.
 
 mod credits;
+pub mod leaderboard;
 mod loading;
 mod playing;
 mod splash;
@@ -18,6 +19,7 @@ pub(super) fn plugin(app: &mut App) {
         title::plugin,
         credits::plugin,
         playing::plugin,
+        leaderboard::plugin,
     ));
 }
 
@@ -30,6 +32,7 @@ pub enum Screen {
     Title,
     Credits,
     Playing,
+    Leaderboard,
 }
 
 #[derive(States, Debug, Clone, PartialEq, Eq, Hash)]

src/screen/mod.rs

@@ -39,7 +39,10 @@ pub(super) fn plugin(app: &mut App) {
 
     app.register_request_type::<Vec<LeaderboardRecord>>();
     app.register_request_type::<LeaderboardBody>();
-    app.add_systems(Update, handle_response);
+    app.add_systems(
+        Update,
+        handle_response.run_if(in_state(PlayingState::GameOver)),
+    );
 }
 
 fn enter_playing(mut commands: Commands, mut next_state: ResMut<NextState<PlayingState>>) {
@@ -310,10 +313,10 @@ fn game_over(
 }
 
 #[derive(Serialize, Deserialize, Debug)]
-struct LeaderboardRecord {
-    id: String,
-    name: String,
-    score: f32,
+pub struct LeaderboardRecord {
+    pub id: String,
+    pub name: String,
+    pub score: f32,
 }
 
 pub fn submit_score(
@@ -330,7 +333,7 @@ pub fn submit_score(
     );
 }
 
-fn get_scores(mut ev_request: EventWriter<TypedRequest<Vec<LeaderboardRecord>>>) {
+pub fn get_scores(mut ev_request: EventWriter<TypedRequest<Vec<LeaderboardRecord>>>) {
     ev_request.send(
         HttpClient::new()
             .get("https://sr5t5qmb4c.execute-api.us-east-1.amazonaws.com/prod/leaderboard")

src/screen/playing.rs

@@ -36,6 +36,7 @@ pub enum TitleAction {
     Exit,
     Menu,
     SubmitScore,
+    Leaderboard,
 }
 
 #[derive(Component)]
@@ -151,6 +152,31 @@ fn enter_title(
         StateScoped(Screen::Title),
     ));
 
+    commands.spawn((
+        ButtonBundle {
+            style: Style {
+                width: Val::Px(213.0),
+                height: Val::Px(63.0),
+                justify_content: JustifyContent::Center,
+                align_items: AlignItems::Center,
+                align_self: AlignSelf::Center,
+                justify_self: JustifySelf::Center,
+                margin: UiRect {
+                    top: Val::Px(240.0),
+                    ..default()
+                },
+                ..default()
+            },
+            image: UiImage {
+                texture: images[&ImageKey::LeaderboardButton].clone_weak(),
+                ..default()
+            },
+            ..default()
+        },
+        TitleAction::Leaderboard,
+        StateScoped(Screen::Title),
+    ));
+
     commands.spawn((
         SpriteBundle {
             texture: images[&ImageKey::TitleBackground].clone_weak(),
@@ -167,7 +193,7 @@ fn enter_title(
     commands.spawn((
         SpriteBundle {
             texture: images[&ImageKey::TitleHand].clone_weak(),
-            transform: Transform::from_translation(Vec3::new(-370.0, 0.0, 0.0)),
+            transform: Transform::from_translation(Vec3::new(-370.0, -50.0, 0.0)),
             sprite: Sprite {
                 custom_size: Some(Vec2::new(350.0, 350.0)),
                 ..default()
@@ -270,6 +296,9 @@ fn handle_title_action(
                     }
                     submit_score(name.0.clone().unwrap(), scoresource.0, &mut ev_request);
                 }
+                TitleAction::Leaderboard => {
+                    next_screen.set(Screen::Leaderboard);
+                }
             }
         }
     }