import 'package:flutter/material.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:url_launcher/url_launcher.dart';

import 'package:anyway/structs/landmark.dart';

class LandmarkCard extends StatefulWidget {
  final Landmark landmark;
  
  LandmarkCard(this.landmark);
  
  @override
  _LandmarkCardState createState() => _LandmarkCardState();
}


class _LandmarkCardState extends State<LandmarkCard> {
  @override
  Widget build(BuildContext context) {
    ThemeData theme = Theme.of(context);
    return Container(
      height: 160,
      child: Card(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(15.0),
        ),
        elevation: 5,
        clipBehavior: Clip.antiAliasWithSaveLayer,
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Container( // the image on the left
              // inherit the height of the parent container
              height: double.infinity,
              // force a fixed width
              width: 160,
              child: CachedNetworkImage(
                imageUrl: widget.landmark.imageURL ?? '',
                placeholder: (context, url) => CircularProgressIndicator(),
                errorWidget: (context, error, stackTrace) => Icon(Icons.question_mark_outlined),
                // TODO: make this a switch statement to load a placeholder if null
                // cover the whole container meaning the image will be cropped
                fit: BoxFit.cover,
              ),
            ),
            Flexible(
              child: Padding(
                padding: EdgeInsets.all(10),
                child: Column(
                  children: [
                    Row(
                      children: [
                        Flexible(
                          child: Text(
                            widget.landmark.name,
                            style: const TextStyle(
                              fontSize: 18,
                              fontWeight: FontWeight.bold,
                            ),
                            maxLines: 2,
                          ),
                        )
                      ],
                    ),
                    if (widget.landmark.nameEN != null)
                      Row(
                        children: [
                          Flexible(
                            child: Text(
                              widget.landmark.nameEN!,
                              style: const TextStyle(
                                fontSize: 16,
                              ),
                              maxLines: 1,
                            ),
                          )
                        ],
                      ),
                    SingleChildScrollView(
                      // allows the buttons to be scrolled
                      scrollDirection: Axis.horizontal,
                      child: Wrap(
                        spacing: 10,
                        // show the type, the website, and the wikipedia link as buttons/labels in a row
                        children: [
                          TextButton.icon(
                            style: theme.iconButtonTheme.style,
                            onPressed: () {},
                            icon: widget.landmark.type.icon,
                            label: Text(widget.landmark.type.name),
                          ),
                          if (widget.landmark.duration != null && widget.landmark.duration!.inMinutes > 0)
                            TextButton.icon(
                              style: theme.iconButtonTheme.style,
                              onPressed: () {},
                              icon: Icon(Icons.hourglass_bottom),
                              label: Text('${widget.landmark.duration!.inMinutes} minutes'),
                            ),
                          if (widget.landmark.websiteURL != null)
                            TextButton.icon(
                              style: theme.iconButtonTheme.style,
                              onPressed: () async {
                                // open a browser with the website link
                                await launchUrl(Uri.parse(widget.landmark.websiteURL!));
                              },
                              icon: Icon(Icons.link),
                              label: Text('Website'),
                            ),
                          if (widget.landmark.wikipediaURL != null)
                            TextButton.icon(
                              style: theme.iconButtonTheme.style,
                              onPressed: () async {
                                // open a browser with the wikipedia link
                                await launchUrl(Uri.parse(widget.landmark.wikipediaURL!));
                              },
                              icon: Icon(Icons.book),
                            label: Text('Wikipedia'),
                          ),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
