import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:wow_english/common/blocs/timerbloc/timer_bloc.dart';
import 'package:wow_english/common/extension/string_extension.dart';
import 'package:wow_english/common/widgets/timer_ticker.dart';

class TimerWidget extends StatelessWidget {
  const TimerWidget({super.key, required this.canSendSms});

  final bool canSendSms;

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => TimerBloc(ticker: const TimerTicker()),
      child: TimerWidgetView(canSendSms: canSendSms,),
    );
  }
}

class TimerWidgetView extends StatelessWidget {
  final bool canSendSms;

  const TimerWidgetView({super.key, required this.canSendSms});

  @override
  Widget build(BuildContext context) {
    return BlocListener<TimerBloc,TimerState>(
      listener: (context, s) {
        if (s is FinishedState) {
          ///重置计时器
          context.read<TimerBloc>().add(ResetEvent());
        }
      },
      child: _buildCountdownWidget(),
    );
  }

  Widget _buildCountdownWidget() => BlocBuilder<TimerBloc,TimerState>(
    buildWhen: (prev, state) => prev.runtimeType != state.runtimeType,
    builder: (context,state) {
      final bloc = BlocProvider.of<TimerBloc>(context);
      return GestureDetector(
        onTap: () {
          if (canSendSms && !bloc.isCountTimer ) {
            bloc.add(StartEvent(duration: state.duration));
          }
        },
        child: Container(
          decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage(
                    canSendSms && !bloc.isCountTimer ? 'securitycode'.assetPng:'securitycode_dis'.assetPng
                ),
                fit: BoxFit.fill
            ),
          ),
          padding: EdgeInsets.symmetric(horizontal:12.w,vertical: 15.h),
          child: Row(
            children: [
              if (state is RunningState)...[
                const TimerText()
              ] else ...[
                Text('获取验证码',
                  style: TextStyle(
                      fontSize: 12.sp
                  ),)
              ]
            ],
          ),
        ),
      );
    },
  );
}

class TimerText extends StatelessWidget {
  const TimerText({super.key});

  @override
  Widget build(BuildContext context) {
    final duration = context.select((TimerBloc bloc) => bloc.state.duration);
    final secondsStr = duration.toString().padLeft(2, '0');
    return Text(
      '${secondsStr}s后再次获取',
      style: TextStyle(
        fontSize: 12.sp
      ),
    );
  }
}