Skip to content

Commit

Permalink
Tournament minor improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
@cp-mayank
cp-mayank committed Nov 8, 2024
1 parent 29a3043 commit 489fa95
Show file tree
Hide file tree
Showing 6 changed files with 122 additions and 72 deletions.
1 change: 1 addition & 0 deletions khelo/assets/locales/app_en.arb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -240,6 +240,7 @@
"tournament_detail_key_stat_most_fours_title": "Most Fours",
"tournament_detail_key_stat_most_sixes_title": "Most Sixes",

"key_stat_all": "All",
"key_stat_filter_runs": "Runs",
"key_stat_filter_wickets": "Wickets",
"key_stat_filter_fours": "Fours",
Expand Down
107 changes: 55 additions & 52 deletions khelo/lib/ui/flow/tournament/detail/tabs/tournament_detail_overview_tab.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,31 +15,26 @@ import 'package:style/text/app_text_style.dart';

import '../../../../../components/image_avatar.dart';

class TournamentDetailOverviewTab extends ConsumerStatefulWidget {
class TournamentDetailOverviewTab extends ConsumerWidget {
final TournamentModel tournament;
final PageController controller;

const TournamentDetailOverviewTab({
super.key,
required this.tournament,
required this.controller,
});

@override
ConsumerState<TournamentDetailOverviewTab> createState() =>
_TournamentDetailOverviewTabState();
}

class _TournamentDetailOverviewTabState
extends ConsumerState<TournamentDetailOverviewTab> {
@override
Widget build(BuildContext context) {
Widget build(BuildContext context, WidgetRef ref) {
return ListView(
padding: context.mediaQueryPadding.copyWith(top: 0) +
EdgeInsets.symmetric(horizontal: 16).copyWith(bottom: 40),
children: [
_featuredMatchesView(context, widget.tournament.matches),
_keyStatsView(context, widget.tournament.keyStats),
_teamsSquadsView(context, widget.tournament.teams),
_infoView(context, widget.tournament),
_featuredMatchesView(context, tournament.matches),
_keyStatsView(context, tournament.keyStats),
_teamsSquadsView(context, tournament.teams),
_infoView(context, tournament),
],
);
}
Expand All @@ -56,7 +51,7 @@ class _TournamentDetailOverviewTabState
title:
context.l10n.tournament_detail_overview_featured_matches_title,
showViewAll: matches.length > 3,
onViewAll: () {},
onViewAll: () => controller.jumpToPage(2),
),
...List.generate(
matches.take(3).length,
Expand All @@ -68,48 +63,56 @@ class _TournamentDetailOverviewTabState
}

Widget _matchCellView(BuildContext context, MatchModel match) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 24),
margin: EdgeInsets.symmetric(vertical: 8),
decoration: BoxDecoration(
color: context.colorScheme.surface,
borderRadius: BorderRadius.circular(16),
),
child: Row(
children: [
_buildTeamInfo(team: match.teams.first.team),
const Spacer(),
if (match.matchResult != null) ...[
WonByMessageText(
isTournament: true,
matchResult: match.matchResult,
),
] else ...[
Column(
children: [
Text(
match.start_at?.format(context, DateFormatType.time) ??
DateTime.now().format(context, DateFormatType.time),
style: AppTextStyle.caption
.copyWith(color: context.colorScheme.textDisabled),
),
Text(
match.start_at?.relativeTime(context) ??
DateTime.now().relativeTime(context),
style: AppTextStyle.subtitle2
.copyWith(color: context.colorScheme.textPrimary),
),
],
return OnTapScale(
onTap: () => AppRoute.matchDetailTab(matchId: match.id).push(context),
child: Container(
padding: EdgeInsets.symmetric(horizontal: 16, vertical: 24),
margin: EdgeInsets.symmetric(vertical: 8),
decoration: BoxDecoration(
color: context.colorScheme.surface,
borderRadius: BorderRadius.circular(16),
),
child: Row(
children: [
_buildTeamInfo(context, team: match.teams.first.team),
const Spacer(),
if (match.matchResult != null) ...[
WonByMessageText(
isTournament: true,
matchResult: match.matchResult,
),
] else ...[
Column(
children: [
Text(
match.start_at?.format(context, DateFormatType.time) ??
DateTime.now().format(context, DateFormatType.time),
style: AppTextStyle.caption
.copyWith(color: context.colorScheme.textDisabled),
),
Text(
match.start_at?.relativeTime(context) ??
DateTime.now().relativeTime(context),
style: AppTextStyle.subtitle2
.copyWith(color: context.colorScheme.textPrimary),
),
],
),
],
const Spacer(),
_buildTeamInfo(
context,
team: match.teams.last.team,
isSecond: true,
),
],
const Spacer(),
_buildTeamInfo(team: match.teams.last.team, isSecond: true),
],
),
),
);
}

Widget _buildTeamInfo({
Widget _buildTeamInfo(
BuildContext context, {
required TeamModel team,
bool isSecond = false,
}) {
Expand Down Expand Up @@ -162,7 +165,7 @@ class _TournamentDetailOverviewTabState
context,
showViewAll: keyStatsList.length > 4,
title: context.l10n.tournament_detail_overview_key_stats_title,
onViewAll: () {},
onViewAll: () => controller.jumpToPage(4),
),
const SizedBox(height: 8),
GridView.builder(
Expand Down Expand Up @@ -261,7 +264,7 @@ class _TournamentDetailOverviewTabState
context,
showViewAll: teams.length > 3,
title: context.l10n.tournament_detail_overview_teams_squads_title,
onViewAll: () {},
onViewAll: () => controller.jumpToPage(1),
),
const SizedBox(height: 8),
SizedBox(
Expand Down
52 changes: 43 additions & 9 deletions khelo/lib/ui/flow/tournament/detail/tournament_detail_screen.dart
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import 'dart:io';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:data/api/team/team_model.dart';
import 'package:data/api/tournament/tournament_model.dart';
Expand All @@ -17,6 +19,7 @@ import 'package:khelo/ui/flow/tournament/detail/tabs/tournament_detail_points_ta
import 'package:khelo/ui/flow/tournament/detail/tabs/tournament_detail_stats_tab.dart';
import 'package:khelo/ui/flow/tournament/detail/tabs/tournament_detail_teams_tab.dart';
import 'package:khelo/ui/flow/tournament/detail/tournament_detail_view_model.dart';
import 'package:style/button/action_button.dart';
import 'package:style/button/more_option_button.dart';
import 'package:style/button/tab_button.dart';
import 'package:style/extensions/context_extensions.dart';
Expand Down Expand Up @@ -111,13 +114,18 @@ class _TournamentDetailScreenState
pinned: true,
expandedHeight: 300,
backgroundColor: context.colorScheme.surface,
leading: _backButton(context),
flexibleSpace: _flexibleTitle(context, state.tournament!),
actions: state.tournament!.created_by == state.currentUserId ||
state.tournament!.members
.any((element) => element.id == state.currentUserId)
? [
moreOptionButton(
context,
size: 20,
backgroundColor: context
.colorScheme.containerHighOnSurface
.withOpacity(0.3),
onPressed: () => _moreActionButton(context, state),
),
]
Expand Down Expand Up @@ -145,6 +153,7 @@ class _TournamentDetailScreenState
children: [
TournamentDetailOverviewTab(
tournament: state.tournament!,
controller: _controller,
),
TournamentDetailTeamsTab(
onSelected: notifier.onTeamsSelected,
Expand Down Expand Up @@ -243,6 +252,19 @@ class _TournamentDetailScreenState
)
: null,
),
Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.transparent,
context.colorScheme.surface.withOpacity(0.2),
context.colorScheme.surface.withOpacity(0.8),
],
),
),
),
Positioned(
left: 16,
bottom: 24,
Expand Down Expand Up @@ -278,9 +300,7 @@ class _TournamentDetailScreenState
child: Text(
tournament.name,
style: AppTextStyle.header1.copyWith(
color: tournament.banner_img_url != null
? Colors.white
: context.colorScheme.textPrimary,
color: context.colorScheme.textPrimary,
),
overflow: TextOverflow.ellipsis,
textScaler: TextScaler.noScaling,
Expand All @@ -295,9 +315,7 @@ class _TournamentDetailScreenState
height: 24,
width: 24,
colorFilter: ColorFilter.mode(
tournament.banner_img_url != null
? Colors.white
: context.colorScheme.textPrimary,
context.colorScheme.textPrimary,
BlendMode.srcIn,
),
),
Expand All @@ -307,9 +325,7 @@ class _TournamentDetailScreenState
.start_date
.format(context, DateFormatType.dayMonth)),
style: AppTextStyle.body1.copyWith(
color: tournament.banner_img_url != null
? Colors.white
: context.colorScheme.textPrimary,
color: context.colorScheme.textPrimary,
),
),
],
Expand Down Expand Up @@ -359,4 +375,22 @@ class _TournamentDetailScreenState
),
]);
}

