import 'package:diplomaticquarterapp/core/viewModels/project_view_model.dart';
import 'package:diplomaticquarterapp/extensions/string_extensions.dart';
import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart';
import 'package:expandable/expandable.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

/// App Expandable Notifier with animation
/// [headerWidget]  widget want to show in the header
/// [bodyWidget]  widget want to show in the body
/// [title]  the widget title
/// [collapsed] The widget shown in the collapsed state
class AppExpandableNotifier extends StatefulWidget {
  final Widget headerWidget;
  final Widget bodyWidget;
  final String title;
  final Widget collapsed;
  final bool isExpand;
  bool expandFlag = false;
  var controller = new ExpandableController();
  bool isTitleSingleLine;

  AppExpandableNotifier({this.headerWidget, this.bodyWidget, this.title, this.collapsed, this.isExpand = false, this.isTitleSingleLine = true});

  _AppExpandableNotifier createState() => _AppExpandableNotifier();
}

class _AppExpandableNotifier extends State<AppExpandableNotifier> {
  ProjectViewModel projectViewModel;

  @override
  void initState() {
    setState(() {
      if (widget.isExpand) {
        widget.expandFlag = widget.isExpand;
        widget.controller.expanded = true;
      }
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    projectViewModel = Provider.of(context);

    String _mainTitle = (widget.title ?? TranslationBase.of(context).details).trim();
    String _title = _mainTitle.contains(" ") ? (projectViewModel.isArabic ? (_mainTitle.split(" ").length < 1 ? _mainTitle : _mainTitle.split(" ")[1]) : _mainTitle.split(" ")[0]) : _mainTitle;
    // String _title = _mainTitle.split(" ")[0];
    String _subTitle = _mainTitle.replaceAll(_title, "").trim();

    if (_subTitle.length < 1) {
      _subTitle = double.tryParse(_subTitle) != null ? _title : _title.toLowerCase().capitalizeFirstofEach;
      _title = "";
    } else {
      _subTitle = double.tryParse(_subTitle) == null ? _subTitle : _subTitle.toLowerCase().capitalizeFirstofEach;
      _title = double.tryParse(_subTitle) == null ? _title : _title.toLowerCase().capitalizeFirstofEach;
    }
    return ExpandableNotifier(
      child: Container(
        color: Colors.white,
        child: Column(
          children: <Widget>[
            SizedBox(
              child: widget.headerWidget,
            ),
            ScrollOnExpand(
              scrollOnExpand: true,
              scrollOnCollapse: false,
              child: ExpandablePanel(
                hasIcon: false,
                theme: const ExpandableThemeData(
                  headerAlignment: ExpandablePanelHeaderAlignment.center,
                  tapBodyToCollapse: true,
                ),
                header: Padding(
                  padding: const EdgeInsets.only(top: 20, bottom: 20, left: 21, right: 21),
                  child: InkWell(
                    onTap: () {
                      setState(() {
                        widget.expandFlag = !widget.expandFlag;
                        widget.controller.expanded = widget.expandFlag;
                      });
                    },
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Expanded(
                          child: Column(
                            mainAxisSize: MainAxisSize.min,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              if (_mainTitle.isNotEmpty && widget.isTitleSingleLine)
                                Text(
                                  _mainTitle,
                                  style: TextStyle(fontSize: 20, fontWeight: FontWeight.w600, color: Color(0xff2E303A), letterSpacing: -0.72, height: 1),
                                ),
                              if (_title.isNotEmpty && !widget.isTitleSingleLine)
                                Text(
                                  _title,
                                  maxLines: 1,
                                  style: TextStyle(fontSize: 24, fontWeight: FontWeight.w700, color: Color(0xff2E303A), letterSpacing: -1.44, height: 25 / 24),
                                ),
                              if (_subTitle.isNotEmpty && !widget.isTitleSingleLine)
                                Text(
                                  _subTitle,
                                  maxLines: 1,
                                  style: TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Color(0xff2E303A), letterSpacing: -0.72, height: 23 / 12),
                                ),
                            ],
                          ),
                        ),
                        Icon(
                          widget.expandFlag ? Icons.keyboard_arrow_up : Icons.keyboard_arrow_down,
                          color: Color(0xff2E303A),
                          //  size: 30.0,
                        ),
                      ],
                    ),
                  ),
                ),
                collapsed: widget.collapsed ?? Container(),
                expanded: widget.bodyWidget,
                builder: (_, collapsed, expanded) {
                  return Expandable(
                    controller: widget.controller,
                    collapsed: collapsed,
                    expanded: expanded,
                    theme: const ExpandableThemeData(crossFadePoint: 0),
                  );
                },
              ),
            ),
          ],
        ),
      ),
    );
  }
}