import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:gap/gap.dart';
import 'package:get/get.dart';
import 'package:traderscircuit/Utils/Common/CommonAppbar.dart';
import 'package:traderscircuit/Utils/Common/CustomTextFormField.dart';
import 'package:traderscircuit/Utils/Common/comonGlassmorphicContainer.dart';
import 'package:traderscircuit/Utils/Common/sized_box.dart';
import 'package:traderscircuit/Utils/text.dart';
import 'package:traderscircuit/controller/content_bytes_controller.dart';
import 'package:traderscircuit/model/ContentBytesModel/content_bytes_model.dart';
import 'package:traderscircuit/resources/routes/route_name.dart';
import 'package:traderscircuit/view/Sidemenu/ContentByte/PlayerWidget.dart';
import 'package:traderscircuit/view/Sidemenu/ContentByte/read_pdf.dart';
import 'package:traderscircuit/view/onBoarding/splashScreen1.dart';
import 'package:traderscircuit/view_model/ContentBytesApi/content_bytes_api.dart';

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

  @override
  State<ReadMore> createState() => _VideosMoreState();
}

class _VideosMoreState extends State<ReadMore> {
  ContentBytesController contentBytesController =
      Get.put(ContentBytesController());
  var data;
  RxBool isLoading = false.obs;
  TextEditingController searchControllerr = TextEditingController();

  @override
  void initState() {
    ContentBytesApi().getContentBytesData("", "reads", "").then((value) {
      contentBytesController.contentBytesModel =
          ContentBytesModel.fromJson(value.data);
      contentBytesController.isApiCalling.value = false;
      setState(() {});
    });
    super.initState();
  }

