part of 'home_page.dart';

typedef OnLikeCallBack = void Function(String title, bool isLiked)?;

class _Card extends StatefulWidget {
  final String text;
  final String description;
  final String? imgUrl;
  final OnLikeCallBack onLike;
  final VoidCallback? onTap;

  const _Card(
      this.text, {
        required this.description,
        this.imgUrl,
        this.onLike,
        this.onTap,
      });

  factory _Card.fromData(CardDate data, {OnLikeCallBack onLike, VoidCallback? onTap}) => _Card(
    data.text,
    description: data.description,
    imgUrl: data.imgUrl,
    onLike: onLike,
    onTap: onTap,
  );

  @override
  State<_Card> createState() => _CardState();
}

class _CardState extends State<_Card> {
  bool isLiked = false;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: widget.onTap,
      child: Container(
        margin: const EdgeInsets.only(bottom: 20),
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(20),
            boxShadow: [
              BoxShadow(
                color: Colors.black.withOpacity(0.1),
                spreadRadius: 1,
                offset: const Offset(0, 0),
                blurRadius: 15,
              )
            ]),
        child: Column(
            children: [
              Stack(
                children: [
                  ClipRRect(
                    borderRadius: const BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20)),
                    child: Image.network(
                      widget.imgUrl ?? '',
                      errorBuilder: (_, __, ___) => const Placeholder(),
                      fit: BoxFit.fitWidth,
                    ),
                  ),
                  Align(
                    alignment: Alignment.topRight,
                    child: Container(
                      decoration: const BoxDecoration(
                        color: Colors.redAccent,
                        borderRadius: BorderRadius.only(topLeft: Radius.circular(20), topRight: Radius.circular(20),bottomRight: Radius.circular(0), bottomLeft: Radius.circular(20)),
                      ),
                      padding: const EdgeInsets.fromLTRB(20,8,20,8),
                      child: const Text(
                        'NEW',
                        style: TextStyle(
                          color: Color(0xff191919),
                          fontSize: 15,
                        ),
                      )
                      ,
                    )
                  )
                ]
              ),
              Padding(
                padding: const EdgeInsets.all(20),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: const EdgeInsets.only(bottom:10),
                      child: Text(
                        widget.text,
                        style: const TextStyle(
                          color: Color(0xff4c4c4c),
                          fontSize: 30,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    Text(
                      widget.description,
                      style: const TextStyle(
                        color: Color(0xff9c9c9c),
                        fontSize: 20,
                        fontWeight: FontWeight.normal,
                      ),
                    ),
                    Padding(
                        padding: const EdgeInsets.only(top:10),
                        child: GestureDetector(
                          onTap:(){
                            setState(() {
                              isLiked = !isLiked;
                            });
                            widget.onLike?.call(widget.text, isLiked);
                          },
                          child: AnimatedSwitcher(
                            duration: const Duration(milliseconds:  300),
                            child: isLiked
                                ? const Icon(Icons.favorite, color: Colors.redAccent,key: ValueKey<int>(0),)
                                : const Icon(Icons.favorite_border, key:ValueKey<int>(1),),
                          ),
                        )
                    )
                  ],
                ),
              ),
            ]),
      ),
    );
  }
}