import 'dart:async';
import 'dart:convert';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutterappfuyou/code/base/YSBase.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

import '../../base/YSTools.dart';


class YSLiveUser extends StatefulWidget {
  const YSLiveUser({Key key}) : super(key: key);

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

class _YSLiveUserState extends State<YSLiveUser> {
  List _dataArray = [];
  static  WebSocket _socket;
  Timer _timer;
  RefreshController _refreshController = RefreshController(initialRefresh: false);
  int _totalNum = 0;
  @override
  void initState() {
    _getSocket();
    super.initState();
  }
  _getSocket() async{
    WebSocket.connect('wss://v2fy.niwoshenghuo.com/websocket').then((socket) {
      _socket = socket;
      socket.listen(_onData, cancelOnError: false);
      _timer =Timer.periodic(Duration(seconds: 50), (timer) {
        _socket.add('heartbeat');
      });
    }).catchError((e){
      LogUtil.d("Unable to connect: $e");
      _getSocket(); // 连接超时，重新建立连接
    });
  }

  _onData(event) async{
    Map dict = jsonDecode(event);
    LogUtil.d("---onData---$dict");
    if(dict['type']=='connection'){
      Map data = dict['data'];
      Map message = {};
      message['type'] = 'bind';
      message['live_stream'] = User().stream;
      message['uid'] = data['uid'];
      message['user'] = {'username':User().castName??User().name,'avatar':User().castAvatar??User().avatar,'is_owner':User().isAnchor};
      _socket.add(jsonEncode(message));
    }else if(dict['type']=='bind'){
      _socket.add(jsonEncode({'type':'staff'}));
    }else if(dict['type']=='staff'){
      Map data = dict['data'];
      _totalNum = data['total']??0;
      if(true){//data['current']==1
        _dataArray.clear();
        _dataArray = data['users']??[];
      }else{
        _dataArray.addAll(data['users']??[]);
      }
      setState(() {});
    }
  }
  @override
  void dispose() {
    _socket.close();
    if(_timer!=null){
      if(_timer.isActive)_timer.cancel();
    }
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return YSBase(
      ystitle: '学员列表',
      ysBgColor: Color(0xFFF0F0F1),
      yschild: SmartRefresher(
        onRefresh: _refreshData,
        onLoading: _loadMore,
        enablePullDown: _dataArray.length<=_totalNum,
        controller: _refreshController,
        header: ClassicHeader(
          height: 45.0,
          releaseText: '松开手刷新',
          refreshingText: '刷新中',
          completeText: '刷新完成',
          failedText: '刷新失败',
          idleText: '下拉刷新',
        ),
        footer: ClassicFooter(
          height: 45.0,
          canLoadingText: '没有更多数据了',
          noDataText: ' 无数据',
          loadingText: '加载中 ',
          failedText: '加载失败',
          idleText: '上拉加载',
        ),
        child: SingleChildScrollView(
          child: ListView.separated(
            itemBuilder: (context,index){
              Map item = _dataArray[index];
              return Container(
                color: Colors.white,
                padding: EdgeInsets.only(left: 20,right: 20,top: 10,bottom: 10),
                child: LayoutBuilder(
                  builder: (context,conSize){
                    return Row(
                      children: [
                        Container(
                          height: 35,
                          width: 35,
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.all(Radius.circular(50)),
                            color: Colors.pinkAccent,
                            image: DecorationImage(image: NetworkImage(item['avatar']),fit: BoxFit.cover)
                          ),
                        ),
                        Container(
                          width: conSize.maxWidth-35,
                          padding: EdgeInsets.only(left: 10,right: 10),
                          child: Text(item['username']??''),
                        )
                      ],
                    );
                  },
                ),
              );
            },
            separatorBuilder: (context,index){
              return Divider(height: 0.2,thickness: 0.2,color: Color(0xFFF0F0F1),);
            },
            itemCount: _dataArray.length,
            shrinkWrap: true,
            physics: NeverScrollableScrollPhysics(),
            padding: EdgeInsets.all(0),
          ),
        ),
      ),
    );
  }

  Future<void> _refreshData() async{
    // _page = 1;
    // _socket.add(jsonEncode({'type':'staff'}));
    // _refreshController.refreshCompleted();
  }

  Future<void> _loadMore() async{
    // _page++;
    // _socket.add(jsonEncode({'type':'staff'}));
    // _refreshController.loadComplete();
  }
}


class YSUsersAlertView extends StatelessWidget {
  final List users;
  const YSUsersAlertView({Key key, this.users}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: ysHeight(context)*0.6,
      width: ysWidth(context),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(topRight: Radius.circular(5),topLeft: Radius.circular(5))
      ),
      padding: EdgeInsets.only(left: 10,right: 10,bottom: 10),
      child: Column(
        children: [
          Container(
            height: 50,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Container(),
                Text('学员列表',style: TextStyle(fontSize: 16,color: Colors.black),),
                GestureDetector(
                  onTap: (){
                    Navigator.pop(context);
                  },
                  child: Icon(Icons.close,color: Colors.blue,),
                )
              ],
            ),
          ),
          Container(
            height: ysHeight(context)*0.6-60,
            child: ListView.separated(
              itemBuilder: (context,index){
                Map item = users[index];
                return Container(
                  color: Colors.white,
                  padding: EdgeInsets.only(top: 10,bottom: 10),
                  child: LayoutBuilder(
                    builder: (context,conSize){
                      return Row(
                        children: [
                          Container(
                            height: 35,
                            width: 35,
                            decoration: BoxDecoration(
                                borderRadius: BorderRadius.all(Radius.circular(50)),
                                color: Colors.pinkAccent,
                                image: DecorationImage(image: NetworkImage(item['avatar']),fit: BoxFit.cover)
                            ),
                          ),
                          Container(
                            width: conSize.maxWidth-35,
                            padding: EdgeInsets.only(left: 10,right: 10),
                            child: Text(item['username']??''),
                          )
                        ],
                      );
                    },
                  ),
                );
              },
              separatorBuilder: (context,index){
                return Divider(height: 0.2,thickness: 0.2,color: Color(0xFFF0F0F1),);
              },
              padding: EdgeInsets.all(0),
              itemCount: users.length,
            ),
          )
        ],
      ),
    );
  }
}
