// ignore_for_file: deprecated_member_use_from_same_package

import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:hoshan/core/gen/assets.gen.dart';
import 'package:hoshan/data/model/on_boarding_slider.dart';
import 'package:hoshan/data/storage/shared_preferences_helper.dart';
import 'package:hoshan/ui/theme/colors.dart';
import 'package:hoshan/ui/theme/cubit/theme_mode_cubit.dart';
import 'package:hoshan/ui/theme/responsive.dart';
import 'package:hoshan/ui/theme/text.dart';
import 'package:hoshan/ui/widgets/components/slider/custom_carousel_controller.dart';
import 'package:smooth_page_indicator/smooth_page_indicator.dart';

class OnBoardingPage extends StatefulWidget {
  final Function()? onFinish;
  const OnBoardingPage({super.key, this.onFinish});

  @override
  State<OnBoardingPage> createState() => _OnBoardingPageState();
}

class _OnBoardingPageState extends State<OnBoardingPage> {
  final CustomCarouselController _buttonCarouselController =
      CustomCarouselController();
  final ValueNotifier<bool> isEnd = ValueNotifier(false);

  final List<OnBoardingSlider> sliders = [
    OnBoardingSlider(
        id: 0,
        image: Assets.image.boardings.eins,
        title: 'تصور کن یه مشاور همه چیزدان و حرفه‌ای، 24 ساعته در کنارته. ',
        description:
            'امتحانش کن، هر سوالی داری ازش بپرس. هوشان دستیار هوش مصنوعی شماست و قراره بهت در هر زمینه‌ای کمک کنه. از فلسفه تا آشپزی، از کسب‌وکار تا تکنولوژی، از روانشناسی تا سلامت.'),
    OnBoardingSlider(
        id: 1,
        image: Assets.image.boardings.zwei,
        title: 'دستیار شخصی خودت رو بساز. ',
        description:
            'می‌خوای یه همراه هوشمند داشته باشی که دقیقاً مطابق نیازهای تو باشه؟ هوشان بهت کمک می‌کنه تا یه دستیار اختصاصی طراحی کنی. حتی می‌تونی دستیارهاتو با دیگران به اشتراک بزاری.'),
    OnBoardingSlider(
        id: 2,
        image: Assets.image.boardings.drei,
        title: 'با چند کلمه، دنیایی از تصاویر شگفت‌انگیز بساز. ',
        description:
            'ایده‌ای در ذهنت داری؟ یک توصیف ساده ازش بنویس تا هوشان اون را به تصویری زیبا و حیرت‌انگیز تبدیل کنه. از مناظر خیالی تا پرتره‌های هنری، از سبک‌های کلاسیک تا انیمه، همه چیز ممکنه.'),
    OnBoardingSlider(
        id: 3,
        image: Assets.image.boardings.vier,
        title: 'دوست داری موزیک‌های خودت رو بسازی؟',
        description:
            '، این کار شدنی و خیلی راحته؛ با هوشان آهنگ‌های منحصربه‌فرد خودت رو خلق کن! از ملودی‌های آرام و احساسی تا بیت‌های پرانرژی و هیجان‌انگیز، هوشان بهت کمک می‌کنه تا رویاهای موسیقیایی‌ات رو به واقعیت تبدیل کنی.'),
    OnBoardingSlider(
        id: 4,
        image: Assets.image.boardings.funf,
        title: 'ذهن خلاق تو، فیلم بعدی رو می‌سازه. ',
        description:
            'ایده‌ای در ذهنت داری؟ یک سناریوی جذاب بنویس و خیلی ساده برای هوشان توضیحش بده تا اون را به ویدیویی شگفت‌انگیز تبدیل کنه. از فیلم‌های علمی-تخیلی تا درام‌های احساسی، فیلم هر داستانی که تصور کنی رو می‌تونی بسازی.'),
    OnBoardingSlider(
        id: 5,
        image: Assets.image.boardings.sechs,
        title: 'دلت می‌خواد پای صحبت بزرگون بشینی؟ ',
        description:
            'تصور کن که می‌تونستی با نابغه‌ها، فیلسوف‌ها، دانشمندا و رهبران بزرگ دنیا چت کنی. از سقراط تا استیو جابز، از مولانا تا انیشتین یا هر آدم خفن دیگه‌ای. ازش چی می‌پرسیدی؟')
    // OnBoardingSlider(
    //     id: 2,
    //     image: Assets.image.boardings.board3,
    //     title:
    //         'در بخش گفتگوی هوشان می‌توانید در مورد هر چیزی از نوشتن پرامپت تا ایده‌های نو در حوزه هوش مصنوعی با دیگران گفتگو کنید'),
  ];

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final CarouselOptions carouselOptions = CarouselOptions(
      viewportFraction: 1,
      initialPage: 0,
      disableCenter: true,
      enableInfiniteScroll: false,
      reverse: false,
      autoPlay: Responsive(context).isMobile() ? false : true,
      autoPlayCurve: Curves.fastOutSlowIn,
      enlargeCenterPage: true,
      enlargeFactor: 0.5,
      onPageChanged: (index, _) {},
      scrollDirection: Axis.horizontal,
      height: MediaQuery.sizeOf(context).height,
    );
    return Scaffold(
      body: Column(
        children: [
          Expanded(
            child: Padding(
              padding: const EdgeInsets.all(16.0),
              child: Stack(
                children: [
                  CarouselSlider.builder(
                      carouselController: _buttonCarouselController,
                      itemCount: sliders.length,
                      itemBuilder: (context, index, realIndex) {
                        return sliderView(index);
                      },
                      options: carouselOptions),
                  Positioned.fill(
                      child: Container(
                    alignment: const Alignment(0, 0.35),
                    child: sliderIndicator(),
                  ))
                ],
              ),
            ),
          ),
          if (Responsive(context).isMobile())
            Padding(
              padding: const EdgeInsets.fromLTRB(16, 0, 16, 32),
              child: ValueListenableBuilder<bool>(
                valueListenable: isEnd,
                builder: (context, value, child) {
                  return Row(
                    children: [
                      if (!value)
                        Row(
                          children: [
                            ElevatedButton(
                                onPressed: () {
                                  widget.onFinish?.call();
                                },
                                style: ElevatedButton.styleFrom(
                                    backgroundColor: AppColors.gray[
                                        context.read<ThemeModeCubit>().isDark()
                                            ? 900
                                            : 400],
                                    elevation: 0),
                                child: Text('انصراف',
                                    style: AppTextStyles.body4
                                        .copyWith(color: Colors.white))),
                            const SizedBox(
                              width: 8,
                            ),
                          ],
                        ),
                      Expanded(
                        child: ElevatedButton(
                            onPressed: () async {
                              if (value) {
                                await OnBoardingStorage.setAsSeen();
                                widget.onFinish?.call();
                                return;
                              }
                              _buttonCarouselController.nextPage();
                            },
                            style: ElevatedButton.styleFrom(
                                backgroundColor:
                                    AppColors.secondryColor.defaultShade),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Text(
                                  value ? 'بزن بریم' : 'بعدی',
                                  style: AppTextStyles.body4
                                      .copyWith(color: Colors.white),
                                ),
                                Assets.icon.outline.arrowRight
                                    .svg(color: Colors.white)
                              ],
                            )),
                      ),
                    ],
                  );
                },
              ),
            )
        ],
      ),
    );
  }

  Widget sliderIndicator() {
    return FutureBuilder(
        future: _buttonCarouselController.onReady,
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            _buttonCarouselController.state!.pageController!.addListener(() {
              if (_buttonCarouselController.state!.pageController!.page! >
                  (sliders.length - 1.5)) {
                isEnd.value = true;
              } else {
                isEnd.value = false;
              }
            });
            return SmoothPageIndicator(
                controller: _buttonCarouselController.state!.pageController!,
                count: sliders.length,
                effect: ExpandingDotsEffect(
                    dotWidth: 8,
                    dotHeight: 8,
                    activeDotColor: AppColors.secondryColor.defaultShade,
                    dotColor: AppColors.secondryColor[300]));
          }
          return const SizedBox();
        });
  }

  Widget sliderView(int index) {
    return Padding(
      padding: EdgeInsets.symmetric(
          vertical: Responsive(context).isDesktop() ? 64 : 46.0),
      child:
          Column(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
        Flexible(
          flex: 2,
          child: sliders[index]
              .image
              .image(width: double.infinity, height: double.infinity),
        ),
        Flexible(
          child: Column(
            children: [
              const SizedBox(
                height: 48,
              ),
              Flexible(
                child: Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 8.0),
                  child: Text.rich(
                    TextSpan(
                        text: sliders[index].title,
                        children: [
                          TextSpan(
                              text: sliders[index].description,
                              style: AppTextStyles.body3.copyWith(
                                  color:
                                      Theme.of(context).colorScheme.onSurface))
                        ],
                        style: AppTextStyles.body3.copyWith(
                            color: Theme.of(context).colorScheme.onSurface,
                            fontWeight: FontWeight.bold)),
                    textAlign: TextAlign.justify,
                    textDirection: TextDirection.rtl,
                    // overflow: TextOverflow.ellipsis,
                    // softWrap: true,
                  ),
                ),
              )
            ],
          ),
        )
      ]),
    );
  }
}