import 'dart:async';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:google_restaurants/models/restaurant.dart';

class RestaurantListItem extends StatefulWidget {
  final Restaurant restaurant;
  final int index;

  RestaurantListItem({this.restaurant, this.index});

  @override
  _RestaurantListItemState createState() => _RestaurantListItemState();
}

class _RestaurantListItemState extends State<RestaurantListItem>
    with TickerProviderStateMixin {
  Animation<double> _opacity;
  Animation<Offset> _translation;
  AnimationController _animationController;
  Timer _timeout;

  void _onPressItem() {
    debugPrint("press item")
  }

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _animationController =
        AnimationController(vsync: this, duration: Duration(milliseconds: 500));
    final CurvedAnimation curvedAnimation = CurvedAnimation(
      curve: Curves.easeInOut,
      parent: _animationController,
    );
    _opacity = Tween(begin: 0.0, end: 1.0).animate(curvedAnimation);
    _translation = Tween(begin: Offset(1.0, 0.0), end: Offset.zero)
        .animate(curvedAnimation);
    _timeout = Timer(Duration(milliseconds: 70 * widget.index), () {
      _animationController.forward();
    });
  }

  @override
  void dispose() {
    // TODO: implement dispose
    _animationController.dispose();
    _timeout.cancel();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SlideTransition(
      position: _translation,
      child: FadeTransition(
        opacity: _opacity,
        child: GestureDetector(
          onTap: _onPressItem,
          child: Container(
            margin: EdgeInsets.symmetric(vertical: 10),
            padding: EdgeInsets.all(10),
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(8),
                boxShadow: [
                  BoxShadow(color: Color(0xFFc9d6df), offset: Offset(1, 0)),
                  BoxShadow(
                      color: Color(0xFFc9d6df),
                      offset: Offset(0, 3),
                      blurRadius: 3),
                  BoxShadow(color: Color(0xFFc9d6df), offset: Offset(-1, 0)),
                ]),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Text(
                  widget.restaurant.name,
                  style: TextStyle(fontWeight: FontWeight.bold),
                ),
                Container(
                  margin: const EdgeInsets.only(top: 4),
                  child: Text(widget.restaurant.address,
                      style: TextStyle(fontSize: 15)),
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}