import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:novyronst/common/help/app_nav.dart';
import 'package:novyronst/common/help/help_image.dart';
import 'package:novyronst/common/model/ny_drama_model.dart';
import 'package:novyronst/pages/first/player_detail/video_detail_page.dart';
import 'package:novyronst/pages/widgets/ny_tag_widget.dart';
import 'package:novyronst/tools/widgets/novy_com_widget.dart';

import '../../../tools/util/app_screen.dart';
import '../../../tools/widgets/novy_button_bg.dart';
import '../../widgets/cut_corner_clipper.dart';
import 'home_remaining_sections.dart';

class HomeCardWidget extends StatelessWidget {
  const HomeCardWidget({
    super.key,
    required this.dramaList,
    required this.title,
  });

  final List<NyDramaModel> dramaList;
  final String title;

  @override
  Widget build(BuildContext context) {
    return CutCornerClipper(
      width: AppScreen.screenWidth - 32,
      height: 308.h,
      cutCorner: CutCorner.topRight,
      cutSize: 30,
      child: Padding(
        padding: EdgeInsets.only(left: 8, right: 8, bottom: 8),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _threeLine(),
            SizedBox(height: 10.h),
            OutlinedTitle(title, fontSize: 17.w),
            SizedBox(height: 10.h),
            Expanded(child: _listView()),
            SizedBox(height: 6.h),
            NovyButtonBg(text: 'Click to watch', width: 327.w),
          ],
        ),
      ),
    );
  }

  Widget _listView() {
    return ListView.builder(
      scrollDirection: Axis.horizontal,
      itemCount: dramaList.length,
      itemBuilder: (context, index) {
        final drama = dramaList[index];
        var tag = '';
        if (drama.category != null && drama.category!.isNotEmpty) {
          tag = drama.category!.first;
        }

        return GestureDetector(
          behavior: HitTestBehavior.opaque,
          onTap: () => AppNav.to(VideoDetailPage(drama: drama)),
          child: Container(
            margin: const EdgeInsets.only(right: 7),
            width: 104.w,
            child: Column(
              children: [
                HelpImage.network(drama.imageUrl, width: 104.w, height: 157.h),
                SizedBox(height: 4.h),
                NovyText(
                  drama.name,
                  fontSize: 12.sp,
                  color: Colors.black,
                  maxLines: 2,
                ),
                SizedBox(height: 1.5.h),
                if (tag != '') Row(children: [NyTagWidget(text: tag)]),
              ],
            ),
          ),
        );
      },
    );
  }

  Widget _threeLine() {
    return Row(
      children: List.generate(3, (index) {
        return Container(
          width: 3,
          height: 8,
          color: Colors.black,
          margin: const EdgeInsets.only(right: 3),
        );
      }),
    );
  }
}