Widget _backButton(BuildContext context) {
return actionButton(context,
onPressed: context.pop,
icon: Container(
height: 28,
width: 28,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: context.colorScheme.containerHighOnSurface.withOpacity(0.3),
),
child: Icon(
Platform.isIOS ? Icons.arrow_back_ios : Icons.arrow_back,
size: 20,
color: context.colorScheme.textPrimary,
),
));
}
}
15 changes: 9 additions & 6 deletions khelo/lib/ui/flow/tournament/detail/tournament_detail_view_model.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ class TournamentDetailStateViewNotifier
loading: false,
);
onMatchFilter(null);
onStatFilter(null);
onStatFilter(state.selectedFilterTag);
}, onError: (e) {
state = state.copyWith(error: e, loading: false);
debugPrint(
Expand Down Expand Up @@ -116,13 +116,15 @@ class TournamentDetailStateViewNotifier
}
}

void onStatFilter(KeyStatFilterTag? tag) {
void onStatFilter(KeyStatFilterTag tag) {
if (state.tournament == null) return;

var filteredStats = state.tournament!.keyStats;

filteredStats = filteredStats.where((e) {
switch (tag) {
case KeyStatFilterTag.all:
return true;
case KeyStatFilterTag.runs:
return (e.stats.battingStat?.runScored ?? 0) > 0;
case KeyStatFilterTag.wickets:
Expand All @@ -143,8 +145,6 @@ class TournamentDetailStateViewNotifier
return (e.stats.battingStat?.fours ?? 0) +
(e.stats.battingStat?.sixes ?? 0) >
0;
case null:
return false;
}
}).toList();

Expand Down Expand Up @@ -176,7 +176,7 @@ class TournamentDetailStateViewNotifier

state = state.copyWith(
filteredStats: filteredStats,
selectedFilterTag: tag ?? state.selectedFilterTag,
selectedFilterTag: tag,
);
}

Expand Down Expand Up @@ -224,13 +224,14 @@ class TournamentDetailState with _$TournamentDetailState {
String? currentUserId,
@Default(null) String? matchFilter,
@Default([]) List<MatchModel> filteredMatches,
@Default(KeyStatFilterTag.runs) KeyStatFilterTag selectedFilterTag,
@Default(KeyStatFilterTag.all) KeyStatFilterTag selectedFilterTag,
@Default([]) List<PlayerKeyStat> filteredStats,
@Default([]) List<TeamPoint> teamPoints,
}) = _TournamentDetailState;
}

