You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
374 lines
19 KiB
Dart
374 lines
19 KiB
Dart
import 'dart:async';
|
|
|
|
import 'package:easy_localization/easy_localization.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_svg/svg.dart';
|
|
import 'package:lottie/lottie.dart';
|
|
import 'package:mohem_flutter_app/app_state/app_state.dart';
|
|
import 'package:mohem_flutter_app/classes/colors.dart';
|
|
import 'package:mohem_flutter_app/classes/consts.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/models/marathon/question_model.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/marathon_provider.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/widgets/custom_status_widget.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/widgets/marathon_progress_container.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/widgets/marathon_qualifiers_container.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/widgets/question_card.dart';
|
|
import 'package:mohem_flutter_app/ui/marathon/widgets/question_card_builder.dart';
|
|
import 'package:mohem_flutter_app/widgets/app_bar_widget.dart';
|
|
import 'package:mohem_flutter_app/widgets/button/default_button.dart';
|
|
import 'package:mohem_flutter_app/widgets/dialogs/confirm_dialog.dart';
|
|
import 'package:provider/provider.dart';
|
|
|
|
class MarathonScreen extends StatelessWidget {
|
|
const MarathonScreen({Key? key}) : super(key: key);
|
|
|
|
Widget getSuccessWidget({required int? gapType, required String? gapImage, required String? gapText}) {
|
|
if (gapType == 1) {
|
|
if (gapText == null) {
|
|
return Image.asset(MyLottieConsts.congratsGif, height: 200);
|
|
}
|
|
return gapText.toText18(color: MyColors.darkTextColor, isCentered: true);
|
|
}
|
|
if (gapType == 0) {
|
|
if (gapImage == null) {
|
|
return Image.asset(MyLottieConsts.congratsGif, height: 200);
|
|
}
|
|
return Image.network(ApiConsts.marathonBaseUrlServices + gapImage, height: 200);
|
|
}
|
|
return Image.asset(MyLottieConsts.congratsGif, height: 200);
|
|
}
|
|
|
|
Widget getDemoWinnerWidget(BuildContext context, {required MarathonProvider provider}) {
|
|
return provider.isUserOutOfGame
|
|
? Column(
|
|
children: <Widget>[
|
|
Lottie.asset(MyLottieConsts.noWinnerLottie),
|
|
Center(
|
|
child: LocaleKeys.noWinner.tr().toText18(color: MyColors.grey3AColor, isCentered: true),
|
|
),
|
|
],
|
|
)
|
|
: Stack(
|
|
children: <Widget>[
|
|
Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
SizedBox(
|
|
height: 50,
|
|
child: Stack(
|
|
children: <Widget>[
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: SvgPicture.asset("assets/images/winner_ribbon.svg", height: 50),
|
|
),
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: LocaleKeys.winner.tr().toText32(color: MyColors.white, isBold: true, isCentered: true).paddingOnly(top: 07),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
16.height,
|
|
Column(
|
|
children: <Widget>[
|
|
(AppState().isArabic(context) ? AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEAr : AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEEn)!.toText22(
|
|
color: MyColors.grey3AColor,
|
|
isCentered: true,
|
|
),
|
|
8.height,
|
|
AppState().memberInformationList!.eMPLOYEENUMBER!.toText22(color: MyColors.grey57Color),
|
|
],
|
|
),
|
|
60.height,
|
|
if (provider.demoMarathonDetailModel.sponsors != null && provider.demoMarathonDetailModel.sponsors!.isNotEmpty) ...<Widget>[
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
"${LocaleKeys.sponsoredBy.tr()} ".toText14(color: MyColors.grey77Color),
|
|
(AppState().isArabic(context) ? provider.demoMarathonDetailModel.sponsors!.first.nameAr ?? "" : provider.demoMarathonDetailModel.sponsors!.first.nameEn ?? "").toText14(
|
|
color: MyColors.darkTextColor,
|
|
isBold: true,
|
|
),
|
|
],
|
|
),
|
|
5.height,
|
|
Image.network(
|
|
ApiConsts.marathonBaseUrlServices + provider.demoMarathonDetailModel.sponsors!.first.logo!,
|
|
height: 50,
|
|
width: 150,
|
|
fit: BoxFit.contain,
|
|
errorBuilder: (BuildContext context, Object exception, StackTrace? stackTrace) {
|
|
return Image.asset("assets/images/logos/main_mohemm_logo.png", height: 50, width: 150);
|
|
},
|
|
)
|
|
],
|
|
],
|
|
),
|
|
Lottie.asset(MyLottieConsts.celebrate1Lottie),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget getWinnerWidget(BuildContext context, {required MarathonProvider provider}) {
|
|
return Container(
|
|
width: double.infinity,
|
|
decoration: MyDecorations.shadowDecoration,
|
|
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 20),
|
|
child: (AppState().getIsDemoMarathon)
|
|
? getDemoWinnerWidget(context, provider: provider)
|
|
: provider.selectedWinners == null || (provider.selectedWinners!.isEmpty && !provider.iAmWinner)
|
|
? Column(
|
|
children: <Widget>[
|
|
Lottie.asset(MyLottieConsts.noWinnerLottie),
|
|
Center(
|
|
child: LocaleKeys.noWinner.tr().toText18(color: MyColors.grey3AColor, isCentered: true),
|
|
),
|
|
],
|
|
)
|
|
: Stack(
|
|
children: <Widget>[
|
|
Column(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
SizedBox(
|
|
height: 50,
|
|
child: Stack(
|
|
children: <Widget>[
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: SvgPicture.asset("assets/images/winner_ribbon.svg", height: 50),
|
|
),
|
|
Align(
|
|
alignment: Alignment.center,
|
|
child: ((provider.selectedWinners!.length == 1 && !provider.iAmWinner) || (provider.selectedWinners!.isEmpty && provider.iAmWinner)
|
|
? LocaleKeys.winner.tr()
|
|
: LocaleKeys.winners.tr())
|
|
.toText32(color: MyColors.white, isBold: true, isCentered: true)
|
|
.paddingOnly(top: 07),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
16.height,
|
|
provider.iAmWinner
|
|
? Column(
|
|
children: <Widget>[
|
|
(AppState().isArabic(context) ? AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEAr : AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEEn)!.toText22(
|
|
color: MyColors.grey3AColor,
|
|
isCentered: true,
|
|
),
|
|
8.height,
|
|
AppState().memberInformationList!.eMPLOYEENUMBER!.toText22(color: MyColors.grey57Color),
|
|
],
|
|
)
|
|
: const SizedBox(),
|
|
34.height,
|
|
if (provider.selectedWinners != null) ...<Widget>[
|
|
provider.selectedWinners!.length == 1
|
|
? Column(
|
|
children: <Widget>[
|
|
(AppState().isArabic(context) ? provider.selectedWinners![0].nameEn : provider.selectedWinners![0].nameEn)!.toText24(
|
|
color: MyColors.grey3AColor,
|
|
isCentered: true,
|
|
),
|
|
8.height,
|
|
AppState().memberInformationList!.eMPLOYEENUMBER!.toText22(color: MyColors.grey57Color),
|
|
],
|
|
)
|
|
: ListView.separated(
|
|
shrinkWrap: true,
|
|
itemCount: provider.selectedWinners!.length,
|
|
separatorBuilder: (BuildContext context, int index) {
|
|
return const Divider();
|
|
},
|
|
itemBuilder: (BuildContext context, int index) {
|
|
return Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: <Widget>[
|
|
(AppState().isArabic(context) ? provider.selectedWinners![index].nameEn : provider.selectedWinners![index].nameEn)!.toText16(
|
|
color: MyColors.grey3AColor,
|
|
),
|
|
provider.selectedWinners!.first.employeeId!.toText16(color: MyColors.grey57Color),
|
|
],
|
|
);
|
|
},
|
|
),
|
|
],
|
|
60.height,
|
|
if (provider.marathonDetailModel.sponsors != null && provider.marathonDetailModel.sponsors!.isNotEmpty) ...<Widget>[
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
"${LocaleKeys.sponsoredBy.tr()} ".toText14(color: MyColors.grey77Color),
|
|
(AppState().isArabic(context) ? provider.marathonDetailModel.sponsors!.first.nameAr ?? "" : provider.marathonDetailModel.sponsors!.first.nameEn ?? "").toText14(
|
|
color: MyColors.darkTextColor,
|
|
isBold: true,
|
|
),
|
|
],
|
|
),
|
|
5.height,
|
|
Image.network(
|
|
ApiConsts.marathonBaseUrlServices + provider.marathonDetailModel.sponsors!.first.logo!,
|
|
height: 50,
|
|
width: 150,
|
|
fit: BoxFit.contain,
|
|
errorBuilder: (BuildContext context, Object exception, StackTrace? stackTrace) {
|
|
return Image.asset("assets/images/logos/main_mohemm_logo.png", height: 50, width: 150);
|
|
},
|
|
)
|
|
],
|
|
],
|
|
),
|
|
Lottie.asset(MyLottieConsts.celebrate1Lottie),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget getNameContainer(BuildContext context) {
|
|
return Container(
|
|
height: 50,
|
|
padding: const EdgeInsets.symmetric(horizontal: 20),
|
|
decoration: BoxDecoration(
|
|
color: MyColors.greenColor,
|
|
borderRadius: BorderRadius.circular(15),
|
|
boxShadow: <BoxShadow>[BoxShadow(color: const Color(0xff000000).withOpacity(.05), blurRadius: 26, offset: const Offset(0, -3))],
|
|
),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: <Widget>[
|
|
(AppState().isArabic(context) ? AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEAr! : AppState().memberInformationList!.eMPLOYEEDISPLAYNAMEEn!)
|
|
.toText17(isBold: true, color: MyColors.white),
|
|
AppState().memberInformationList!.eMPLOYEENUMBER!.toText17(isBold: true, color: MyColors.white),
|
|
],
|
|
),
|
|
).paddingOnly(left: 20, right: 20, top: 12, bottom: 10);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
MarathonProvider provider = context.watch<MarathonProvider>();
|
|
return WillPopScope(
|
|
child: Scaffold(
|
|
appBar: AppBarWidget(
|
|
context,
|
|
title: LocaleKeys.brainMarathon.tr(),
|
|
onHomeTapped: () {
|
|
if (provider.questionCardStatus == QuestionCardStatus.winnerFound) {
|
|
provider.resetValues();
|
|
provider.getMarathonDetailsFromApi();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
} else {
|
|
showDialog(
|
|
context: context,
|
|
builder: (BuildContext context) => ConfirmDialog(
|
|
message: LocaleKeys.youWantToLeaveMarathon.tr(),
|
|
onTap: () {
|
|
provider.resetValues();
|
|
provider.getMarathonDetailsFromApi();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
},
|
|
),
|
|
);
|
|
}
|
|
},
|
|
onBackTapped: () {
|
|
if (provider.questionCardStatus == QuestionCardStatus.winnerFound) {
|
|
provider.resetValues();
|
|
provider.getMarathonDetailsFromApi();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
} else {
|
|
showDialog(
|
|
context: context,
|
|
builder: (BuildContext context) => ConfirmDialog(
|
|
message: LocaleKeys.youWantToLeaveMarathon.tr(),
|
|
onTap: () {
|
|
provider.resetValues();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
},
|
|
),
|
|
);
|
|
}
|
|
},
|
|
),
|
|
body: Column(
|
|
children: <Widget>[
|
|
ListView(
|
|
children: <Widget>[
|
|
10.height,
|
|
if (provider.questionCardStatus == QuestionCardStatus.findingWinner) ...<Widget>[
|
|
QualifiersContainer(provider: provider).paddingOnly(left: 21, right: 21),
|
|
] else if (provider.questionCardStatus == QuestionCardStatus.winnerFound)
|
|
...<Widget>[]
|
|
else ...<Widget>[
|
|
MarathonProgressContainer(provider: provider).paddingOnly(left: 21, right: 21),
|
|
],
|
|
if (provider.questionCardStatus == QuestionCardStatus.findingWinner) ...<Widget>[
|
|
getNameContainer(context),
|
|
],
|
|
QuestionCardBuilder(
|
|
onQuestion: (BuildContext context) => const QuestionCard(),
|
|
onCompleted: (BuildContext context) => CustomStatusWidget(
|
|
asset: Lottie.asset(MyLottieConsts.allQuestions, height: 200),
|
|
title: LocaleKeys.congrats.tr().toText22(color: MyColors.greenColor),
|
|
subTitle: LocaleKeys.allQuestionsCorrect.toText18(color: MyColors.darkTextColor, isCentered: true),
|
|
),
|
|
onCorrectAnswer: (BuildContext context) => CustomStatusWidget(
|
|
asset: getSuccessWidget(gapType: provider.gapTimeType, gapImage: provider.gapTimeImage, gapText: provider.gapTimeText),
|
|
title: LocaleKeys.congrats.tr().toText22(color: MyColors.greenColor),
|
|
subTitle: LocaleKeys.yourAnswerCorrect.tr().toText18(color: MyColors.darkTextColor, isCentered: true),
|
|
),
|
|
onWinner: (BuildContext context) => getWinnerWidget(context, provider: provider),
|
|
onWrongAnswer: (BuildContext context) => CustomStatusWidget(
|
|
asset: Image.asset(MyLottieConsts.wrongAnswerGif, height: 200),
|
|
title: LocaleKeys.oops.tr().toText22(color: MyColors.redColor),
|
|
subTitle: LocaleKeys.wrongAnswer.tr().toText18(color: MyColors.darkTextColor, isCentered: true),
|
|
),
|
|
onSkippedAnswer: (BuildContext context) => CustomStatusWidget(
|
|
asset: Image.asset(MyLottieConsts.wrongAnswerGif, height: 200),
|
|
title: LocaleKeys.oops.tr().toText22(color: MyColors.redColor),
|
|
subTitle: LocaleKeys.youMissedTheQuestion.tr().toText18(color: MyColors.darkTextColor, isCentered: true),
|
|
),
|
|
onFindingWinner: (BuildContext context) => CustomStatusWidget(
|
|
asset: Lottie.asset(MyLottieConsts.winnerLottie, height: 168, reverse: false),
|
|
title: LocaleKeys.fingersCrossed.tr().toText22(color: MyColors.greenColor),
|
|
subTitle: LocaleKeys.winnerSelectedRandomly.tr().toText18(color: MyColors.darkTextColor, isCentered: true),
|
|
),
|
|
questionCardStatus: provider.questionCardStatus,
|
|
).paddingOnly(top: 12, left: 21, right: 21),
|
|
],
|
|
).expanded,
|
|
provider.questionCardStatus == QuestionCardStatus.winnerFound
|
|
? DefaultButton(LocaleKeys.ok.tr(), () {
|
|
provider.resetValues();
|
|
provider.getMarathonDetailsFromApi();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
}).insideContainer
|
|
: const SizedBox()
|
|
],
|
|
),
|
|
),
|
|
onWillPop: () {
|
|
showDialog(
|
|
context: context,
|
|
builder: (BuildContext context) => ConfirmDialog(
|
|
message: LocaleKeys.youWantToLeaveMarathon.tr(),
|
|
onTap: () {
|
|
provider.resetValues();
|
|
Navigator.of(context).popUntil(ModalRoute.withName(AppRoutes.dashboard));
|
|
},
|
|
),
|
|
);
|
|
return Future<bool>.value(false);
|
|
},
|
|
);
|
|
}
|
|
}
|