import 'dart:async';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:chat/data/UserData.dart';
import 'package:chat/data/chat_data_mgr.dart';
import 'package:chat/data/group_data_mgr.dart';
import 'package:chat/home/add_friend.dart';
import 'package:chat/home/group_announcement.dart';
import 'package:chat/home/group_manage_page.dart';
import 'package:chat/models/group_info_model.dart';
import 'package:chat/models/money_change.dart';
import 'package:chat/models/ref_name_provider.dart';
import 'package:chat/utils/MessageMgr.dart';
import 'package:chat/utils/group_member_model.dart';
import 'package:chat/utils/msgHandler.dart';
import 'package:chat/utils/screen.dart';
import 'package:chat/utils/sp_utils.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:oktoast/oktoast.dart';
import 'package:provider/provider.dart';

import '../../data/constants.dart';
import '../../generated/i18n.dart';
import '../../r.dart';
import '../../utils/CustomUI.dart';
import '../../utils/FullWithButton.dart';
import '../../utils/app_navigator.dart';
import '../create_group_view.dart';
import 'package:chat/utils/PopUpMenu.dart' as myPop;

class TranslationButlerPage extends StatefulWidget {
  final GroupInfoModel groupInfoModel;

  TranslationButlerPage({Key key, this.groupInfoModel}) : super(key: key);

  @override
  State<StatefulWidget> createState() {
    return TranslationButlerPageState();
  }
}

class TranslationButlerPageState extends State<TranslationButlerPage> {
  int curToLang = 1;
  int curSourceLang = UserData().language;
  List langList;

  @override
  void initState() {
    super.initState();

    initData();


    WidgetsBinding.instance.addPostFrameCallback((_) {
     Future.delayed(Duration(seconds: 4),(){
       CustomUI.buildTranslationHelperOrderDialog(context);
     });
    });
  }

  initData() async{
   String time= (await SPUtils.get(Constants.TranslationHelper));

   if(time!=null){
     print('time:$time');


     int second = int.parse(time)~/1000;
//     if(DateTime.now().millisecondsSinceEpoch~/1000-second>5*3600){ ///超过5小时清除缓存记录
//        SPUtils.save(Constants.TranslationHelper,null);
//       return;
//     }
     secondsPassed = ((DateTime.now().millisecondsSinceEpoch~/1000-second));
     apply();
   }else{
     print('time: null');
   }
  }

  apply(){
    isApply = false;

    timer = Timer.periodic(Duration(seconds: 1), (Timer t){
      handleTick();
    });
    setState(() {});
  }


  @override
  void didChangeDependencies() {
    super.didChangeDependencies();

    langList = [
      I18n.of(context).english,
      I18n.of(context).Vietnamese,
      I18n.of(context).traditional_Chinese,
      I18n.of(context).Simplified_Chinese,
      I18n.of(context).Korean,
      I18n.of(context).Japanese,
    ];



  }

  @override
  void dispose() {
//    MessageMgr().off('Update Group Info', updateGroupInfo);
  timer?.cancel();

  if(!isApply && timeStamp!=null){
    print('保存时间戳$timeStamp');
    SPUtils.save(Constants.TranslationHelper,timeStamp.toString());
  }

    super.dispose();
  }

  _langPopMenu(bool isSource) {
    var curIndex = isSource ? curSourceLang : curToLang;

    return myPop.PopupMenuButton(
        child: Container(
          constraints:
              BoxConstraints(minHeight: 41, minWidth: 115, maxWidth: 165),
          decoration: BoxDecoration(
              color: Color(0xffD3E7FF),
              borderRadius: BorderRadius.circular(10)),
          child: Row(
            children: <Widget>[
              Expanded(
                  child: Text(
                langList[curIndex],
                textAlign: TextAlign.center,
                textScaleFactor: 1.0,
                style: TextStyle(color: Color(0xff4A5E76), fontSize: 14),
              )),
              Icon(IconData(0xe63b, fontFamily: Constants.IconFontFamily),
                  size: 30, color: Color(0xff4A5E76))
            ],
          ),
        ),
        offset: Offset(0, 100),
        onSelected: (int index) {
          if (curIndex != index) {
            if (isSource) {
              curSourceLang = index;
            } else {
              curToLang = index;
            }
            print('更换翻译语言');
            setState(() {});
          }
        },
        itemBuilder: (BuildContext context) {
          return List<myPop.PopupMenuItem<int>>.generate(langList.length,
              (int i) {
            return myPop.PopupMenuItem(
              child: Container(
                alignment: Alignment.center,
                color: Colors.white,
                padding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
                child: Text(langList[i],
                    textScaleFactor: 1.0,
                    maxLines: 1,
                    style: TextStyle(
                        color: i == curIndex
                            ? Colors.blueAccent
                            : Color(AppColors.AppBarColor),
                        fontSize: 14)),
              ),
              value: i,
            );
          });
        });
  }

