import 'dart:async';

import 'package:flutter/material.dart';
import 'package:pmu/domain/card.dart';

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

const double NORMAL_ICON_SCALE = 2.0;
const double SCALED_ICON_SCALE = 2.5;

class CardPost extends StatefulWidget {
  final String description;
  final String? imageUrl;
  final bool isLiked;
  final String name;

  final OnLikeCallback onLike;
  final VoidCallback? onTap;

  const CardPost(this.name, this.description, this.imageUrl, this.isLiked,
      this.onLike, this.onTap);

  factory CardPost.fromData(CardPostData data,
          {OnLikeCallback onLike, VoidCallback? onTap}) =>
      CardPost(data.name, data.description, data.imageUrl, data.isLiked, onLike,
          onTap);

  @override
  State<CardPost> createState() => _CardPostState();
}

class _CardPostState extends State<CardPost> {
  bool isLiked = false;

  double iconScale = NORMAL_ICON_SCALE;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
        onTap: widget.onTap,
        child: Container(
          margin: const EdgeInsets.all(10),
          padding: const EdgeInsets.all(10),
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10),
            color: Colors.blue,
            border: Border.all(
              color: Colors.blue,
              width: 0.5,
            ),
            boxShadow: const [
              BoxShadow(
                color: Colors.black12,
                offset: Offset(
                  0.0,
                  5.0,
                ),
                blurRadius: 4.0,
                spreadRadius: 1.0,
              ),
            ],
          ),
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Flexible(
                    child: Text(
                      widget.name,
                      style: const TextStyle(
                        color: Colors.white,
                        fontSize: 30,
                      ),
                    ),
                  ),
                ],
              ),
              Padding(
                padding: const EdgeInsets.only(top: 6.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Flexible(
                      child: Text(
                        widget.description,
                        textAlign: TextAlign.center,
                        style: const TextStyle(
                          color: Colors.white,
                          fontSize: 24,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              if (widget.imageUrl != null)
                Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Image.network(widget.imageUrl!,
                      height: 500,
                      width: double.infinity,
                      fit: BoxFit.fitWidth),
                ),
              Padding(
                padding: const EdgeInsets.all(4.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    GestureDetector(
                      onTap: () => {
                        setState(() {
                          isLiked = !isLiked;
                          iconScale = SCALED_ICON_SCALE;

                          Timer(const Duration(milliseconds: 110), () {
                            setState(() {
                              iconScale = NORMAL_ICON_SCALE;
                            });
                          });
                          widget.onLike?.call(widget.name, isLiked);
                        })
                      },
                      child: AnimatedScale(
                          scale: iconScale,
                          duration: const Duration(milliseconds: 250),
                          child: AnimatedSwitcher(
                              duration: const Duration(milliseconds: 250),
                              child: isLiked
                                  ? const Icon(
                                      Icons.favorite,
                                      color: Colors.red,
                                      key: ValueKey(1),
                                    )
                                  : const Icon(Icons.favorite_border,
                                      color: Colors.black, key: ValueKey(1)))),
                    ),
                  ],
                ),
              )
            ],
          ),
        ));
  }
}