feat: add icon to initials input

lib/game/components/game_flow_controller.dart

@@ -32,6 +32,8 @@ class GameFlowController extends ComponentController<PinballGame>
     // next page
     component.firstChild<Backboard>()?.gameOverMode(
           score: state?.score ?? 0,
+          characterIconPath:
+              component.theme.characterTheme.leaderboardIcon.keyName,
         );
     component.firstChild<CameraController>()?.focusOnBackboard();
   }

packages/pinball_components/lib/gen/pinball_fonts.dart

@@ -12,5 +12,5 @@ class PinballFonts {
   static final String pixeloidMono = _prefixFont(FontFamily.pixeloidMono);
 
   /// Sans variation of the Pixeloid font
-  static final String pixeloidSans = _prefixFont(FontFamily.pixeloidMono);
+  static final String pixeloidSans = _prefixFont(FontFamily.pixeloidSans);
 }

packages/pinball_components/lib/src/components/backboard/backboard.dart

@@ -34,12 +34,14 @@ class Backboard extends PositionComponent with HasGameRef {
   /// Returns a [Backboard] initialized in the game over mode
   factory Backboard.gameOver({
     required Vector2 position,
+    required String characterIconPath,
     required int score,
     required BackboardOnSubmit onSubmit,
   }) {
     return Backboard(position: position)
       ..gameOverMode(
         score: score,
+        characterIconPath: characterIconPath,
         onSubmit: onSubmit,
       );
   }
@@ -62,12 +64,14 @@ class Backboard extends PositionComponent with HasGameRef {
   /// Puts the Backboard in game over mode, where the score input is shown.
   Future<void> gameOverMode({
     required int score,
+    required String characterIconPath,
     BackboardOnSubmit? onSubmit,
   }) async {
     children.removeWhere((_) => true);
     await add(
       BackboardGameOver(
         score: score,
+        characterIconPath: characterIconPath,
         onSubmit: onSubmit,
       ),
     );

packages/pinball_components/lib/src/components/backboard/backboard_game_over.dart

@@ -1,6 +1,7 @@
 import 'dart:async';
 import 'dart:math';
 
+import 'package:flame/assets.dart';
 import 'package:flame/components.dart';
 import 'package:flutter/services.dart';
 import 'package:pinball_components/pinball_components.dart';
@@ -18,11 +19,14 @@ class BackboardGameOver extends PositionComponent with HasGameRef {
   /// {@macro backboard_game_over}
   BackboardGameOver({
     required int score,
+    required String characterIconPath,
     BackboardOnSubmit? onSubmit,
   })  : _score = score,
+        _characterIconPath = characterIconPath,
         _onSubmit = onSubmit;
 
   final int _score;
+  final String _characterIconPath;
   final BackboardOnSubmit? _onSubmit;
 
   @override
@@ -30,7 +34,6 @@ class BackboardGameOver extends PositionComponent with HasGameRef {
     final backgroundSprite = await gameRef.loadSprite(
       Assets.images.backboard.backboardGameOver.keyName,
     );
-
     unawaited(
       add(
         SpriteComponent(
@@ -44,7 +47,6 @@ class BackboardGameOver extends PositionComponent with HasGameRef {
     final displaySprite = await gameRef.loadSprite(
       Assets.images.backboard.display.keyName,
     );
-
     unawaited(
       add(
         SpriteComponent(
@@ -60,20 +62,35 @@ class BackboardGameOver extends PositionComponent with HasGameRef {
       add(
         TextComponent(
           text: _score.formatScore(),
-          position: Vector2(-22, -46.5),
+          position: Vector2(-34, -45),
-          anchor: Anchor.center,
+          anchor: Anchor.centerLeft,
           textRenderer: Backboard.textPaint,
         ),
       ),
     );
 
+    final characterIconSprite = await Sprite.load(
+      _characterIconPath,
+      images: Images(prefix: ''),
+    );
+    unawaited(
+      add(
+        SpriteComponent(
+          sprite: characterIconSprite,
+          size: characterIconSprite.originalSize / 10,
+          anchor: Anchor.center,
+          position: Vector2(18.4, -45),
+        ),
+      ),
+    );
+
     for (var i = 0; i < 3; i++) {
       unawaited(
         add(
           BackboardLetterPrompt(
             position: Vector2(
-              20 + (6 * i).toDouble(),
+              24.3 + (4.5 * i),
-              -46.5,
+              -45,
             ),
             hasFocus: i == 0,
           ),

packages/pinball_components/lib/src/components/backboard/backboard_letter_prompt.dart

@@ -35,11 +35,11 @@ class BackboardLetterPrompt extends PositionComponent {
   Future<void> onLoad() async {
     _underscore = RectangleComponent(
       size: Vector2(
-        4,
+        3.8,
-        1.2,
+        0.8,
       ),
       anchor: Anchor.center,
-      position: Vector2(0, 4),
+      position: Vector2(-0.3, 4),
     );
 
     unawaited(add(_underscore));

packages/pinball_components/pubspec.yaml

@@ -16,6 +16,8 @@ dependencies:
   intl: ^0.17.0
   pinball_flame:
     path: ../pinball_flame
+  pinball_theme:
+    path: ../pinball_theme
 
 
 dev_dependencies:

packages/pinball_components/sandbox/lib/stories/backboard/game_over.dart

@@ -4,13 +4,25 @@ import 'package:pinball_components/pinball_components.dart';
 import 'package:sandbox/common/common.dart';
 
 class BackboardGameOverGame extends BasicKeyboardGame {
-  BackboardGameOverGame(this.score);
+  BackboardGameOverGame(this.score, this.character);
 
   static const info = '''
-      Simple example showing the waiting mode of the backboard.
+      Simple example showing the game over mode of the backboard.
+
+      - Select a character to update the character icon.
   ''';
 
   final int score;
+  final String character;
+
+  final characterIconPaths = <String, String>{
+    'Dash': 'packages/pinball_theme/assets/images/dash/leaderboard_icon.png',
+    'Sparky':
+        'packages/pinball_theme/assets/images/sparky/leaderboard_icon.png',
+    'Android':
+        'packages/pinball_theme/assets/images/android/leaderboard_icon.png',
+    'Dino': 'packages/pinball_theme/assets/images/dino/leaderboard_icon.png',
+  };
 
   @override
   Future<void> onLoad() async {
@@ -22,6 +34,7 @@ class BackboardGameOverGame extends BasicKeyboardGame {
       Backboard.gameOver(
         position: Vector2(0, 20),
         score: score,
+        characterIconPath: characterIconPaths[character]!,
         onSubmit: (initials) {
           add(
             ScoreText(

packages/pinball_components/sandbox/lib/stories/backboard/stories.dart

@@ -5,6 +5,7 @@ import 'package:sandbox/stories/backboard/game_over.dart';
 import 'package:sandbox/stories/backboard/waiting.dart';
 
 void addBackboardStories(Dashbook dashbook) {
+  final characters = ['Dash', 'Sparky', 'Android', 'Dino'];
   dashbook.storiesOf('Backboard')
     ..add(
       'Waiting mode',
@@ -18,7 +19,12 @@ void addBackboardStories(Dashbook dashbook) {
       'Game over',
       (context) => GameWidget(
         game: BackboardGameOverGame(
-          context.numberProperty('score', 9000000000).toInt(),
+          context.numberProperty('Score', 9000000000).toInt(),
+          context.listProperty(
+            'Character',
+            characters.first,
+            characters,
+          ),
         ),
       ),
       codeLink: buildSourceLink('backboard/game_over.dart'),

packages/pinball_components/sandbox/pubspec.lock

@@ -64,6 +64,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.0"
+  equatable:
+    dependency: transitive
+    description:
+      name: equatable
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.0.3"
   fake_async:
     dependency: transitive
     description:
@@ -247,6 +254,13 @@ packages:
       relative: true
     source: path
     version: "1.0.0+1"
+  pinball_theme:
+    dependency: transitive
+    description:
+      path: "../../pinball_theme"
+      relative: true
+    source: path
+    version: "1.0.0+1"
   platform:
     dependency: transitive
     description:

packages/pinball_components/test/src/components/backboard_test.dart

@@ -12,6 +12,8 @@ import '../../helpers/helpers.dart';
 void main() {
   group('Backboard', () {
     final tester = FlameTester(KeyboardTestGame.new);
+    const characterIconPath =
+        'packages/pinball_theme/assets/images/dash/leaderboard_icon.png';
 
     group('on waitingMode', () {
       tester.testGameWidget(
@@ -39,6 +41,7 @@ void main() {
           final backboard = Backboard.gameOver(
             position: Vector2(0, 15),
             score: 1000,
+            characterIconPath: characterIconPath,
             onSubmit: (_) {},
           );
           await game.ensureAdd(backboard);
@@ -52,7 +55,6 @@ void main() {
                 (component) =>
                     component is TextComponent && component.text == '1,000',
               );
-
           expect(score, isNotNull);
         },
       );
@@ -63,6 +65,7 @@ void main() {
           final backboard = Backboard.gameOver(
             position: Vector2(0, 15),
             score: 1000,
+            characterIconPath: characterIconPath,
             onSubmit: (_) {},
           );
           await game.ensureAdd(backboard);
@@ -106,6 +109,7 @@ void main() {
           final backboard = Backboard.gameOver(
             position: Vector2(0, 15),
             score: 1000,
+            characterIconPath: characterIconPath,
             onSubmit: (value) {
               submitedInitials = value;
             },

test/game/components/game_flow_controller_test.dart

@@ -5,6 +5,7 @@ import 'package:flutter_test/flutter_test.dart';
 import 'package:mocktail/mocktail.dart';
 import 'package:pinball/game/game.dart';
 import 'package:pinball_components/pinball_components.dart';
+import 'package:pinball_theme/pinball_theme.dart';
 
 import '../../helpers/helpers.dart';
 
@@ -43,6 +44,7 @@ void main() {
         when(
           () => backboard.gameOverMode(
             score: any(named: 'score'),
+            characterIconPath: any(named: 'characterIconPath'),
             onSubmit: any(named: 'onSubmit'),
           ),
         ).thenAnswer((_) async {});
@@ -55,6 +57,8 @@ void main() {
         when(game.firstChild<Backboard>).thenReturn(backboard);
         when(game.firstChild<CameraController>).thenReturn(cameraController);
         when(() => game.overlays).thenReturn(overlays);
+        when(() => game.theme)
+            .thenReturn(PinballTheme(characterTheme: DashTheme()));
       });
 
       test(
@@ -71,6 +75,7 @@ void main() {
           verify(
             () => backboard.gameOverMode(
               score: 0,
+              characterIconPath: any(named: 'characterIconPath'),
               onSubmit: any(named: 'onSubmit'),
             ),
           ).called(1);