  @override
  Widget build(BuildContext context) {
    Widget appBar = AppBar(
      backgroundColor: AppColors.NewAppbarBgColor,
      title: Text(
        I18n.of(context).translation_butler,
        textScaleFactor: 1.0,
        style: TextStyle(color: AppColors.NewAppbarTextColor),
      ),
//      leading: CustomUI.buildCustomLeading(context),
      centerTitle: true,
      actions: <Widget>[
        Container(
          child: CustomUI.buildImageLabel(R.assetsImagesCoin,
              Provider.of<MoneyChangeProvider>(context).money,
              isLeft: true),
          decoration: BoxDecoration(borderRadius: BorderRadius.circular(15)),
        ),
        SizedBox(
          width: 10,
        )
      ],
    );

    return Scaffold(
      appBar: appBar,
      body: SafeArea(
        child: Container(
          color: Color(0xffE8EAF0),
          child: isApply ? applyPage() : waitPage(),
        ),
      ),
    );
  }

  Widget applyPage() {
    return ListView(
      children: <Widget>[
        Padding(
          padding: EdgeInsets.only(left: 20, right: 10, top: 15),
          child: Text(
            I18n.of(context).translation_butler_tips,
            textScaleFactor: 1.0,
            style: TextStyle(color: Color(0xffABABAB), fontSize: 13),
          ),
        ),
        Container(
          margin: EdgeInsets.all(10),
          child: Card(
            elevation: 5, // 阴影
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(10),
//              side: BorderSide(color: Colors.green,width: 25),
            ),
            child: Container(
              padding: EdgeInsets.all(10),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(bottom: 12),
                    child: Text(
                      I18n.of(context).choose_language,
                      textScaleFactor: 1.0,
                      textAlign: TextAlign.left,
                      style: TextStyle(
                          color: AppColors.NewAppbarTextColor, fontSize: 17),
                    ),
                  ),
                  Row(
                    children: <Widget>[
                      Image.asset(
                        R.assetsImagesImgTranslationIcon,
                        width: 195,
                        height: 175,
                      ),
                      Column(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          _langPopMenu(true),
                          SizedBox(height: 14),
                          InkWell(
                            onTap: () {
                              var temp = curSourceLang;
                              curSourceLang = curToLang;
                              curToLang = temp;
                              setState(() {});
                            },
                            child: RotatedBox(
                              quarterTurns: 1,
                              child: Container(
                                child: Icon(
                                  IconData(
                                    0xe669,
                                    fontFamily: Constants.IconFontFamily,
                                  ),
                                  size: 24,
                                  color: Color(0xff4A5E76),
                                ),
                                padding: EdgeInsets.symmetric(
                                    vertical: 5, horizontal: 5),
                              ),
                            ),
                          ),
                          SizedBox(height: 14),
                          _langPopMenu(false),
                        ],
                      ),
                    ],
                  ),
                  Padding(
                    padding: EdgeInsets.only(left: 10, right: 10, top: 15),
                    child: Text(
                      I18n.of(context).translation_butler_rules,
                      textScaleFactor: 1.0,
                      style: TextStyle(color: Color(0xffABABAB), fontSize: 13),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 70, right: 70, top: 50),
          height: 47,
          child: RaisedButton(
              color: Color(0xff3875E9),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.all(Radius.circular(10))),
              child: Text(
                I18n.of(context).translation_butler_call + ' (50h)',
                textScaleFactor: 1.0,
                style: TextStyle(color: Colors.white, fontSize: 19),
              ),
              onPressed:(){
                timeStamp = DateTime.now().millisecondsSinceEpoch;
                apply();
              } ),
        )
      ],
    );
  }




  Widget waitPage() {

    //  ～/ 取整操作
    int seconds = secondsPassed % 60;
    int minutes = secondsPassed ~/ 60;

    return ListView(
      children: <Widget>[
        ///当前排队人数过多。。。
        Container(
          margin: EdgeInsets.all(10),
          child: Card(
            elevation: 5, // 阴影
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(10),
//              side: BorderSide(color: Colors.green,width: 25),
            ),
            child: Container(
//                    width: double.maxFinite,
//                    color: Colors.blue,
              padding: EdgeInsets.fromLTRB(14, 14, 14, 22),
              child: Column(
                children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(bottom: 20, top: 10),
                    child: Text(
                      I18n.of(context).translation_butler_tips2,
                      textScaleFactor: 1.0,
                      textAlign: TextAlign.left,
                      style: TextStyle(color: Color(0xff797979), fontSize: 13),
                    ),
                  ),
                  Container(
                    width: double.maxFinite,
                    child: Row(
                      mainAxisSize: MainAxisSize.max,
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: <Widget>[
                        Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: <Widget>[
                            fixedText(
                                I18n.of(context).translation_butler_wait_people,
                                fontSize: 16,
                                color: Colors.black),
                            SizedBox(
                              height: 10,
                            ),
                            RichText(
                                maxLines: 3,
                                textAlign: TextAlign.center,
                                text: TextSpan(children: [
                                  TextSpan(
                                      text: '333',
                                      style: TextStyle(
                                          color: Color(0xffFF1010),
                                          fontSize: 27)),
                                  TextSpan(
                                      text: ' ' +
                                          I18n.of(context)
                                              .translation_butler_wait_people_unit,
                                      style: TextStyle(
                                          color: Colors.black, fontSize: 17)),
                                ]))
                          ],
                        ),
                        Container(
                          width: 1,
                          height: 65,
                          color: Color(0xffD8D8D8),
                        ),
                        Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: <Widget>[
                            fixedText(
                                I18n.of(context).translation_butler_wait_time,
                                fontSize: 16,
                                color: Colors.black),
                            SizedBox(
                              height: 10,
                            ),
                            RichText(
                                maxLines: 3,
                                textAlign: TextAlign.center,
                                text: TextSpan(children: [
                                  TextSpan(
                                      text: '666',
                                      style: TextStyle(
                                          color: Color(0xff3875E9),
                                          fontSize: 27)),
                                  TextSpan(
                                      text: ' ' + I18n.of(context).minute,
                                      style: TextStyle(
                                          color: Colors.black, fontSize: 17)),
                                ]))
                          ],
                        ),
                      ],
                    ),
                  )
                ],
              ),
            ),
          ),
        ),

        Padding(
          padding: EdgeInsets.only(left: 20, right: 10, top: 5,bottom: 10),
          child: Text(
            I18n.of(context).translation_butler_tips3,
            textScaleFactor: 1.0,
            style: TextStyle(color: Colors.black, fontSize: 18),
          ),
        ),

        Stack(alignment: Alignment.center,children: <Widget>[

          UnconstrainedBox(child: Container(
            //限制进度条的高度

            height: 190.0,
            //限制进度条的宽度
            width: 190.0,
            child:   CircularProgressIndicator(
              //0~1的浮点数，用来表示进度多少;如果 value 为 null 或空，则显示一个动画，否则显示一个定值
                value: null,
                strokeWidth: 5,
                //背景颜色
                backgroundColor: Color(0xffB2B2B2),
                //进度颜色
                valueColor:   AlwaysStoppedAnimation<Color>(Color(0xff3875E9))),
          ),),

          Column(children: <Widget>[
            Text(
              I18n.of(context).translation_butler_already_wait,
              textScaleFactor: 1.0,
              style: TextStyle(color: Colors.black, fontSize: 19),
            ),
            SizedBox(height: 10,),
            Text(
              getFull(minutes)+' : '+getFull(seconds) ,
              textScaleFactor: 1.0,
              style: TextStyle(color: Color(0xffFF1010), fontSize: 35),
            )
          ],)


        ],),


        Container(
          margin: EdgeInsets.only(left: 70, right: 70, top: 50),
          height: 47,
          child: RaisedButton(
              color: Color(0xff3875E9),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.all(Radius.circular(10))),
              child: Text(
                I18n.of(context).translation_butler_cancel,
                textScaleFactor: 1.0,
                style: TextStyle(color: Colors.white, fontSize: 19),
              ),
              onPressed: () async{
               await SPUtils.save(Constants.TranslationHelper,null);
                setState(() {
                  isApply = true;
                  timer?.cancel();
                  secondsPassed=0;

                });
              }),
        ),
        Container(
          margin: EdgeInsets.only(left: 70, right: 70, top: 25),
          height: 47,
          child: RaisedButton(
              color: Color(0xffB3B3B3),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.all(Radius.circular(10))),
              child: Text(
                I18n.of(context).translation_butler_wait_service,
                textScaleFactor: 1.0,
                style: TextStyle(color: Colors.white, fontSize: 19),
              ),
              onPressed: () {}),
        )
      ],
    );
  }

  bool isApply = true;
  int secondsPassed = 1;
  int timeStamp;
  Timer timer;
  void handleTick() {
//    if (isActive) {
      setState(() {
        secondsPassed = secondsPassed + 1; //需要更新UI
      });
//    }
  }


  getFull(int sec){
    return sec<10?'0$sec':'$sec';
  }

}