import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
import 'package:marquee/marquee.dart';
import 'package:provider/provider.dart';
import 'package:yumi/ui_kit/components/sc_compontent.dart';
import 'package:yumi/ui_kit/components/text/sc_text.dart';
import 'package:yumi/app/routes/sc_fluro_navigator.dart';
import 'package:yumi/shared/tools/sc_lk_dialog_util.dart';
import 'package:yumi/shared/data_sources/sources/local/user_manager.dart';
import 'package:yumi/services/audio/rtc_manager.dart';
import 'package:yumi/modules/room/detail/room_detail_page.dart';
import 'package:yumi/modules/room/voice_room_route.dart';
import 'package:yumi/ui_kit/widgets/room/exit_min_room_page.dart';
import 'package:yumi/ui_kit/widgets/room/sc_edit_room_announcement_page.dart';

class RoomHeadWidget extends StatefulWidget {
  @override
  _RoomHeadWidgetState createState() => _RoomHeadWidgetState();
}

class _RoomHeadWidgetState extends State<RoomHeadWidget> {
  @override
  Widget build(BuildContext context) {
    return Consumer<RtcProvider>(
      builder: (context, provider, child) {
        return Row(
          children: [
            Row(
              children: [
                GestureDetector(
                  onTap: () {
                    showBottomInBottomDialog(
                      context!,
                      RoomDetailPage(provider.isFz()),
                    );
                  },
                  child: Container(
                    padding: EdgeInsets.symmetric(
                      vertical: 6.w,
                      horizontal: 12.w,
                    ),
                    child: Row(
                      children: [
                        Stack(
                          alignment: Alignment.center,
                          children: [
                            netImage(
                              url: resolveRoomCoverUrl(
                                provider
                                    .currenRoom
                                    ?.roomProfile
                                    ?.roomProfile
                                    ?.id,
                                provider
                                    .currenRoom
                                    ?.roomProfile
                                    ?.roomProfile
                                    ?.roomCover,
                              ),
                              defaultImg: kRoomCoverDefaultImg,
                              width: 28.w,
                              height: 28.w,
                              borderRadius: BorderRadius.all(
                                Radius.circular(8.w),
                              ),
                            ),
                            Selector<RtcProvider, bool>(
                              selector: (c, p) => p.roomIsMute,
                              shouldRebuild: (prev, next) => prev != next,
                              builder: (_, isMute, __) {
                                return isMute
                                    ? ClipOval(
                                      child: Container(
                                        color: Colors.black54,
                                        padding: EdgeInsets.all(2.w),
                                        child: Image.asset(
                                          "sc_images/room/sc_icon_mic_mute.png",
                                          height: 18.w,
                                          width: 18.w,
                                        ),
                                      ),
                                    )
                                    : Container();
                              },
                            ),
                          ],
                        ),
                        SizedBox(width: 6.w),
                        Column(
                          mainAxisSize: MainAxisSize.min,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            SizedBox(width: 10.w),
                            Container(
                              constraints: BoxConstraints(
                                maxWidth: 106.w,
                                maxHeight: 17.w,
                              ),
                              child:
                                  (provider
                                                  .currenRoom
                                                  ?.roomProfile
                                                  ?.roomProfile
                                                  ?.roomName
                                                  ?.length ??
                                              0) >
                                          10
                                      ? Marquee(
                                        text:
                                            provider
                                                .currenRoom
                                                ?.roomProfile
                                                ?.roomProfile
                                                ?.roomName ??
                                            "",
                                        style: TextStyle(
                                          fontSize: 14.sp,
                                          color: Color(0xffffffff),
                                          fontWeight: FontWeight.w600,
                                          decoration: TextDecoration.none,
                                        ),
                                        scrollAxis: Axis.horizontal,
                                        crossAxisAlignment:
                                            CrossAxisAlignment.start,
                                        blankSpace: 40.0,
                                        velocity: 40.0,
                                        pauseAfterRound: Duration(seconds: 1),
                                        accelerationDuration: Duration(
                                          seconds: 1,
                                        ),
                                        accelerationCurve: Curves.easeOut,
                                        decelerationDuration: Duration(
                                          milliseconds: 500,
                                        ),
                                        decelerationCurve: Curves.easeOut,
                                      )
                                      : Text(
                                        provider
                                                .currenRoom
                                                ?.roomProfile
                                                ?.roomProfile
                                                ?.roomName ??
                                            '',
                                        maxLines: 1,
                                        overflow: TextOverflow.ellipsis,
                                        style: TextStyle(
                                          fontSize: 14.sp,
                                          color: Color(0xffffffff),
                                          fontWeight: FontWeight.w600,
                                          decoration: TextDecoration.none,
                                        ),
                                      ),
                            ),

                            text(
                              "ID:${provider.currenRoom?.roomProfile?.userProfile?.getID()}",
                              fontSize: 13.sp,
                              fontWeight: FontWeight.w600,
                              textColor: Colors.white70,
                            ),
                          ],
                        ),
                        SizedBox(width: 6.w),
                        provider.currenRoom?.roomProfile?.roomProfile?.userId !=
                                AccountStorage()
                                    .getCurrentUser()
                                    ?.userProfile
                                    ?.id
                            ? Selector<RtcProvider, bool>(
                              selector:
                                  (c, p) =>
                                      p.isFollowRoomRes?.followRoom ?? false,
                              shouldRebuild: (prev, next) => prev != next,
                              builder: (_, follow, __) {
                                return !follow
                                    ? GestureDetector(
                                      child: Image.asset(
                                        "sc_images/room/sc_icon_room_follow_no.png",
                                        width: 38.w,
                                        height: 22.w,
                                      ),
                                      onTap: () {
                                        provider.followCurrentVoiceRoom();
                                      },
                                    )
                                    : Container();
                              },
                            )
                            : Container(),
                      ],
                    ),
                  ),
                ),
              ],
            ),
            Spacer(),
            GestureDetector(
              child: Image.asset(
                "sc_images/room/sc_icon_room_edit_noti.png",
                width: 32.w,
                height: 32.w,
              ),
              onTap: () {
                if (provider.isFz()) {
                  SCNavigatorUtils.push(
                    context,
                    "${VoiceRoomRoute.roomEdit}?need=false",
                    replace: false,
                  );
                } else {
                  SmartDialog.show(
                    tag: "showEditNotiPage",
                    alignment: Alignment.center,
                    animationType: SmartAnimationType.fade,
                    maskColor: Colors.black54,
                    builder: (_) {
                      return SCEditRoomAnnouncementPage();
                    },
                  );
                }
                // provider.extRoom();
              },
            ),
            SizedBox(width: 6.w),
            GestureDetector(
              child: Image.asset(
                "sc_images/room/sc_icon_room_ext_min.png",
                width: 32.w,
                height: 32.w,
              ),
              onTap: () {
                showCenterDialog(
                  context,
                  ExitMinRoomPage(
                    provider.isFz(),
                    provider.currenRoom?.roomProfile?.roomProfile?.id ?? "",
                  ),
                  barrierColor: Colors.black54,
                );
                // provider.extRoom();
              },
            ),
            SizedBox(width: 12.w),
          ],
        );
      },
    );
  }
}