import 'package:farm_tpf/presentation/screens/plot/sc_plot.dart';
import 'package:farm_tpf/utils/const_color.dart';
import 'package:farm_tpf/utils/const_string.dart';
import 'package:flutter/material.dart';

class PlotActionScreen extends StatefulWidget {
  @override
  _PlotActionScreenState createState() => _PlotActionScreenState();
}

class _PlotActionScreenState extends State<PlotActionScreen> {
  List<ActionType> actions = new List<ActionType>();
  ScrollController _scrollController;

  @override
  void initState() {
    super.initState();
    _scrollController = ScrollController()..addListener(() => setState(() {}));
    _initActionButtons();
  }

  _initActionButtons() {
    actions.add(ActionType(plot_action_nursery, null, PlotListScreen()));
    actions.add(ActionType(plot_action_plant, null, null));
    actions.add(ActionType(plot_action_crop_status, null, null));
    actions.add(ActionType(plot_action_environment_update, null, null));
    actions.add(ActionType(plot_action_dung, null, null));
    actions.add(ActionType(plot_action_spraying, null, null));
    actions.add(ActionType(plot_action_disease, null, null));
    actions.add(ActionType(plot_action_use_water, null, null));
    actions.add(ActionType(plot_action_other, null, null));
    actions.add(ActionType(plot_action_harvest, null, null));
    actions.add(ActionType(plot_action_finish, null, null));
  }

  Widget _createActionButtons(ActionType actionType) {
    return GestureDetector(
        onTap: () {
          Navigator.of(context).push(
              MaterialPageRoute(builder: (context) => actionType.listScreen));
        },
        child: Container(
          height: 75,
          margin: EdgeInsets.all(4.0),
          padding: EdgeInsets.all(0.0),
          decoration: BoxDecoration(
            color: COLOR_CONST.WHITE,
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(8.0),
                bottomLeft: Radius.circular(8.0),
                bottomRight: Radius.circular(8.0),
                topRight: Radius.circular(8.0)),
            boxShadow: <BoxShadow>[
              BoxShadow(
                  color: COLOR_CONST.GRAY1.withOpacity(0.2),
                  offset: Offset(1.1, 1.1),
                  blurRadius: 10.0),
            ],
          ),
          child: Stack(
            children: <Widget>[
              Positioned(
                  top: -10,
                  right: -3,
                  child: (actionType.addScreen == null)
                      ? Container()
                      : IconButton(
                          icon: Icon(
                            Icons.add_circle,
                            size: 40,
                            color: Colors.green,
                          ),
                          onPressed: () {
                            Navigator.of(context).push(MaterialPageRoute(
                                builder: (context) => actionType.addScreen));
                          })),
              Positioned.fill(
                child: Align(
                    alignment: Alignment.center,
                    child: Text(
                      actionType.actionName,
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        fontWeight: FontWeight.w400,
                        fontSize: 13,
                        color: COLOR_CONST.BLACK2,
                      ),
                    )),
              ),
            ],
          ),
        ));
  }

  bool _showTitle(BuildContext context) {
    var kExpandedHeight = MediaQuery.of(context).size.width * 1.125 + 32;
    return _scrollController.hasClients &&
        _scrollController.offset > kExpandedHeight - kToolbarHeight;
  }

  @override
  Widget build(BuildContext context) {
    return NestedScrollView(
      controller: _scrollController,
      headerSliverBuilder: (context, innerBoxScrolled) => [
        SliverAppBar(
          floating: false,
          pinned: true,
          backgroundColor: Colors.white,
          leading: Container(),
          title: _showTitle(context) ? Text(plot_detail_title) : null,
          //Height flexibleSpace : WidthScreen /2 * 6/16 * 6(row) + 8(space) *4
          expandedHeight: MediaQuery.of(context).size.width * 1.125 + 32,
          flexibleSpace: _showTitle(context)
              ? null
              : FlexibleSpaceBar(
                  centerTitle: true,
                  title: GridView.count(
                      shrinkWrap: true,
                      crossAxisCount: 2,
                      childAspectRatio: 16 / 6,
                      children: actions.map(
                        (item) {
                          return _createActionButtons(item);
                        },
                      ).toList()),
                ),
        ),
        SliverList(
            delegate: SliverChildListDelegate([
          Container(
              alignment: Alignment.center,
              child: _showTitle(context)
                  ? Text("")
                  : Text(
                      plot_detail_title,
                      style: TextStyle(
                          fontSize: 20, fontWeight: FontWeight.normal),
                    ))
        ]))
      ],
      body: RefreshIndicator(
        backgroundColor: Colors.white,
        onRefresh: () async {},
        child: ListView.builder(
          itemBuilder: (context, index) => ListTile(title: Text("Text $index")),
          itemCount: 20,
        ),
      ),
    );
  }
}

class ActionType {
  Widget addScreen;
  Widget listScreen;
  String actionName;
  ActionType(String actionName, Widget addScreen, Widget listScreen) {
    this.actionName = actionName;
    this.addScreen = addScreen;
    this.listScreen = listScreen;
  }
}