  void handleSearch(String query, String category) async {
    await ContentBytesApi()
        .getContentBytesData(
            query, "reads", contentBytesController.filterId.toString())
        .then((value) {
      contentBytesController.contentBytesModel =
          ContentBytesModel.fromJson(value.data);
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: const CommonAppbar(
        titleTxt: "Read",
      ),
      backgroundColor: Colors.black,
      extendBody: true,
      body: Obx(
        () => Stack(
          children: [
            const CommonBlurLeft(),
            const CommonBlurRight(),
            isLoading.value
                ? const Center(
                    child: CircularProgressIndicator(
                      color: Color(0xFF9A0000),
                    ),
                  )
                : Stack(
                    children: [
                      Padding(
                        padding: const EdgeInsets.symmetric(
                            horizontal: 16, vertical: 16),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            text16W400_DADADA('The Beauty and Power of Audios'),
                            sizedBoxHeight(8.w),
                            Row(
                              children: [
                                SizedBox(
                                  width: 295.w,
                                  child: TextField(
                                    controller: searchControllerr,
                                    onChanged: (value) {
                                      // Call method to handle search
                                      handleSearch(value, "");
                                    },
                                    decoration: InputDecoration(
                                      prefixIcon: Icon(Icons.search),
                                      hintText: 'Search videos',
                                      border: OutlineInputBorder(),
                                    ),
                                  ),
                                ),
                                SizedBox(
                                  width: 12.w,
                                ),
                                filter(),
                              ],
                            ),
                            // SizedBox(
                            //   height: 10.h,
                            // ),

                            sizedBoxHeight(20.h),
                            ListView.builder(
                                itemCount: contentBytesController
                                    .contentBytesModel.data!.read!.length,
                                shrinkWrap: true,
                                physics: NeverScrollableScrollPhysics(),
                                itemBuilder: (ctx, index) {
                                  return Column(
                                    children: [
                                      InkWell(
                                        onTap: () {
                                          Get.to(ReadPDF(
                                            title: contentBytesController
                                                .contentBytesModel
                                                .data!
                                                .read![index]
                                                .title,
                                            pdfUrfl: contentBytesController
                                                .contentBytesModel
                                                .data!
                                                .read![index]
                                                .file,
                                          ));
                                        },
                                        child: commonGlassContainer(
                                          borderradius: 8,
                                          width: double.infinity,
                                          height: 150.h,
                                          customWidget: Row(
                                            mainAxisAlignment:
                                                MainAxisAlignment.spaceBetween,
                                            crossAxisAlignment:
                                                CrossAxisAlignment.end,
                                            children: [
                                              const SizedBox(
                                                width: 10,
                                              ),
                                              Column(
                                                crossAxisAlignment:
                                                    CrossAxisAlignment.start,
                                                children: [
                                                  const Spacer(),
                                                  SizedBox(
                                                    width: 235.w,
                                                    child: text20W400(
                                                        '"${contentBytesController.contentBytesModel.data!.read![index].title}"'),
                                                  ),
                                                  sizedBoxHeight(10.h),
                                                  SizedBox(
                                                    width: 230.w,
                                                    child: text16W400(
                                                        '"${contentBytesController.contentBytesModel.data!.read![index].description}"'),
                                                  ),
                                                  const Spacer()
                                                ],
                                              ),
                                              Column(
                                                mainAxisAlignment:
                                                    MainAxisAlignment.end,
                                                crossAxisAlignment:
                                                    CrossAxisAlignment.end,
                                                children: [
                                                  Image.network(
                                                    "${contentBytesController.contentBytesModel.data!.read![index].image}",
                                                    height: 110,
                                                  ),
                                                ],
                                              )
                                            ],
                                          ),
                                        ),
                                      ),
                                      sizedBoxHeight(20.h),
                                    ],
                                  );
                                }),
                          ],
                        ),
                      ),
                    ],
                  ),
          ],
        ),
      ),
    );
  }

  Widget filter() {
    return PopupMenuButton(
      icon: Image.asset(
        "assets/images/png/filter.png",
        height: 30.h,
        width: 30.w,
      ),
      color: const Color(0xFF191919),
      itemBuilder: (context) {
        return [
          PopupMenuItem(
              child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              SizedBox(
                height: (Get.height *
                        contentBytesController
                            .contentBytesCategoriesModel.data!.length) /
                    17,
                width: 150,
                child: ListView.builder(
                    padding: EdgeInsets.zero,
                    shrinkWrap: true,
                    itemCount: contentBytesController
                        .contentBytesCategoriesModel.data!.length,
                    itemBuilder: (ctx, index) {
                      return InkWell(
                          onTap: () {
                            //     contentBytesController.isApiCalling.value = true;
                            Get.back();
                            contentBytesController.filterId =
                                contentBytesController
                                    .contentBytesCategoriesModel
                                    .data![index]
                                    .id!;

                            log(contentBytesController.filterId.toString());
                            handleSearch(searchControllerr.text,
                                contentBytesController.filterId.toString());
                          },
                          child: itemFilter(index));
                    }),
              ),
            ],
          ))
        ];
      },
    );
  }

  Widget itemFilter(int index) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        const Gap(8),
        text18W400(
          contentBytesController
              .contentBytesCategoriesModel.data![index].categoryName!,
          texAl: TextAlign.center,
        ),
        index ==
                contentBytesController
                        .contentBytesCategoriesModel.data!.length -
                    1
            ? const SizedBox()
            : const Divider(
                color: Color(0xFF2C2C2C),
                thickness: 0.6,
                endIndent: 0,
              ),
      ],
    );
  }
}

Widget videoCard(Video video) {
  return InkWell(
    onTap: () {
      Get.to(() => const PlayerWidget(), arguments: {
        "video_url": video.file,
      });
    },
    child: commonGlassContainer(
        borderradius: 8,
        width: double.infinity,
        height: 320.h,
        customWidget: Padding(
          padding: EdgeInsets.symmetric(vertical: 10.h, horizontal: 10.w),
          child: Column(
            children: [
              Container(
                height: 200.h,
                width: double.infinity,
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(8.r),
                    image: DecorationImage(
                        image: NetworkImage(
                      video.image!,
                    ))),
                child: Center(
                  child: SvgPicture.asset(
                    'assets/images/svg/gridicons_play.svg',
                    height: 56.h,
                    width: 56.w,
                  ),
                ),
              ),
              sizedBoxHeight(20.h),
              Row(
                children: [
                  // CircleAvatar(
                  //   radius: 23.r,
                  //   backgroundImage: const AssetImage(
                  //       'assets/images/png/Ellipse 1494.png'),
                  // ),
                  sizedBoxWidth(10.w),
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      text18W500(video.title!),
                      text16W400(video.description!),
                      // sizedBoxHeight(10.h),
                      //text12W400_979797('20k views . 2 days ago'),
                      text12W400_979797('2 days ago'),
                    ],
                  )
                ],
              )
            ],
          ),
        )),
  );
}
