import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:wow_english/common/extension/string_extension.dart';
import 'package:wow_english/pages/moduleSelect/state.dart';
import 'package:wow_english/pages/moduleSelect/widgets/BaseHomeHeaderWidget.dart';

import 'bloc.dart';
import 'event.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:wow_english/route/route.dart';

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

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (BuildContext context) => ModuleSelectBloc()..add(InitEvent()),
      child: Builder(builder: (context) => _HomePageView()),
    );
  }
}

class _HomePageView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final bloc = BlocProvider.of<ModuleSelectBloc>(context);
    return BlocListener<ModuleSelectBloc, ModuleSelectState>(
      listener: (context, state) {},
      child: _homeView(),
    );
  }

  Widget _homeView() => BlocBuilder<ModuleSelectBloc, ModuleSelectState>(
          builder: (context, state) {
        final bloc = BlocProvider.of<ModuleSelectBloc>(context);
        return Scaffold(
          body: Container(
            color: Colors.white,
            child: Column(
              children: [
                const BaseHomeHeaderWidget(),
                Expanded(
                  child: Center(
                    child: Row(
                      children: [
                        Expanded(
                          child: GestureDetector(
                            onTap: () {
                              pushNamed(AppRouteName.home);
                            },
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              children: [
                                Stack(
                                    alignment: AlignmentDirectional.center,
                                    children: [
                                      Image.asset('bg_frame_module'.assetPng,
                                          width: 162.5.w, height: 203.5.h),
                                      Center(
                                        child: Image.asset(
                                            'pic_module_study'.assetPng,
                                            width: 140.5.w,
                                            height: 172.h),
                                      )
                                    ]),
                                10.verticalSpace,
                                Image.asset('label_module_study'.assetPng,
                                    width: 124.w, height: 34.h),
                              ],
                            ),
                          ),
                        ),
                        Expanded(
                          child: GestureDetector(
                              onTap: () {
                                pushNamed(AppRouteName.games);
                              },
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Stack(
                                      alignment: AlignmentDirectional.center,
                                      children: [
                                        Image.asset('bg_frame_module'.assetPng,
                                            width: 162.5.w, height: 203.5.h),
                                        Image.asset('pic_module_game'.assetPng,
                                            width: 140.5.w, height: 172.h)
                                      ]),
                                  10.verticalSpace,
                                  Image.asset('label_module_game'.assetPng,
                                      width: 124.w, height: 34.h),
                                ],
                              )),
                        ),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
        );
      });
}