1.8.0 - Game spinner (#156)

* renaming games to collection page * progress on getting the random game picker to work * progress on getting the game spinner working * adding filters header * adding spinner button and collection filters (wip) * adding collections filtering * fixing an issue with play history of games that were removed from all of the collections * adding empyt state * adding spinner selection dialog * slight refactor and fixing of icon ripple effect * fixing caching of the spinner images and putting constraints on it for larger screens
Progrunning · Dec 20, 2022 · 66afa3b · 66afa3b
1 parent 4d39924
commit 66afa3b
Show file tree

Hide file tree

Showing 48 changed files with 3,136 additions and 860 deletions.
diff --git a/board_games_companion/lib/common/animation_tags.dart b/board_games_companion/lib/common/animation_tags.dart
@@ -1,4 +1,5 @@
 class AnimationTags {
-  static const String boardGameHeroTag = 'boardGameDetalsImageHeroTag';
+  static const String boardGameHeroTag = 'boardGameDetailsImageHeroTag';
+  static const String gameSpinnerBoardGameHeroTag = 'gameSpinnerImageHeroTag';
   static const String playerImageHeroTag = 'playerHeroTag';
 }
diff --git a/board_games_companion/lib/common/app_styles.dart b/board_games_companion/lib/common/app_styles.dart
@@ -1,5 +1,8 @@
 import 'package:flutter/material.dart';
 
+import 'app_colors.dart';
+import 'app_theme.dart';
+
 class AppStyles {
   static const double _maxOpacityDecimal = 255;
   static const double _hundredPercent = 100;
@@ -35,4 +38,18 @@ class AppStyles {
   );
 
   static const double panelContainerCornerRadius = defaultCornerRadius * 3;
+
+  static const BoxDecoration tileGradientBoxDecoration = BoxDecoration(
+    gradient: LinearGradient(
+      begin: Alignment.topLeft,
+      end: Alignment.bottomRight,
+      stops: [0.2, 0.5, 0.9],
+      colors: [
+        AppColors.endDefaultPageBackgroundColorGradient,
+        AppColors.startDefaultPageBackgroundColorGradient,
+        AppColors.endDefaultPageBackgroundColorGradient,
+      ],
+    ),
+    borderRadius: AppTheme.defaultBorderRadius,
+  );
 }
diff --git a/board_games_companion/lib/common/app_text.dart b/board_games_companion/lib/common/app_text.dart
@@ -21,9 +21,13 @@ class AppText {
   static const dayBeforeYesteday = 'day before yesterday';
   static const daysAgoFormat = '%s days ago';
 
-  static const homePageGamesTabTitle = 'Games';
+  static const ownedCollectionToggleButtonText = 'Owned';
+  static const friendsCollectionToggleButtonText = 'Friends';
+  static const whishlistCollectionToggleButtonText = 'Whishlist';
+
+  static const homePageCollectionsTabTitle = 'Collections';
   static const homePageSearchTabTitle = 'Search';
-  static const homePageGamesHistoryTabTitle = 'Play History';
+  static const homePagePlaysTabTitle = 'Plays';
   static const homePageGamesPlayersTabTitle = 'Players';
 
   static const aboutPageAuthorSectionTitle = 'Author';
@@ -182,10 +186,6 @@ class AppText {
   static const settingsPageRestoreFailedMessage =
       'Unfortunately we ran into a problem with restoring your data. Please try again or contact support at [email protected]';
 
-  static const playHistoryPageEmptyTitle = "You haven't played any games yet";
-  static const playHistoryPageEmptyTextPartTwo =
-      'Start recording your plays in the app and this screen will automatically populate with a history of your playthroughs.';
-
   static const gamePlaytimeFormat = '%s min';
   static const gamePlayersSingularFormat = '%i players';
   static const gamePlayersPluralFormat = '%i players';
@@ -195,7 +195,28 @@ class AppText {
   static const collectionsPageTitle = 'Collections';
   static const settingsPageTitle = 'Settings';
   static const newPlayerPageTitle = 'New Player';
-  static const playHistoryPageTitle = 'Play History';
+  static const playsPageTitle = 'Plays';
+
+  static const playsPageHistoryTabEmptyTitle = "You haven't played any games yet";
+  static const playPageHistoryTabEmptySubtitle =
+      'Start recording your plays in the app and this screen will automatically populate with a history of your playthroughs.';
+
+  static const playsPageSelectGameTabEmptyTitle = 'Your collections are empty';
+  static const playsPageSelectGameTabEmptySubtitle =
+      'Add board games to your collection(s) by searching for them or by importing them from your BGG collection(s).';
+
+  static const playsPageSelectGameNoBoardGamesToShuffleTitle = "There's no games to select from";
+  static const playsPageSelectGameNoBoardGamesToShuffleSubtitle =
+      "There's no matches for the filters you picked. Refine them to spin the wheel.";
+
+  static const playsPageHistoryTabTitle = 'History';
+  static const playsPageStatisticsTabTitle = 'Stats';
+  static const playsPageSelectGameTabTitle = 'Select Game';
+  static const playsPageGameSpinnerFilterSectionTitle = 'Filters';
+  static const playsPageGameSpinnerCollectionsFilter = 'Collections';
+  static const playsPageGameSpinnerSpinButtonText = 'Spin';
+  static const playsPageGameSpinnerSelectedGamePlayButtonText = 'Play';
+  static const playsPageGameSpinnerSelectedGameSpinAgainButtonText = 'Spin Again';
 
   static const drawerVersionFormat = 'Version %s';
   static const drawerReleaseNotes = 'Release notes';

diff --git a/board_games_companion/lib/common/app_theme.dart b/board_games_companion/lib/common/app_theme.dart
@@ -22,7 +22,7 @@ class AppTheme {
     color: AppColors.secondaryTextColor,
   );
 
-  static const BorderRadius defaultBoxRadius = BorderRadius.all(
+  static const BorderRadius defaultBorderRadius = BorderRadius.all(
     Radius.circular(AppStyles.boardGameTileImageCircularRadius),
   );
 
@@ -119,6 +119,27 @@ class AppTheme {
       buttonTheme: ThemeData.light().buttonTheme.copyWith(
             buttonColor: AppColors.accentColor,
           ),
+      toggleButtonsTheme: ThemeData.light().toggleButtonsTheme.copyWith(
+            selectedColor: AppColors.accentColor,
+            color: AppColors.deselectedTabIconColor,
+            splashColor: AppColors.accentColor.withAlpha(AppStyles.opacity30Percent),
+            fillColor: Colors.transparent,
+            selectedBorderColor: Colors.transparent,
+            disabledBorderColor: Colors.transparent,
+            borderColor: Colors.transparent,
+            textStyle: TextStyle(
+              fontSize: Dimensions.smallFontSize,
+              color: MaterialStateColor.resolveWith(
+                (states) {
+                  if (states.contains(MaterialState.selected)) {
+                    return AppColors.accentColor;
+                  }
+
+                  return AppColors.deselectedTabIconColor;
+                },
+              ),
+            ),
+          ),
       textButtonTheme: TextButtonThemeData(
         style: TextButton.styleFrom(foregroundColor: AppColors.accentColor),
       ),

diff --git a/board_games_companion/lib/common/dimensions.dart b/board_games_companion/lib/common/dimensions.dart
@@ -26,6 +26,8 @@ class Dimensions {
   static const double collectionSearchResultBoardGameImageHeight = 100;
   static const double collectionSearchResultBoardGameImageWidth = 100;
 
+  static const double gameSpinnerSelectedGameImageHeight = 200;
+
   static const double collectionSearchResultExpansionsImageHeight = 80;
   static const double collectionSearchResultExpansionsImageWidth = 80;
 
@@ -60,6 +62,11 @@ class Dimensions {
 
   static const double detailsItemHeight = 60;
 
+  static const double gameSpinnerHeight = 300;
+  static const double gameSpinnerMaxWidth = 800;
+
+  static const double boardGameTileHeight = 200;
+
   static const EdgeInsets snackbarMargin = EdgeInsets.only(
     left: Dimensions.standardSpacing,
     right: Dimensions.standardSpacing,

diff --git a/board_games_companion/lib/common/enums/games_tab.dart b/board_games_companion/lib/common/enums/games_tab.dart
@@ -7,7 +7,7 @@ enum GamesTab {
 }
 
 extension ToGamesTab on int {
-  GamesTab toGamesTab() {
+  GamesTab toCollectionsTab() {
     switch (this) {
       case 0:
         return GamesTab.owned;

diff --git a/board_games_companion/lib/common/enums/plays_tab.dart b/board_games_companion/lib/common/enums/plays_tab.dart
@@ -0,0 +1,18 @@
+enum PlaysTab {
+  history,
+  statistics,
+  selectGame,
+}
+
+extension ToPlaysTab on int {
+  PlaysTab toPlaysTab() {
+    switch (this) {
+      case 0:
+        return PlaysTab.history;
+      case 1:
+        return PlaysTab.selectGame;
+    }
+
+    return PlaysTab.history;
+  }
+}
diff --git a/board_games_companion/lib/extensions/board_game_extentions.dart b/board_games_companion/lib/extensions/board_game_extentions.dart
@@ -0,0 +1,16 @@
+import 'package:board_games_companion/models/hive/board_game_details.dart';
+
+import '../common/enums/collection_type.dart';
+
+extension BoardGameDetailsExtensions on Iterable<BoardGameDetails> {
+  Iterable<BoardGameDetails> inCollection(CollectionType collectionType) {
+    switch (collectionType) {
+      case CollectionType.owned:
+        return where((boardGame) => boardGame.isOwned ?? false);
+      case CollectionType.friends:
+        return where((boardGame) => boardGame.isFriends ?? false);
+      case CollectionType.wishlist:
+        return where((boardGame) => boardGame.isOnWishlist ?? false);
+    }
+  }
+}
diff --git a/board_games_companion/lib/injectable.config.dart b/board_games_companion/lib/injectable.config.dart
diff --git a/board_games_companion/lib/models/hive/board_game_details.dart b/board_games_companion/lib/models/hive/board_game_details.dart
@@ -17,6 +17,8 @@ import 'board_game_publisher.dart';
 import 'board_game_rank.dart';
 import 'board_game_settings.dart';
 
+export '../../extensions/board_game_extentions.dart';
+
 part 'board_game_details.freezed.dart';
 part 'board_game_details.g.dart';
 

diff --git a/board_games_companion/lib/pages/base_page_state.dart b/board_games_companion/lib/pages/base_page_state.dart
@@ -47,7 +47,7 @@ abstract class BasePageState<T extends StatefulWidget> extends State<T> {
             ],
           ),
           elevation: Dimensions.defaultElevation,
-          actions: <Widget>[
+          actions: [
             TextButton(
               child: const Text(
                 AppText.aontAskAgain,