import 'dart:convert';
import 'dart:ui';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_webrtc/flutter_webrtc.dart';
import 'package:mohem_flutter_app/classes/colors.dart';
import 'package:mohem_flutter_app/extensions/int_extensions.dart';
import 'package:mohem_flutter_app/models/chat/call.dart';
import 'package:mohem_flutter_app/provider/chat_call_provider.dart';
import 'package:mohem_flutter_app/provider/chat_provider_model.dart';
import 'package:provider/provider.dart';

class OutGoingCall extends StatefulWidget {
  CallDataModel outGoingCallData;
  bool isVideoCall;

  OutGoingCall({Key? key, required this.outGoingCallData, required this.isVideoCall}) : super(key: key);

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

class _OutGoingCallState extends State<OutGoingCall> {
  late ChatCallProvider callProvider;
  late ChatProviderModel chatProvider;
  bool loader = true;

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

  Future<void> init() async {
    widget.isVideoCall ? callProvider.isVideoCall = true : callProvider.isVideoCall = false;
    callProvider.isOutGoingCall = true;
    await callProvider.initLocalCamera(chatProvmodel: chatProvider, callData: widget.outGoingCallData, context: context);
    loader = false;
  }

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

  @override
  Widget build(BuildContext context) {
    chatProvider = Provider.of<ChatProviderModel>(context, listen: false);
    callProvider = Provider.of<ChatCallProvider>(context, listen: false);
    init();
    return Scaffold(
      body: Consumer<ChatCallProvider>(builder: (BuildContext context, ChatCallProvider chatcp, Widget? child) {
        if (chatcp.isCallEnded) {
          Navigator.pop(context);
        }
        return loader
            ? const Center(
                child: CircularProgressIndicator(),
              )
            : Stack(
                alignment: FractionalOffset.center,
                children: <Widget>[
                  if (chatcp.isVideoCall)
                    Positioned.fill(
                      child: RTCVideoView(
                        chatcp.localVideoRenderer!,
                        objectFit: RTCVideoViewObjectFit.RTCVideoViewObjectFitCover,
                      ),
                    ),
                  Positioned.fill(
                    child: ClipRect(
                      child: BackdropFilter(
                        filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
                        child: Container(
                          decoration: BoxDecoration(
                            color: MyColors.grey57Color.withOpacity(
                              0.3,
                            ),
                          ),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            mainAxisSize: MainAxisSize.max,
                            children: <Widget>[
                              40.height,
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.center,
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: <Widget>[
                                  Container(
                                    margin: const EdgeInsets.all(21.0),
                                    child: Container(
                                      margin: const EdgeInsets.only(
                                        left: 10.0,
                                        right: 10.0,
                                      ),
                                      child: Column(
                                        crossAxisAlignment: CrossAxisAlignment.center,
                                        mainAxisSize: MainAxisSize.min,
                                        mainAxisAlignment: MainAxisAlignment.spaceAround,
                                        children: <Widget>[
                                          SvgPicture.asset(
                                            "assets/images/user.svg",
                                            height: 70,
                                            width: 70,
                                            fit: BoxFit.cover,
                                          ),
                                          10.height,
                                          Text(
                                            widget.outGoingCallData.receiverName.toString().replaceAll(".", " "),
                                            style: const TextStyle(
                                              fontSize: 21,
                                              fontWeight: FontWeight.bold,
                                              color: MyColors.white,
                                              letterSpacing: -1.26,
                                              height: 23 / 12,
                                            ),
                                          ),
                                          const Text(
                                            "Ringing...",
                                            style: TextStyle(
                                              fontSize: 16,
                                              fontWeight: FontWeight.w600,
                                              color: Color(
                                                0xffC6C6C6,
                                              ),
                                              letterSpacing: -0.48,
                                              height: 23 / 24,
                                            ),
                                          ),
                                          const SizedBox(
                                            height: 2,
                                          ),
                                        ],
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                              const Spacer(),
                              Container(
                                margin: const EdgeInsets.only(
                                  bottom: 70.0,
                                  left: 49,
                                  right: 49,
                                ),
                                child: Row(
                                  mainAxisSize: MainAxisSize.max,
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: <Widget>[
                                    RawMaterialButton(
                                      onPressed: () {
                                        chatcp.endCall(isUserOnline: chatProvider.isUserOnline).then((bool value) {
                                          if (value) {
                                            Navigator.of(context).pop();
                                            // print("Reintiiiiiiitttzzzz");
                                            // chatcp.initStreams();
                                          }
                                        });
                                      },
                                      elevation: 2.0,
                                      fillColor: MyColors.redA3Color,
                                      padding: const EdgeInsets.all(
                                        15.0,
                                      ),
                                      shape: const CircleBorder(),
                                      child: const Icon(
                                        Icons.call_end,
                                        color: MyColors.white,
                                        size: 35.0,
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ),
                ],
              );
      }),
    );
  }

  BoxDecoration cardRadius(double radius, {required Color color, double? elevation}) {
    return BoxDecoration(
      shape: BoxShape.rectangle,
      color: color ?? Colors.white,
      borderRadius: BorderRadius.all(Radius.circular(radius)),
      boxShadow: <BoxShadow>[BoxShadow(color: const Color(0xff000000).withOpacity(.05), blurRadius: elevation ?? 27, offset: const Offset(-2, 3))],
    );
  }
}
