import 'dart:async'; import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; import 'package:flutter_countdown_timer/current_remaining_time.dart'; import 'package:flutter_countdown_timer/flutter_countdown_timer.dart'; import 'package:lottie/lottie.dart'; import 'package:mohem_flutter_app/classes/colors.dart'; import 'package:mohem_flutter_app/classes/decorations_helper.dart'; import 'package:mohem_flutter_app/classes/lottie_consts.dart'; import 'package:mohem_flutter_app/config/routes.dart'; import 'package:mohem_flutter_app/extensions/int_extensions.dart'; import 'package:mohem_flutter_app/extensions/string_extensions.dart'; import 'package:mohem_flutter_app/extensions/widget_extensions.dart'; import 'package:mohem_flutter_app/generated/locale_keys.g.dart'; import 'package:mohem_flutter_app/ui/marathon/marathon_provider.dart'; import 'package:mohem_flutter_app/ui/marathon/widgets/marathon_header.dart'; import 'package:mohem_flutter_app/widgets/button/default_button.dart'; import 'package:provider/provider.dart'; final int dummyEndTime = DateTime.now().millisecondsSinceEpoch + 1000 * 10; class MarathonIntroScreen extends StatelessWidget { const MarathonIntroScreen({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Scaffold( body: Consumer( builder: (BuildContext context, MarathonProvider provider, _) { return Stack( children: [ SingleChildScrollView( child: Column( children: [ const MarathonHeader(), 20.height, const MarathonDetailsCard().paddingAll(15), MarathonTimerCard( provider: provider, timeToMarathon: dummyEndTime, ).paddingAll(15), ], ), ), Align( alignment: Alignment.bottomCenter, child: MarathonFooter(provider: provider), ), ], ); }, ), ); } } class MarathonDetailsCard extends StatelessWidget { const MarathonDetailsCard({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Container( width: double.infinity, decoration: MyDecorations.shadowDecoration, padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20), child: Column( mainAxisSize: MainAxisSize.min, crossAxisAlignment: CrossAxisAlignment.start, children: [ Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ LocaleKeys.contestTopicAbout .tr() .toText16(color: MyColors.grey77Color), "Saudi Arabia" .toText20(color: MyColors.textMixColor, isBold: true), 10.height, ], ), Row( children: [ LocaleKeys.gameDate.tr().toText16(color: MyColors.grey77Color), " 10 Oct, 2022" .toText16(color: MyColors.darkTextColor, isBold: true), ], ), Row( children: [ LocaleKeys.gameTime.tr().toText16(color: MyColors.grey77Color), " 3:00pm".toText16(color: MyColors.darkTextColor, isBold: true), ], ), ], ), ); } } class MarathonTimerCard extends StatelessWidget { final int timeToMarathon; final MarathonProvider provider; const MarathonTimerCard({ Key? key, required this.provider, required this.timeToMarathon, }) : super(key: key); @override Widget build(BuildContext context) { return Container( width: double.infinity, decoration: MyDecorations.shadowDecoration, padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20), child: Column( children: [ Lottie.asset(MyLottieConsts.hourGlassLottie, height: 200), BuildCountdownTimer( timeToMarathon: timeToMarathon, provider: provider, ), ], ), ); } } class BuildCountdownTimer extends StatelessWidget { final int timeToMarathon; final MarathonProvider provider; const BuildCountdownTimer({ Key? key, required this.provider, required this.timeToMarathon, }) : super(key: key); Widget buildEmptyWidget() { return Row( mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: [ Column( children: [ "00".toText32(), LocaleKeys.days.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ "00".toText32(), LocaleKeys.hours.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ "00".toText32(), LocaleKeys.minutes.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ "00".toText32(), LocaleKeys.seconds.tr().toText14(color: MyColors.grey57Color), ], ), ], ); } Widget buildSeparator() { return " : ".toText32(); } Widget buildCountdownTimer(CurrentRemainingTime? time) { if (time == null) { scheduleMicrotask(() { provider.itsMarathonTime = true; }); return buildEmptyWidget(); } return Row( mainAxisSize: MainAxisSize.min, mainAxisAlignment: MainAxisAlignment.spaceEvenly, crossAxisAlignment: CrossAxisAlignment.start, children: [ Column( children: [ time.days == null ? "00".toText32() : time.days.toString().toText32(), LocaleKeys.days.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ time.hours == null ? "00".toText32() : time.hours.toString().toText32(), LocaleKeys.hours.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ time.min == null ? "00".toText32() : time.min.toString().toText32(), LocaleKeys.minutes.tr().toText14(color: MyColors.grey57Color), ], ), buildSeparator(), Column( children: [ time.sec == null ? "00".toText32() : time.sec.toString().toText32(), LocaleKeys.seconds.tr().toText14(color: MyColors.grey57Color), ], ), ], ); } @override Widget build(BuildContext context) { return CountdownTimer( endTime: timeToMarathon, onEnd: null, widgetBuilder: (BuildContext context, CurrentRemainingTime? time) { return buildCountdownTimer(time); }, ); } } class MarathonFooter extends StatelessWidget { final MarathonProvider provider; const MarathonFooter({ Key? key, required this.provider, }) : super(key: key); Widget buildNoteForDemo() { return Flexible( child: RichText( text: TextSpan( children: [ TextSpan( text: LocaleKeys.note.tr(), style: const TextStyle( fontSize: 22, fontWeight: FontWeight.bold, color: MyColors.darkTextColor, ), ), TextSpan( text: " " + LocaleKeys.demoMarathonNoteP1.tr(), style: const TextStyle( color: MyColors.darkTextColor, fontSize: 18, fontWeight: FontWeight.w600, ), ), TextSpan( text: " " + LocaleKeys.demoMarathonNoteP2.tr(), style: const TextStyle( color: MyColors.darkTextColor, fontSize: 20, fontWeight: FontWeight.bold, ), ), TextSpan( text: " " + LocaleKeys.demoMarathonNoteP3.tr(), style: const TextStyle( color: MyColors.darkTextColor, fontSize: 18, fontWeight: FontWeight.w600, ), ) ], ), ), ); } @override Widget build(BuildContext context) { return Container( color: MyColors.kWhiteColor, width: double.infinity, padding: const EdgeInsets.symmetric(horizontal: 25, vertical: 15), child: provider.itsMarathonTime ? DefaultButton( LocaleKeys.joinMarathon.tr(), () => Navigator.pushNamed(context, AppRoutes.marathonScreen), ).insideContainer : Column( mainAxisSize: MainAxisSize.min, children: [ buildNoteForDemo(), DefaultButton(LocaleKeys.joinDemoMarathon.tr(), () {}) .insideContainer, ], ), ); } }