enum KeyStatFilterTag {
all,
runs,
wickets,
battingAverage,
Expand All @@ -243,6 +244,8 @@ enum KeyStatFilterTag {

String getString(BuildContext context) {
switch (this) {
case KeyStatFilterTag.all:
return context.l10n.key_stat_all;
case KeyStatFilterTag.runs:
return context.l10n.key_stat_filter_runs;
case KeyStatFilterTag.wickets:
Expand Down
2 changes: 1 addition & 1 deletion khelo/lib/ui/flow/tournament/detail/tournament_detail_view_model.freezed.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -249,7 +249,7 @@ class _$TournamentDetailStateImpl implements _TournamentDetailState {
this.currentUserId,
this.matchFilter = null,
final List<MatchModel> filteredMatches = const [],
this.selectedFilterTag = KeyStatFilterTag.runs,
this.selectedFilterTag = KeyStatFilterTag.all,
final List<PlayerKeyStat> filteredStats = const [],
final List<TeamPoint> teamPoints = const []})
: _filteredMatches = filteredMatches,
Expand Down
17 changes: 13 additions & 4 deletions style/lib/button/more_option_button.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,21 @@ Widget moreOptionButton(
Function()? onPressed,
double size = 24,
Color? tintColor,
Color? backgroundColor,
}) {
return actionButton(context,
onPressed: onPressed,
icon: Icon(
Platform.isIOS ? Icons.more_horiz_rounded : Icons.more_vert_rounded,
size: size,
color: tintColor ?? context.colorScheme.textPrimary,
icon: Container(
height: 28,
width: 28,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: backgroundColor ?? Colors.transparent,
),
child: Icon(
Platform.isIOS ? Icons.more_horiz_rounded : Icons.more_vert_rounded,
size: size,
color: tintColor ?? context.colorScheme.textPrimary,
),
));
}

0 comments on commit 489fa95

Please sign in to comment.