import 'dart:io';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';

enum WatchFacePreviewType {
  surface,
  singleSmall,
  singleMedium,
  coupleSmall,
}

class WatchFacePreview extends StatelessWidget {
  const WatchFacePreview({
    super.key,
    this.type = WatchFacePreviewType.singleMedium,
    this.themeImageUrl,
    this.themeImageUrl2,
    this.switchFriend,
  });

  final String? themeImageUrl;
  final String? themeImageUrl2;
  final WatchFacePreviewType type;
  final Function()? switchFriend;

  String get _backgroundAsset {
    if (type == WatchFacePreviewType.surface) {
      return 'assets/images/watch_theme/watch_theme_preview_surface.png';
    }
    if (type == WatchFacePreviewType.coupleSmall) {
      return 'assets/images/watch_theme/watch_theme_preview_couple.png';
    }
    return 'assets/images/watch_theme/watch_theme_preview_single.png';
  }

  Size get _previewSize {
    if (type == WatchFacePreviewType.singleMedium) {
      return Size(134, 160);
    }
    return Size(120, 136);
  }

  Size get _themeSize {
    if (type == WatchFacePreviewType.singleMedium) {
      return Size(64, 64);
    }
    if (type == WatchFacePreviewType.singleSmall) {
      return Size(54, 54);
    }
    if (type == WatchFacePreviewType.surface) {
      return Size(32, 32);
    }
    return Size(32, 32);
  }

  @override
  Widget build(BuildContext context) {
    final size = _previewSize;

    return SizedBox(
      child: Column(
        children: [
          Stack(
            alignment: Alignment.topCenter,
        clipBehavior: Clip.none,
        children: [
          Image(
            image: AssetImage(_backgroundAsset),
            width: size.width,
            height: size.height,
            fit: BoxFit.fitWidth,
          ),
          _buildThemeImages(),
        ],
      ),
          type == WatchFacePreviewType.coupleSmall
              ? GestureDetector(
                  onTap: switchFriend,
                  child: Container(
                    alignment: Alignment.center,
                    height: 24,
                    padding: EdgeInsets.fromLTRB(12, 0, 12, 0),
                    decoration: BoxDecoration(
                        border: Border.all(width: 1, color: Color(0xFFC3ADFF)),
                        borderRadius: BorderRadius.all(Radius.circular(12))),
                    child: Text(
                      '切换好友',
                      style: TextStyle(
                          fontSize: 12,
                          fontWeight: FontWeight.w600,
                          color: Color(0xFF845EEE)),
                    ),
                  ),
                ).marginOnly(top: 8)
              : SizedBox(),
        ],
      ),
    );
  }

  Widget _buildThemeImages() {
    final themeSize = _themeSize;

    if (type == WatchFacePreviewType.singleMedium) {
      return Positioned(
        top: 30,
        width: themeSize.width,
        height: themeSize.height,
        child: _buildFaceImage(themeImageUrl,
                'assets/images/watch_theme/official_default_green.png')
            .paddingOnly(right: 10),
      );
    }
    if (type == WatchFacePreviewType.singleSmall) {
      return Positioned(
        top: 26,
        width: themeSize.width,
        height: themeSize.height,
        child: _buildFaceImage(themeImageUrl,
                'assets/images/watch_theme/official_default_green.png')
            .paddingOnly(right: 8),
      );
    }
    if (type == WatchFacePreviewType.surface) {
      return Positioned(
        top: 60,
        left: 10,
        width: themeSize.width,
        height: themeSize.height,
        child: _buildFaceImage(themeImageUrl,
            'assets/images/watch_theme/official_default_green.png'),
      );
    }

    return Positioned(
      top: 36,
      child: Row(
        children: [
          SizedBox(
            width: themeSize.width,
            height: themeSize.height,
            child: _buildFaceImage(themeImageUrl,
                'assets/images/watch_theme/official_default_green.png'),
            ),
          SizedBox(
            width: 12,
          ),
          SizedBox(
            width: themeSize.width,
            height: themeSize.height,
            child: _buildFaceImage(themeImageUrl2,
                'assets/images/watch_theme/official_default_blue.png'),
          ),
        ],
      ).paddingOnly(right: 8),
    );
  }

  Widget _buildFaceImage(String? themeUrl, String placeholder) {
    if (themeUrl != null && themeUrl.isNotEmpty) {
      if (themeUrl.isURL) {
        return CachedNetworkImage(
          imageUrl: themeUrl,
          fit: BoxFit.fitWidth,
        );
      }
      return Image.file(File(themeUrl), fit: BoxFit.fitWidth);
    }
    return Image.asset(
      placeholder,
      fit: BoxFit.fitWidth,
    );
  }
}