import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tone_snap/components/my_marquee_text.dart';
import 'package:tone_snap/components/network_image_widget.dart';
import 'package:tone_snap/modules/sideb/controllers/music_player_controller.dart';
import 'package:tone_snap/res/themes/app_sizes.dart';
import 'package:tone_snap/utils/obj_util.dart';

import 'music_bar_controller.dart';

class MusicBarView extends StatelessWidget {
  MusicBarView({super.key});

  final controller = Get.put(MusicBarController(), permanent: true);
  final musicPlayerController = MusicPlayerController.to;

  @override
  Widget build(BuildContext context) {
    return Obx(() {
      return Stack(
        fit: StackFit.expand,
        children: [
          Positioned(
            bottom: controller.bottom.value,
            left: 16.w,
            right: 16.w,
            child: GestureDetector(
              onTap: controller.openPlayPage,
              child: Container(
                width: 1.sw - 32.w,
                height: musicBarHeight,
                padding: EdgeInsets.symmetric(horizontal: 26.w),
                decoration: BoxDecoration(
                  color: const Color(0xFF80F988),
                  borderRadius: BorderRadius.circular(36).r,
                  boxShadow: const [
                    BoxShadow(
                      color: Color(0x40040604),
                      offset: Offset(0, 4),
                      blurRadius: 4,
                      spreadRadius: 0,
                    ),
                  ],
                ),
                child: Row(
                  children: [
                    ClipOval(
                      child: Obx(() {
                        return NetworkImageWidget(
                          url: musicPlayerController.musicModel.value.thumbnail,
                          width: 48.w,
                          height: 48.w,
                        );
                      }),
                    ),
                    SizedBox(width: 12.w),
                    Expanded(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Obx(() {
                            return MyMarqueeText(
                              text: ObjUtil.getStr(musicPlayerController.musicModel.value.title),
                              textStyle: TextStyle(
                                color: Colors.black,
                                fontSize: 16.sp,
                                fontWeight: FontWeight.w600,
                              ),
                            );
                          }),
                          SizedBox(height: 4.h),
                          Obx(() {
                            return MyMarqueeText(
                              text: ObjUtil.getStr(musicPlayerController.musicModel.value.subTitle),
                              textStyle: TextStyle(
                                color: Colors.black,
                                fontSize: 12.sp,
                              ),
                            );
                          }),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      );
    });
  }
}