import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/modules/cx_module/chat/model/chat_participant_model.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/swipe_module/dialoge/single_btn_dialog.dart';
import 'package:test_sa/views/widgets/item_views/info_text_widget.dart';

import '../chat_provider.dart';
import 'call_provider.dart';

class AudioCallPage extends StatefulWidget {
  Participants sender;
  Participants recipient;
  int moduleId;
  int? referenceID;
  bool isAccept;

  AudioCallPage({Key? key, required this.sender, required this.recipient, this.isAccept = false, required this.moduleId, this.referenceID}) : super(key: key);

  @override
  _AudioCallPageState createState() {
    return _AudioCallPageState();
  }
}

class _AudioCallPageState extends State<AudioCallPage> {
  late CallProvider callPro;
  late ChatProvider chatProvider;

  // Participants? participants;

  bool isDialogOpen = false;

  @override
  void initState() {
    super.initState();
    callPro = Provider.of<CallProvider>(context, listen: false);
    chatProvider = Provider.of<ChatProvider>(context, listen: false);
    // participants = chatProvider.recipient;
    makeCall();
  }

  void makeCall() async {
    bool isConnected = await callPro.buildHubConnection(widget.sender.employeeNumber!);
    if (!isConnected) {
      context.showConfirmDialog("Error while connecting to call service. Please try again later.", title: "Connection Error", onTap: () {
        Navigator.pop(context);
        Navigator.pop(context);
      });
      return;
    }
    callPro.initAudioCallListeners();
    if (widget.isAccept) {
      callPro.acceptCall(widget.sender.employeeNumber ?? "", widget.recipient?.employeeNumber ?? "", false, moduleId: widget.moduleId);
    } else {
      callPro.startCall(widget.sender.employeeNumber ?? "", widget.recipient?.employeeNumber ?? "", false, widget.moduleId, widget.referenceID, onSuccess: (String msg) {
        callPro.dispose();
        Navigator.pop(context);
      }, onFailed: (String msg) {
        callPro.dispose();
        print("isDialogOpen:$isDialogOpen");
        if (isDialogOpen) {
          return;
        }
        isDialogOpen = true;
        showDialog(
          context: context,
          barrierDismissible: false,
          useRootNavigator: false,
          builder: (BuildContext cxt) => PopScope(
            canPop: false,
            onPopInvokedWithResult: (bool didPop, Object? result) {
              if (didPop) return;
            },
            child: SingleBtnDialog(
                title: "Failed",
                message: msg,
                okTitle: "Go Back",
                onTap: () {
                  Navigator.pop(context);
                  Navigator.pop(context);
                }),
          ),
        ).then((val) {
          isDialogOpen = false;
        });
      });
    }

    Map<String, dynamic> json = {
      // "callerID": AppState().chatDetails!.response!.id!.toString(),
      // "callerDetails": AppState().chatDetails!.toJson(),
      // "receiverID": params!.chatUser!.id.toString(),
      // "receiverDetails": params!.chatUser!.toJson(),
      // "title": params!.chatUser!.userName!.replaceAll(".", " "),
      // "calltype": widget.isAudio ? "Audio" : "Video",
    };

    // CallDataModel callData = CallDataModel.fromJson(json);
    // await Navigator.push(
    //   context,
    //   MaterialPageRoute(
    //     builder: (BuildContext context) => OutGoingCall(
    //       isVideoCall: callType == "VIDEO" ? true : false,
    //       outGoingCallData: callData,
    //     ),
    //   ),
    // ).then((value) {
    //   print("then");
    //   callPro.stopListeners();
    // });
  }

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          Container(
            width: double.infinity,
            height: double.infinity,
            decoration: const BoxDecoration(
              gradient: LinearGradient(
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
                colors: [
                  Color(0xFF202641), // top edge (y ≈ 0%)
                  Color(0xFF283859), // (y ≈ 8%)
                  Color(0xFF335073), // (y ≈ 15%)
                  Color(0xFF425E7A), // (y ≈ 23%)
                  Color(0xFF4A637D), // peak glow, behind avatar (y ≈ 27%)
                  Color(0xFF39495F), // (y ≈ 34%)
                  Color(0xFF1A2032), // fading to dark (y ≈ 42%)
                  Color(0xFF121426), // flat dark section (y ≈ 51%–70%)
                  Color(0xFF121426),
                  Color(0xFF25283A), // slight rise near bottom (y ≈ 89%)
                  Color(0xFF383D4D), // bottom edge (y ≈ 97%)
                ],
                stops: [0.0, 0.08, 0.15, 0.23, 0.27, 0.34, 0.42, 0.51, 0.70, 0.89, 0.97],
              ),
            ),
            // child: /* your call screen content */,
          ),
          // Container(
          //   decoration: const BoxDecoration(
          //     gradient: LinearGradient(
          //       begin: Alignment.topCenter,
          //       end: Alignment.bottomCenter,
          //       colors: [
          //         Color(0xFF33475F), // top - soft blue glow
          //         Color(0xFF1A2233), // mid transition
          //         Color(0xFF0D0F14), // bottom - near black
          //       ],
          //       stops: [0.0, 0.35, 1.0],
          //     ),
          //   ),
          // ),
          SafeArea(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    callButton("calling/call_user_avatar", () {}, size: 85),
                    24.height,
                    InfoTextLabelWidget(label: chatProvider.recipient?.userName ?? "", textStyle: AppTextStyles.heading4.copyWith(fontWeight: FontWeight.w600), color: Colors.white),
                    4.height,
                    Selector<CallProvider, String>(
                      selector: (_, myModel) => myModel.currentStatus, // Selects only the userName
                      builder: (_, currentStatus, __) => InfoTextLabelWidget(label: currentStatus, textStyle: AppTextStyles.heading6, color: Colors.white),
                    ),
                    4.height,
                    Selector<CallProvider, bool>(
                      selector: (_, myModel) => myModel.isPeerMuted,
                      builder: (_, isPeerMuted, __) => isPeerMuted ? InfoTextLabelWidget(label: "Mic Mute", textStyle: AppTextStyles.tinyFont, color: AppColor.red30) : const SizedBox(),
                    ),
                  ],
                ),
                const Spacer(),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    Selector<CallProvider, bool>(
                      selector: (_, myModel) => myModel.isMuted, // Selects only the userName
                      builder: (_, isMuted, __) => callButton(isMuted ? "calling/mic_disable" : "calling/mic_enable", () {
                        callPro.toggleMute();
                      }),
                    ),
                    callButton("calling/end_call", () async {
                      callPro.endCall(widget.sender.employeeNumber ?? "", widget.recipient.employeeNumber ?? "", moduleId: widget.moduleId);
                      Navigator.pop(context);
                    }, isEndCall: true, size: 68),
                    callButton("calling/speaker_enable", () {}),
                  ],
                )
              ],
            ).paddingOnly(start: 24, end: 24, top: 120, bottom: 100),
          ),
        ],
      ),
    );
  }

  Widget callButton(String icon, VoidCallback onTap, {bool isEndCall = false, bool isSelected = false, double size = 52}) {
    return (isEndCall
            ? Container(
                height: size,
                width: size,
                padding: const EdgeInsets.all(18),
                decoration: const BoxDecoration(color: AppColor.red30, shape: BoxShape.circle),
                child: icon.toSvgAsset(height: 24, width: 24, color: Colors.white),
              )
            : Container(
                height: size,
                width: size,
                padding: const EdgeInsets.all(12),
                decoration:
                    BoxDecoration(color: isSelected ? AppColor.primary10 : const Color(0xff414352), shape: BoxShape.circle, border: Border.all(color: Colors.white.withValues(alpha: .2), width: 1)),
                child: icon.toSvgAsset(height: 24, width: 24, color: Colors.white),
              ))
        .onPress(onTap);
  }
}