import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:tone_snap/components/base_scrollbar.dart';
import 'package:tone_snap/components/my_marquee_text.dart';
import 'package:tone_snap/components/network_image_widget.dart';
import 'package:tone_snap/components/view_state_widget.dart';
import 'package:tone_snap/data/models/music_model.dart';
import 'package:tone_snap/generated/assets.dart';
import 'package:tone_snap/modules/sideb/widgets/music_appbar.dart';
import 'package:tone_snap/modules/sideb/widgets/remove_padding_music_bar.dart';
import 'package:tone_snap/utils/obj_util.dart';

import 'artists_controller.dart';

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

  final controller = Get.find<ArtistsController>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.transparent,
      body: Stack(
        children: [
          _buildPageBg(),
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const MusicAppbar(
                title: 'Love Artists',
              ),
              _buildTotal(),
              _buildList(),
              const RemovePaddingMusicBar(),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildPageBg() {
    return Image.asset(
      Assets.sideBLoveSongsBg,
      width: 1.sw,
      height: 1.sh,
      fit: BoxFit.cover,
    );
  }

  Widget _buildTotal() {
    return Padding(
      padding: EdgeInsets.only(top: 34.h, bottom: 10.h, left: 18.w, right: 18.w),
      child: Obx(() {
        return Text(
          '${controller.artistsList.length} Artists',
          style: TextStyle(
            color: Colors.white,
            fontSize: 18.sp,
            overflow: TextOverflow.ellipsis,
          ),
        );
      }),
    );
  }

  Widget _buildList() {
    return Expanded(
      child: Obx(() {
        return ViewStateWidget(
          viewState: controller.viewState.value,
          child: BaseScrollbar(
            child: Obx(() {
              return ListView.builder(
                itemCount: controller.artistsList.length,
                itemBuilder: (context, index) {
                  return _buildItem(controller.artistsList[index]);
                },
              );
            }),
          ),
        );
      }),
    );
  }

  Widget _buildItem(MusicModel model) {
    return Material(
      color: Colors.transparent,
      child: InkWell(
        onTap: () => controller.onTapItem(model),
        child: Padding(
          padding: EdgeInsets.symmetric(vertical: 8.h, horizontal: 18.w),
          child: Row(
            children: [
              ClipOval(
                child: NetworkImageWidget(
                  url: model.coverUrl,
                  width: 50.w,
                  height: 50.w,
                ),
              ),
              SizedBox(width: 14.w),
              Expanded(
                child: Obx(() {
                  return MyMarqueeText(
                    text: ObjUtil.getStr(model.title),
                    textStyle: TextStyle(
                      color: Colors.white,
                      fontSize: 14.sp,
                    ),
                  );
                }),
              ),
            ],
          ),
        ),
      ),
    );
  }
}