import 'package:fcs/helpers/theme.dart';
import 'package:fcs/pages/widgets/progress.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_markdown/flutter_markdown.dart';
import '../../domain/vo/term.dart';
import '../main/util.dart';
import '../widgets/local_text.dart';

class TermEditor extends StatefulWidget {
  final Term term;
  const TermEditor({super.key, required this.term});

  @override
  State<TermEditor> createState() => _TermEditorState();
}

class _TermEditorState extends State<TermEditor> {
  int selectedIndex = 0;
  final List<bool> _selectedIcon = <bool>[true, false];
  List<Widget> icons = <Widget>[
    const Icon(Icons.edit),
    const Icon(Icons.preview_outlined),
  ];
  bool isEdit = true;
  TextEditingController mmController = TextEditingController();
  TextEditingController enController = TextEditingController();

  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    enController.text = widget.term.termEng ?? "";
    mmController.text = widget.term.termMm ?? "";
  }

  @override
  void dispose() {
    enController.dispose();
    mmController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final toggleBtn = ToggleButtons(
      direction: Axis.horizontal,
      onPressed: (int index) {
        setState(() {
          for (int i = 0; i < _selectedIcon.length; i++) {
            _selectedIcon[i] = !_selectedIcon[i];
            isEdit = (_selectedIcon[0] == true) ? true : false;
          }
        });
      },
      borderRadius: const BorderRadius.all(Radius.circular(5)),
      borderColor: primaryColor.withOpacity(0.3),
      selectedBorderColor: Colors.white,
      fillColor: primaryColor,
      color: primaryColor,
      isSelected: _selectedIcon,
      constraints: const BoxConstraints(minHeight: 20, minWidth: 40),
      children: icons,
    );

    final savebtn = Padding(
      padding: const EdgeInsets.symmetric(horizontal: 20),
      child: fcsButton(context, getLocalString(context, "btn.save"),
          callack: _save),
    );

    return LocalProgress(
      inAsyncCall: _isLoading,
      child: DefaultTabController(
        length: 2,
        initialIndex: selectedIndex,
        child: Scaffold(
          backgroundColor: Colors.white,
          appBar: AppBar(
            elevation: 0,
            centerTitle: true,
            leading: IconButton(
                splashRadius: 25,
                icon: const Icon(CupertinoIcons.back,
                    color: primaryColor, size: 25),
                onPressed: () => Navigator.pop(context)),
            shadowColor: Colors.transparent,
            backgroundColor: Colors.white,
            title:
                LocalText(context, 'term', fontSize: 20, color: primaryColor),
            bottom: TabBar.secondary(
                dividerColor: Colors.grey.shade400,
                indicatorColor: primaryColor,
                labelColor: primaryColor,
                labelStyle:
                    const TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                unselectedLabelColor: Colors.grey,
                unselectedLabelStyle:
                    const TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                onTap: (index) {
                  selectedIndex = index;
                },
                tabs: [Tab(text: "English"), Tab(text: "Myanmar")]),
            actions: [
              Padding(
                  padding: const EdgeInsets.only(right: 20), child: toggleBtn)
            ],
          ),
          body: SafeArea(
            child: ScrollConfiguration(
              behavior: const ScrollBehavior().copyWith(overscroll: false),
              child: ListView(
                children: [
                  SizedBox(
                    height: MediaQuery.of(context).size.height - 210,
                    child: TabBarView(
                      children: [
                        isEdit
                            ? Padding(
                                padding: const EdgeInsets.only(
                                    left: 15, right: 15, top: 20, bottom: 8),
                                child: TextField(
                                  autofocus: true,
                                  controller: enController,
                                  style: TextStyle(
                                      fontSize: 15, color: Colors.black87),
                                  decoration: const InputDecoration(
                                    border: InputBorder.none,
                                  ),
                                  cursorColor: primaryColor,
                                  keyboardType: TextInputType.multiline,
                                  maxLines: null,
                                  readOnly: isEdit ? false : true,
                                ),
                              )
                            : Padding(
                                padding:
                                    const EdgeInsets.only(top: 15, bottom: 15),
                                child: Markdown(
                                    shrinkWrap: true,
                                    softLineBreak: true,
                                    physics: const BouncingScrollPhysics(),
                                    data: enController.text
                                        .replaceAll("\\n", '\n'),
                                    styleSheet: MarkdownStyleSheet.fromTheme(
                                        ThemeData(
                                            textTheme: const TextTheme(
                                                bodyMedium: TextStyle(
                                                    fontSize: 15,
                                                    color: Colors.black87))))),
                              ),
                        isEdit
                            ? Padding(
                                padding: const EdgeInsets.only(
                                    left: 15, right: 15, top: 20, bottom: 8),
                                child: TextField(
                                  style: TextStyle(
                                      fontSize: 14, color: Colors.black87),
                                  autofocus: true,
                                  controller: mmController,
                                  decoration: const InputDecoration(
                                      border: InputBorder.none),
                                  cursorColor: primaryColor,
                                  keyboardType: TextInputType.multiline,
                                  maxLines: null,
                                  readOnly: isEdit ? false : true,
                                ),
                              )
                            : Padding(
                                padding:
                                    const EdgeInsets.only(top: 15, bottom: 15),
                                child: Markdown(
                                    shrinkWrap: true,
                                    softLineBreak: true,
                                    physics: const BouncingScrollPhysics(),
                                    data: mmController.text
                                        .replaceAll("\\n", '\n'),
                                    styleSheet: MarkdownStyleSheet.fromTheme(
                                        ThemeData(
                                            textTheme: const TextTheme(
                                                bodyMedium: TextStyle(
                                                    fontSize: 14,
                                                    color: Colors.black87))))),
                              ),
                      ],
                    ),
                  ),
                  savebtn,
                  const SizedBox(height: 20)
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  _save() async {
    setState(() {
      _isLoading = true;
    });
    try {
      // final contentsEng = jsonEncode(_controllerEng.document);
      // final contentsMm = jsonEncode(_controllerMm.document);
      // // print('contents => $contentsEng');
      // TermModel termModel = Provider.of<TermModel>(context, listen: false);
      // await termModel.saveTerm(Term(termEng: contentsEng, termMm: contentsMm));
    } catch (e) {
      showMsgDialog(context, "Error", e.toString());
    } finally {
      _isLoading = false;
      Navigator.pop(context);
    }
  }
}