feat: add heart beat for timing

2026-06-19 02:28:07 +03:30
parent a4cf2b5f39
commit c4c1453f7e
6 changed files with 476 additions and 246 deletions
@@ -4,6 +4,7 @@ import 'package:flame/game.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:go_router/go_router.dart';
+import 'package:random_avatar/random_avatar.dart';

 import '../../../../core/network/ws_client.dart';
 import '../../../../core/service/app_sounds.dart';
@@ -50,56 +51,63 @@ class _GameScreenState extends State<GameScreen> {
      onPopInvokedWithResult: (didPop, _) {
        if (!didPop) _confirmLeave(context);
      },
-      child: Scaffold(
-        body: BlocConsumer<GameBloc, GameUiState>(
-          listenWhen: (a, b) =>
-              (a.notice != b.notice && b.notice != null) ||
-              (a.gameOver == null && b.gameOver != null),
-          listener: (context, state) {
-            if (state.gameOver != null) {
-              final won = state.gameOver!.winnerTeam ==
-                  (state.state?.yourSeat ?? 0) % 2;
-              if (won) AppSounds.win();
-            }
-            if (state.notice != null) {
-              ScaffoldMessenger.of(context).showSnackBar(
-                SnackBar(
-                    content: Text(state.notice!),
-                    duration: const Duration(seconds: 2)),
-              );
-              context.read<GameBloc>().clearNotice();
-              // خطا پیش از شروعِ بازی (مثلاً سکه‌ی ناکافی) ⇒ کاربر در دیالوگِ
-              // «جستجوی حریف» گیر نکند؛ به لابی برگردد.
-              if (state.state == null && state.gameOver == null) {
-                _exitToLobby(context);
+      child: SafeArea(
+        top: false,
+        child: Scaffold(
+          body: BlocConsumer<GameBloc, GameUiState>(
+            listenWhen:
+                (a, b) =>
+                    (a.notice != b.notice && b.notice != null) ||
+                    (a.gameOver == null && b.gameOver != null),
+            listener: (context, state) {
+              if (state.gameOver != null) {
+                final won =
+                    state.gameOver!.winnerTeam ==
+                    (state.state?.yourSeat ?? 0) % 2;
+                if (won) AppSounds.win();
              }
-            }
-          },
-          builder: (context, state) {
-            if (state.state != null && _introTimer == null) {
-              // کمی «حریفان پیدا شد» نشان بده، بعد اوورلی را کنار بزن و همان
-              // لحظه انیمیشنِ بُر زدن (با صدا) را اجرا کن.
-              _introTimer = Timer(const Duration(milliseconds: 1000), () {
-                if (!mounted) return;
-                setState(() => _introHidden = true);
-                _game.endIntro();
-              });
-            }
-            return Stack(
-              children: [
-                GameWidget(game: _game),
-                _backButton(context),
-                if (state.connection == WsStatus.disconnected) _connBanner(),
-                if (_showSearch(state)) _searchPanel(state),
-                if (!_showSearch(state) && _showTrumpPicker(state))
-                  _trumpPicker(context),
-                if (state.handResult != null && state.gameOver == null)
-                  _handResult(state),
-                if (!_showSearch(state) && _isMyPlayTurn(state)) _turnBanner(),
-                if (state.gameOver != null) _gameOver(context, state),
-              ],
-            );
-          },
+              if (state.notice != null) {
+                ScaffoldMessenger.of(context).showSnackBar(
+                  SnackBar(
+                    content: Text(state.notice!),
+                    duration: const Duration(seconds: 2),
+                  ),
+                );
+                context.read<GameBloc>().clearNotice();
+                // خطا پیش از شروعِ بازی (مثلاً سکه‌ی ناکافی) ⇒ کاربر در دیالوگِ
+                // «جستجوی حریف» گیر نکند؛ به لابی برگردد.
+                if (state.state == null && state.gameOver == null) {
+                  _exitToLobby(context);
+                }
+              }
+            },
+            builder: (context, state) {
+              if (state.state != null && _introTimer == null) {
+                // کمی «حریفان پیدا شد» نشان بده، بعد اوورلی را کنار بزن و همان
+                // لحظه انیمیشنِ بُر زدن (با صدا) را اجرا کن.
+                _introTimer = Timer(const Duration(milliseconds: 1000), () {
+                  if (!mounted) return;
+                  setState(() => _introHidden = true);
+                  _game.endIntro();
+                });
+              }
+              return Stack(
+                children: [
+                  GameWidget(game: _game),
+                  _backButton(context),
+                  if (state.connection == WsStatus.disconnected) _connBanner(),
+                  if (_showSearch(state)) _searchPanel(state),
+                  if (!_showSearch(state) && _showTrumpPicker(state))
+                    _trumpPicker(context),
+                  if (state.handResult != null && state.gameOver == null)
+                    _handResult(state),
+                  if (!_showSearch(state) && _isMyPlayTurn(state))
+                    _turnBanner(),
+                  if (state.gameOver != null) _gameOver(context, state),
+                ],
+              );
+            },
+          ),
        ),
      ),
    );
@@ -114,24 +122,28 @@ class _GameScreenState extends State<GameScreen> {

  // بنرِ «نوبت شماست» وقتی کاربر باید کارت بیندازد.
  Widget _turnBanner() => Align(
-        alignment: const Alignment(0, 0.46),
-        child: IgnorePointer(
-          child: Container(
-            padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
-            decoration: BoxDecoration(
-              gradient: const LinearGradient(
-                  colors: [Color(0xFFE9B949), Color(0xFFB8860B)]),
-              borderRadius: BorderRadius.circular(20),
-              boxShadow: const [BoxShadow(color: Colors.black54, blurRadius: 8)],
-            ),
-            child: const Text('نوبت شماست',
-                style: TextStyle(
-                    color: Color(0xFF3A0A12),
-                    fontWeight: FontWeight.bold,
-                    fontSize: 16)),
+    alignment: const Alignment(0, 0.80),
+    child: IgnorePointer(
+      child: Container(
+        padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
+        decoration: BoxDecoration(
+          gradient: const LinearGradient(
+            colors: [Color(0xFFE9B949), Color(0xFFB8860B)],
+          ),
+          borderRadius: BorderRadius.circular(20),
+          boxShadow: const [BoxShadow(color: Colors.black54, blurRadius: 8)],
+        ),
+        child: const Text(
+          'نوبت شماست',
+          style: TextStyle(
+            color: Color(0xFF3A0A12),
+            fontWeight: FontWeight.bold,
+            fontSize: 16,
          ),
        ),
-      );
+      ),
+    ),
+  );

  bool _showTrumpPicker(GameUiState s) =>
      s.state != null &&
@@ -140,15 +152,15 @@ class _GameScreenState extends State<GameScreen> {
      s.gameOver == null;

  Widget _backButton(BuildContext context) => Positioned(
-        top: 8,
-        right: 8,
-        child: SafeArea(
-          child: IconButton(
-            icon: const Icon(Icons.arrow_back, color: AppColors.gold),
-            onPressed: () => _confirmLeave(context),
-          ),
-        ),
-      );
+    top: 8,
+    right: 8,
+    child: SafeArea(
+      child: IconButton(
+        icon: const Icon(Icons.arrow_back, color: AppColors.gold),
+        onPressed: () => _confirmLeave(context),
+      ),
+    ),
+  );

  Future<void> _confirmLeave(BuildContext context) async {
    if (context.read<GameBloc>().state.gameOver != null) {
@@ -157,19 +169,24 @@ class _GameScreenState extends State<GameScreen> {
    }
    final yes = await showDialog<bool>(
      context: context,
-      builder: (_) => AlertDialog(
-        backgroundColor: AppColors.panel,
-        title: const Text('خروج از میز'),
-        content: const Text('از میز خارج می‌شوید؟ ورودی بازگردانده نمی‌شود.'),
-        actions: [
-          TextButton(
-              onPressed: () => Navigator.pop(context, false),
-              child: const Text('ماندن')),
-          TextButton(
-              onPressed: () => Navigator.pop(context, true),
-              child: const Text('خروج')),
-        ],
-      ),
+      builder:
+          (_) => AlertDialog(
+            backgroundColor: AppColors.panel,
+            title: const Text('خروج از میز'),
+            content: const Text(
+              'از میز خارج می‌شوید؟ ورودی بازگردانده نمی‌شود.',
+            ),
+            actions: [
+              TextButton(
+                onPressed: () => Navigator.pop(context, false),
+                child: const Text('ماندن'),
+              ),
+              TextButton(
+                onPressed: () => Navigator.pop(context, true),
+                child: const Text('خروج'),
+              ),
+            ],
+          ),
    );
    if (yes == true && context.mounted) {
      context.read<GameBloc>().leave();
@@ -184,22 +201,24 @@ class _GameScreenState extends State<GameScreen> {
  }

  Widget _connBanner() => Positioned(
-        top: 0,
-        left: 0,
-        right: 0,
-        child: Material(
-          color: Colors.orange.shade900,
-          child: const SafeArea(
-            bottom: false,
-            child: Padding(
-              padding: EdgeInsets.all(8),
-              child: Text('ارتباط با سرور قطع شد، در حال تلاش برای اتصال مجدد…',
-                  textAlign: TextAlign.center,
-                  style: TextStyle(color: Colors.white)),
-            ),
+    top: 0,
+    left: 0,
+    right: 0,
+    child: Material(
+      color: Colors.orange.shade900,
+      child: const SafeArea(
+        bottom: false,
+        child: Padding(
+          padding: EdgeInsets.all(8),
+          child: Text(
+            'ارتباط با سرور قطع شد، در حال تلاش برای اتصال مجدد…',
+            textAlign: TextAlign.center,
+            style: TextStyle(color: Colors.white),
          ),
        ),
-      );
+      ),
+    ),
+  );

  Widget _searchPanel(GameUiState state) {
    final players = state.state?.players ?? const <GamePlayer>[];
@@ -226,11 +245,14 @@ class _GameScreenState extends State<GameScreen> {
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
-            const Text('جستجوی حریف',
-                style: TextStyle(
-                    color: AppColors.gold,
-                    fontSize: 22,
-                    fontWeight: FontWeight.bold)),
+            const Text(
+              'جستجوی حریف',
+              style: TextStyle(
+                color: AppColors.gold,
+                fontSize: 22,
+                fontWeight: FontWeight.bold,
+              ),
+            ),
            const SizedBox(height: 18),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
@@ -239,31 +261,11 @@ class _GameScreenState extends State<GameScreen> {
                  _searchSlot(at(seat), seat == mySeat),
              ],
            ),
-            const SizedBox(height: 18),
-            Container(
-              padding: const EdgeInsets.symmetric(horizontal: 18, vertical: 8),
-              decoration: BoxDecoration(
-                color: AppColors.bgDark,
-                borderRadius: BorderRadius.circular(24),
-                border: Border.all(color: AppColors.goldDark),
-              ),
-              child: Row(mainAxisSize: MainAxisSize.min, children: [
-                const Icon(Icons.monetization_on, color: AppColors.gold),
-                const SizedBox(width: 8),
-                Text('${widget.prize}',
-                    style: const TextStyle(
-                        color: AppColors.gold,
-                        fontSize: 18,
-                        fontWeight: FontWeight.bold)),
-              ]),
-            ),
            if (searching) ...[
              const SizedBox(height: 16),
-              const SizedBox(
-                height: 22,
-                width: 22,
-                child: CircularProgressIndicator(
-                    strokeWidth: 2, color: AppColors.gold),
+              const Text(
+                'در حال یافتن حریفان…',
+                style: TextStyle(color: Colors.white70, fontSize: 13),
              ),
            ],
          ],
@@ -276,34 +278,52 @@ class _GameScreenState extends State<GameScreen> {
    final found = p != null;
    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 6),
-      child: Column(mainAxisSize: MainAxisSize.min, children: [
-        Text(found ? p.name : '...',
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Text(
+            found ? p.name : '...',
            maxLines: 1,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
-                color: isYou ? AppColors.gold : Colors.white70, fontSize: 12)),
-        const SizedBox(height: 4),
-        Container(
-          width: 58,
-          height: 58,
-          decoration: BoxDecoration(
-            color: AppColors.bgDark,
-            borderRadius: BorderRadius.circular(10),
-            border: Border.all(
-                color: isYou ? AppColors.gold : AppColors.goldDark, width: 1.5),
+              color: isYou ? AppColors.gold : Colors.white70,
+              fontSize: 12,
+            ),
          ),
-          child: Icon(
-            found
-                ? (p.bot ? Icons.smart_toy : Icons.person)
-                : Icons.help_outline,
-            color: found ? AppColors.gold : Colors.white24,
-            size: 30,
+          const SizedBox(height: 4),
+          Container(
+            width: 58,
+            height: 58,
+            padding: const EdgeInsets.all(3),
+            decoration: BoxDecoration(
+              color: AppColors.bgDark,
+              borderRadius: BorderRadius.circular(10),
+              border: Border.all(
+                color: isYou ? AppColors.gold : AppColors.goldDark,
+                width: 1.5,
+              ),
+            ),
+            child:
+                !found
+                    ? const _SearchingAvatar() // آواتارهای متغیر تا یافتنِ حریف
+                    : p.bot
+                    ? const Icon(
+                      Icons.smart_toy,
+                      color: AppColors.gold,
+                      size: 30,
+                    )
+                    : ClipRRect(
+                      borderRadius: BorderRadius.circular(8),
+                      child: RandomAvatar(p.name),
+                    ),
          ),
-        ),
-        const SizedBox(height: 2),
-        Text(found ? (p.bot ? 'ربات' : (isYou ? 'شما' : 'حریف')) : '',
-            style: const TextStyle(color: Colors.white38, fontSize: 10)),
-      ]),
+          const SizedBox(height: 2),
+          Text(
+            found ? (p.bot ? 'ربات' : (isYou ? 'شما' : 'حریف')) : '',
+            style: const TextStyle(color: Colors.white38, fontSize: 10),
+          ),
+        ],
+      ),
    );
  }

@@ -328,8 +348,10 @@ class _GameScreenState extends State<GameScreen> {
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
-            const Text('حکم را انتخاب کن',
-                style: TextStyle(color: AppColors.gold, fontSize: 20)),
+            const Text(
+              'حکم را انتخاب کن',
+              style: TextStyle(color: AppColors.gold, fontSize: 20),
+            ),
            const SizedBox(height: 16),
            Wrap(
              spacing: 12,
@@ -343,11 +365,17 @@ class _GameScreenState extends State<GameScreen> {
                      minimumSize: const Size(120, 64),
                    ),
                    onPressed: () => context.read<GameBloc>().chooseTrump(id),
-                    child: Row(mainAxisSize: MainAxisSize.min, children: [
-                      Text(sym, style: TextStyle(fontSize: 26, color: color)),
-                      const SizedBox(width: 8),
-                      Text(name, style: const TextStyle(color: AppColors.text)),
-                    ]),
+                    child: Row(
+                      mainAxisSize: MainAxisSize.min,
+                      children: [
+                        Text(sym, style: TextStyle(fontSize: 26, color: color)),
+                        const SizedBox(width: 8),
+                        Text(
+                          name,
+                          style: const TextStyle(color: AppColors.text),
+                        ),
+                      ],
+                    ),
                  ),
              ],
            ),
@@ -371,26 +399,34 @@ class _GameScreenState extends State<GameScreen> {
            borderRadius: BorderRadius.circular(16),
            border: Border.all(color: AppColors.gold),
          ),
-          child: Column(mainAxisSize: MainAxisSize.min, children: [
-            Text(won ? 'این دست را بردید!' : 'این دست را باختید',
+          child: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Text(
+                won ? 'این دست را بردید!' : 'این دست را باختید',
                style: TextStyle(
-                    color: won ? AppColors.green : Colors.redAccent,
-                    fontSize: 20,
-                    fontWeight: FontWeight.bold)),
-            if (r.kot)
-              Padding(
-                padding: const EdgeInsets.only(top: 6),
-                child: Text(
+                  color: won ? AppColors.green : Colors.redAccent,
+                  fontSize: 20,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+              if (r.kot)
+                Padding(
+                  padding: const EdgeInsets.only(top: 6),
+                  child: Text(
                    r.hakemKot
                        ? 'حاکم‌کُت! (${r.points} امتیاز)'
                        : 'کُت! (${r.points} امتیاز)',
-                    style: const TextStyle(color: AppColors.gold)),
-              ),
-            const SizedBox(height: 6),
-            Text(
+                    style: const TextStyle(color: AppColors.gold),
+                  ),
+                ),
+              const SizedBox(height: 6),
+              Text(
                'امتیاز: ${r.scores.isNotEmpty ? r.scores[0] : 0} - ${r.scores.length > 1 ? r.scores[1] : 0}',
-                style: const TextStyle(color: Colors.white70)),
-          ]),
+                style: const TextStyle(color: Colors.white70),
+              ),
+            ],
+          ),
        ),
      ),
    );
@@ -403,25 +439,67 @@ class _GameScreenState extends State<GameScreen> {
    return Container(
      color: Colors.black87,
      alignment: Alignment.center,
-      child: Column(mainAxisSize: MainAxisSize.min, children: [
-        Text(won ? 'بردید! 🎉' : 'باختید',
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Text(
+            won ? 'بردید! 🎉' : 'باختید',
            style: TextStyle(
-                color: won ? AppColors.gold : Colors.redAccent,
-                fontSize: 32,
-                fontWeight: FontWeight.bold)),
-        const SizedBox(height: 12),
-        Text(
-            'نتیجه نهایی: ${g.scores.isNotEmpty ? g.scores[0] : 0} - ${g.scores.length > 1 ? g.scores[1] : 0}',
-            style: const TextStyle(color: Colors.white70, fontSize: 18)),
-        const SizedBox(height: 28),
-        SizedBox(
-          width: 220,
-          child: ElevatedButton(
-            onPressed: () => _exitToLobby(context),
-            child: const Text('بازگشت به لابی'),
+              color: won ? AppColors.gold : Colors.redAccent,
+              fontSize: 32,
+              fontWeight: FontWeight.bold,
+            ),
          ),
-        ),
-      ]),
+          const SizedBox(height: 12),
+          Text(
+            'نتیجه نهایی: ${g.scores.isNotEmpty ? g.scores[0] : 0} - ${g.scores.length > 1 ? g.scores[1] : 0}',
+            style: const TextStyle(color: Colors.white70, fontSize: 18),
+          ),
+          const SizedBox(height: 28),
+          SizedBox(
+            width: 220,
+            child: ElevatedButton(
+              onPressed: () => _exitToLobby(context),
+              child: const Text('بازگشت به لابی'),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+/// آواتارِ در حالِ تغییر برای جایگاه‌های خالیِ پنل جستجو (حسِ «در حال یافتن»).
+class _SearchingAvatar extends StatefulWidget {
+  const _SearchingAvatar();
+
+  @override
+  State<_SearchingAvatar> createState() => _SearchingAvatarState();
+}
+
+class _SearchingAvatarState extends State<_SearchingAvatar> {
+  Timer? _timer;
+  int _i = 0;
+
+  @override
+  void initState() {
+    super.initState();
+    _timer = Timer.periodic(const Duration(milliseconds: 220), (_) {
+      if (mounted) setState(() => _i++);
+    });
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return ClipRRect(
+      borderRadius: BorderRadius.circular(8),
+      child: RandomAvatar('seek-${_i % 24}'),
    );
  }
 }