import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:yumi/app/constants/sc_screen.dart';
import 'package:yumi/ui_kit/widgets/room/cp/room_cp_relation_formed_effect.dart';

void main() {
  runApp(const RoomCpRelationFormedEffectPreviewApp());
}

class RoomCpRelationFormedEffectPreviewApp extends StatelessWidget {
  const RoomCpRelationFormedEffectPreviewApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      designSize: Size(SCScreen.designWidth, SCScreen.designHeight),
      splitScreenMode: false,
      minTextAdapt: true,
      builder: (context, child) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          builder: FlutterSmartDialog.init(),
          home: const RoomCpRelationFormedEffectPreviewPage(),
        );
      },
    );
  }
}

class RoomCpRelationFormedEffectPreviewPage extends StatefulWidget {
  const RoomCpRelationFormedEffectPreviewPage({super.key});

  @override
  State<RoomCpRelationFormedEffectPreviewPage> createState() =>
      _RoomCpRelationFormedEffectPreviewPageState();
}

class _RoomCpRelationFormedEffectPreviewPageState
    extends State<RoomCpRelationFormedEffectPreviewPage> {
  Timer? _loopTimer;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) => _showEffect());
    _loopTimer = Timer.periodic(
      const Duration(seconds: 7),
      (_) => _showEffect(),
    );
  }

  @override
  void dispose() {
    _loopTimer?.cancel();
    super.dispose();
  }

  void _showEffect() {
    RoomCpRelationFormedEffect.show(
      leftName: "Avery",
      rightName: "Jordan",
      leftAvatar: "https://i.pravatar.cc/180?img=32",
      rightAvatar: "https://i.pravatar.cc/180?img=47",
      relationType: "CP",
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFF170D24),
      body: Stack(
        children: [
          Positioned.fill(
            child: DecoratedBox(
              decoration: const BoxDecoration(
                gradient: LinearGradient(
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                  colors: [Color(0xFF2B163A), Color(0xFF07040D)],
                ),
              ),
            ),
          ),
          Positioned(
            left: 16,
            right: 16,
            bottom: 34,
            child: Row(
              children: [
                FilledButton(
                  onPressed: _showEffect,
                  child: const Text("Replay"),
                ),
                const SizedBox(width: 12),
                FilledButton.tonal(
                  onPressed:
                      () => SmartDialog.dismiss(
                        tag: RoomCpRelationFormedEffect.dialogTag,
                      ),
                  child: const Text("Dismiss"),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}