Finished basic implementation of drumroll indicator

scratch.md

@@ -0,0 +1,3 @@
+For the balloon sprite, the smallest is of radius 80 and the largest is of radius 300, which means if i want 5 different
+sprites for levels of progress,
+the diameters will be [80.0, 135.0, 190.0, 245.0, 300.0]

src/game/taiko_mode/scene.rs

@@ -378,7 +378,7 @@ impl GameState for TaikoMode {
                             hit_target,
                         } => {
                             self.results.drumrolls += 1;
-                            self.balloon_display.hit(hits_left, hit_target);
+                            self.balloon_display.hit(hits_left, hit_target, &mut ctx.renderer);
 
                             if hits_left == 0 {
                                 self.next_note_index = note_index + 1;

src/game/taiko_mode/ui.rs

@@ -3,18 +3,19 @@ use crate::game::{RenderContext, TextureCache};
 use crate::render::shapes::{LinearGradient, Shape, ShapeBuilder, SolidColour};
 use crate::render::text::BuildTextWithRenderer;
 use crate::render::texture::{AnimatedSprite, AnimatedSpriteBuilder, Frame, Sprite, SpriteBuilder};
-use crate::render::{Renderable, Renderer};
+use crate::render::{Renderable, Renderer, rgb};
 use kaku::{FontSize, HorizontalAlignment, Text, TextBuilder, VerticalAlignment};
 use lyon::geom::point;
 use lyon::lyon_tessellation::{BuffersBuilder, StrokeOptions};
 use lyon::path::Path;
 use std::time::Instant;
 use wgpu::RenderPass;
 
+
 use super::note::{TaikoModeBarline, TaikoModeNote};
 
 // Colours
-pub const HEADER_TOP_COL: [f32; 4] = [30. / 255., 67. / 255., 198. / 255., 0.94];
+pub const HEADER_TOP_COL: [f32; 4] = [30. / 255., 67. / 255., 198. / 255., 1.];
 pub const HEADER_BOTTOM_COL: [f32; 4] = [150. / 255., 90. / 255., 225. / 255., 1.];
 pub const NOTE_FIELD_COL: [f32; 4] = [45. / 255., 45. / 255., 45. / 255., 1.];
 pub const CREAM: [f32; 4] = [1., 235. / 255., 206. / 255., 1.];
@@ -260,9 +261,9 @@ impl Renderable for JudgementText {
 pub struct BalloonDisplay {
     bg_bubble: Sprite,
     drumroll_message: Text,
+    roll_number_text: Text,
     balloon_sprite: AnimatedSprite,
     displaying: bool,
-    // TODO: Text indicating the number of rolls left
 }
 
 impl BalloonDisplay {
@@ -285,6 +286,14 @@ impl BalloonDisplay {
                 .outlined([0., 0., 0., 1.], 3.)
                 .build_text(renderer);
 
+        let roll_number_text = TextBuilder::new("0", renderer.font("mochiy pop one"), [765., 240.])
+            .color(rgb!(0xFF, 0x8E, 0x4B))
+            .font_size(Some(FontSize::Px(80.)))
+            .horizontal_align(HorizontalAlignment::Center)
+            .vertical_align(VerticalAlignment::Top)
+            .outlined(rgb!(0x60, 0x2B, 0x0C), 3.)
+            .build_text(renderer);
+
         let balloon_sprite = AnimatedSpriteBuilder::new(vec![
             Frame::new(
                 textures.get(&renderer.device, &renderer.queue, "balloon 1.png")?,
@@ -306,6 +315,7 @@ impl BalloonDisplay {
             bg_bubble,
             drumroll_message,
             balloon_sprite,
+            roll_number_text,
             displaying: false,
         })
     }
@@ -317,14 +327,33 @@ impl BalloonDisplay {
     }
 
     /// Displays the balloon and number of hits left
-    pub fn hit(&mut self, hits_left: u32, _hit_target: u32) {
+    pub fn hit(&mut self, hits_left: u32, hit_target: u32, renderer: &mut Renderer) {
         if !self.displaying {
             self.displaying = true;
         }
 
         if hits_left == 0 {
             self.displaying = false;
         }
+
+        self.roll_number_text.set_text(
+            format!("{hits_left}"),
+            &renderer.device,
+            &renderer.queue,
+            &mut renderer.text_renderer,
+        );
+
+        let ratio = hits_left as f32 / hit_target as f32;
+
+        let image_index = if ratio > 0.8 {
+            0
+        } else if ratio > 0.4 {
+            1
+        } else {
+            2
+        };
+
+        self.balloon_sprite.set_index(image_index, renderer);
     }
 
     /// Plays the animation for popping the balloon
@@ -345,6 +374,7 @@ impl Renderable for BalloonDisplay {
             self.balloon_sprite.render(renderer, render_pass);
             self.bg_bubble.render(renderer, render_pass);
             self.drumroll_message.render(renderer, render_pass);
+            self.roll_number_text.render(renderer, render_pass);
         }
     }
 }

src/render/mod.rs

@@ -13,6 +13,26 @@ use texture::TextureVertex;
 
 use self::texture::SpriteInstance;
 
+macro_rules! rgba {
+    ($r:expr, $g:expr, $b:expr, $a:expr) => {
+        [
+            {$r} as f32 / 255.,
+            {$g} as f32 / 255.,
+            {$b} as f32 / 255.,
+            {$a} as f32 / 255.,
+        ]
+    };
+}
+
+macro_rules! rgb {
+    ($r:expr, $g:expr, $b:expr) => {
+        [{$r} as f32 / 255., {$g} as f32 / 255., {$b} as f32 / 255., 1.]
+    };
+}
+
+pub(crate) use rgb;
+pub(crate) use rgba;
+
 const SAMPLE_COUNT: u32 = 4;
 const CLEAR_COLOUR: wgpu::Color = wgpu::Color::BLACK;
 const DEPTH_FORMAT: wgpu::TextureFormat = wgpu::TextureFormat::Depth32Float;
@@ -247,7 +267,7 @@ impl Renderer {
             .formats
             .iter()
             .copied()
-            .find(|f| f.is_srgb())
+            .find(|f| !f.is_srgb())
             .unwrap_or(surface_capabilities.formats[0]);
 
         let config = wgpu::SurfaceConfiguration {

src/render/shaders/primitive_shader.wgsl

@@ -41,7 +41,10 @@ fn vs_main(in: VertexInput, instance: Instance) -> VertexOutput {
 
     out.clip_position = screen_matrix * vec4<f32>(in.position + instance.world_position, 1.0);
     out.clip_position.z = quick_sigmoid(out.clip_position.z);
-    out.colour = vec4<f32>(pow(in.colour.xyz, vec3<f32>(2.2)), in.colour.w);
+    // For non-srgb:
+    out.colour = in.colour;
+    // // For srgb:
+    // out.colour = vec4<f32>(pow(in.colour.xyz, vec3<f32>(2.2)), in.colour.w);
     return out;
 }
 

src/render/texture.rs

@@ -216,7 +216,7 @@ impl Texture {
             mip_level_count: 1,
             sample_count: 1,
             dimension: wgpu::TextureDimension::D2,
-            format: wgpu::TextureFormat::Rgba8UnormSrgb,
+            format: wgpu::TextureFormat::Rgba8Unorm,
             usage: wgpu::TextureUsages::COPY_DST | wgpu::TextureUsages::TEXTURE_BINDING,
             view_formats: &[],
         });