import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:sefer_driver/constant/box_name.dart';
import 'controller/home/splash_screen_controlle.dart';
import 'main.dart';

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

  @override
  Widget build(BuildContext context) {
    final SplashScreenController splashScreenController =
        Get.put(SplashScreenController());
    final textTheme = Theme.of(context).textTheme;
    final size = MediaQuery.of(context).size;

    // A modern, elegant color palette
    const Color primaryDark = Color(0xFF0D1B2A);
    const Color secondaryDark = Color(0xFF1B263B);
    const Color accentColor = Color(0xFF4ECDC4);
    const Color textColor = Colors.white;

    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [
              primaryDark,
              secondaryDark,
            ],
          ),
        ),
        child: Stack(
          children: [
            // Center-aligned animated content
            Center(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  // Logo with Scale and Fade animation
                  ScaleTransition(
                    scale: splashScreenController.animation,
                    child: FadeTransition(
                      opacity: splashScreenController.animation,
                      child: Container(
                        padding: const EdgeInsets.all(20),
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          color: Colors.white.withOpacity(0.95),
                          boxShadow: [
                            BoxShadow(
                              color: accentColor.withOpacity(0.2),
                              blurRadius: 25,
                              spreadRadius: 5,
                            ),
                          ],
                        ),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(100),
                          child: Image.asset(
                            'assets/images/logo.gif',
                            width: size.width * 0.3, // Responsive size
                            height: size.width * 0.3,
                          ),
                        ),
                      ),
                    ),
                  ),
                  const SizedBox(height: 30),
                  // App Name and Slogan with staggered animation
                  _AnimatedText(
                    text: 'Intaleq', // Your App Name
                    animation: splashScreenController.animation,
                    style: textTheme.headlineMedium?.copyWith(
                      color: textColor,
                      fontWeight: FontWeight.bold,
                      letterSpacing: 3,
                    ),
                    beginOffset: const Offset(0, 0.5),
                  ),
                  const SizedBox(height: 12),
                  _AnimatedText(
                    text: 'Your Journey Begins Here'.tr,
                    animation: splashScreenController.animation,
                    style: textTheme.titleMedium?.copyWith(
                      color: textColor.withOpacity(0.8),
                      fontWeight: FontWeight.w300,
                    ),
                    beginOffset: const Offset(0, 0.8),
                    startDelay: 0.2, // Start after the title
                  ),
                ],
              ),
            ),
            // Bottom Version Info and Progress Bar
            Align(
              alignment: Alignment.bottomCenter,
              child: Padding(
                padding: EdgeInsets.only(
                  bottom: size.height * 0.06,
                  left: 40,
                  right: 40,
                ),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    Obx(
                      () => ClipRRect(
                        borderRadius: BorderRadius.circular(10),
                        child: LinearProgressIndicator(
                          value: splashScreenController.progress.value,
                          backgroundColor: primaryDark.withOpacity(0.5),
                          valueColor:
                              const AlwaysStoppedAnimation<Color>(accentColor),
                          minHeight: 6,
                        ),
                      ),
                    ),
                    const SizedBox(height: 20),
                    GetBuilder<SplashScreenController>(
                      builder: (controller) => Text(
                        'Version: ${controller.packageInfo.isNotEmpty ? controller.packageInfo : '...'}',
                        style: textTheme.bodySmall?.copyWith(
                          color: textColor.withOpacity(0.5),
                          letterSpacing: 1,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

/// A helper widget for creating staggered text animations.
class _AnimatedText extends StatelessWidget {
  const _AnimatedText({
    required this.animation,
    required this.text,
    required this.style,
    required this.beginOffset,
    this.startDelay = 0.0,
  });

  final Animation<double> animation;
  final String text;
  final TextStyle? style;
  final Offset beginOffset;
  final double startDelay;

  @override
  Widget build(BuildContext context) {
    return FadeTransition(
      opacity: CurvedAnimation(
        parent: animation,
        curve: Interval(startDelay, 1.0, curve: Curves.easeOut),
      ),
      child: SlideTransition(
        position: Tween<Offset>(
          begin: beginOffset,
          end: Offset.zero,
        ).animate(CurvedAnimation(
          parent: animation,
          curve: Interval(startDelay, 1.0, curve: Curves.easeOut),
        )),
        child: Text(text, style: style),
      ),
    );
  }
}