import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../../core/app_router.dart';
import '../blocs/onboarding_bloc.dart';
import '../models/onboarding_model.dart';
import 'widgets/glass_card.dart';

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

  static final List<OnboardingModel> onboardingData = [
    OnboardingModel(
      image: 'assets/onboarding/bg.png',
      title: 'What we do',
      description:
          'Easily manage and promote your attractions while connecting with travelers and handling bookings in one place.',
    ),
    OnboardingModel(
      image: 'assets/onboarding/bg2.png',
      title: 'Manage Booking Seamlessly',
      description:
          'Track and manage all your bookings in real-time from one easy-to-use dashboard.',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: BlocConsumer<OnboardingBloc, OnboardingState>(
        listener: (context, state) {
          if (state is OnboardingNavigateToLogin) {
            Navigator.pushReplacementNamed(context, AppRouter.login);
          }
        },
        builder: (context, state) {
          final int currentIndex = _getCurrentIndex(state);
          final current = onboardingData[currentIndex];

          return Stack(
            fit: StackFit.expand,
            children: [
              // 🏙️ Smooth Background Transition
              AnimatedSwitcher(
                duration: const Duration(milliseconds: 600),
                transitionBuilder: (Widget child, Animation<double> animation) {
                  return FadeTransition(opacity: animation, child: child);
                },
                child: Image.asset(
                  current.image,
                  key: ValueKey(current.image),
                  fit: BoxFit.cover,
                  width: double.infinity,
                  height: double.infinity,
                ),
              ),

              // ⏭️ Skip Button (Conditional)
              if (current.title != "Manage Booking Seamlessly")
                SafeArea(
                  child: Padding(
                    padding: EdgeInsets.all(16.r),
                    child: Align(
                      alignment: Alignment.topRight,
                      child: OutlinedButton(
                        onPressed: () {
                          context.read<OnboardingBloc>().add(OnboardingSkipPressed());
                        },
                        style: OutlinedButton.styleFrom(
                          side: BorderSide(color: Colors.white, width: 2.w),
                          foregroundColor: Colors.white,
                          padding: EdgeInsets.symmetric(
                            horizontal: 34.w,
                            vertical: 10.h,
                          ),
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(16.r),
                          ),
                        ),
                        child: Text(
                          "Skip",
                          style: TextStyle(
                            fontSize: 14.sp,
                            fontWeight: FontWeight.w500,
                          ),
                        ),
                      ),
                    ),
                  ),
                ),

              // 🪟 Bottom Content Card with Smooth Switcher
              Align(
                alignment: Alignment.bottomCenter,
                child: Padding(
                  padding: EdgeInsets.all(16.r),
                  child: AnimatedSwitcher(
                    duration: const Duration(milliseconds: 500),
                    transitionBuilder: (Widget child, Animation<double> animation) {
                      return SlideTransition(
                        position: Tween<Offset>(
                          begin: const Offset(0, 0.1),
                          end: Offset.zero,
                        ).animate(animation),
                        child: FadeTransition(opacity: animation, child: child),
                      );
                    },
                    child: GlassCard(
                      key: ValueKey(currentIndex),
                      title: current.title,
                      description: current.description,
                      currentIndex: currentIndex,
                      total: onboardingData.length,
                      onContinue: () {
                        context
                            .read<OnboardingBloc>()
                            .add(OnboardingNextPressed(onboardingData.length));
                      },
                    ),
                  ),
                ),
              ),
            ],
          );
        },
      ),
    );
  }

  int _getCurrentIndex(OnboardingState state) {
    if (state is OnboardingInitial) return state.currentIndex;
    if (state is OnboardingUpdate) return state.currentIndex;
    return 0;
  }
}
