diff --git a/game/lib/achievements/achievement_cell.dart b/game/lib/achievements/achievement_cell.dart index 96c268c8..d7eebafc 100644 --- a/game/lib/achievements/achievement_cell.dart +++ b/game/lib/achievements/achievement_cell.dart @@ -40,7 +40,7 @@ class _AchievementCellState extends State { onTap: () async {}, child: Container( width: MediaQuery.sizeOf(context).width * 0.85, - height: MediaQuery.sizeOf(context).height * 0.11, + height: MediaQuery.sizeOf(context).height * 0.105, //padding: EdgeInsets.all(5), decoration: BoxDecoration( color: Colors.white, @@ -67,6 +67,7 @@ class _AchievementCellState extends State { alignment: Alignment.centerLeft, child: Container( width: MediaQuery.sizeOf(context).width * 0.45, + padding: EdgeInsets.only(top: 2), child: Text( description, maxLines: 2, diff --git a/game/lib/profile/completed_cell.dart b/game/lib/profile/completed_cell.dart index 1d145e82..6c652f41 100644 --- a/game/lib/profile/completed_cell.dart +++ b/game/lib/profile/completed_cell.dart @@ -22,7 +22,7 @@ Widget completedCell( int points) { return Container( width: MediaQuery.sizeOf(context).width * 0.85, - height: MediaQuery.sizeOf(context).height * 0.11, + height: MediaQuery.sizeOf(context).height * 0.105, decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(10.0), @@ -38,7 +38,7 @@ Widget completedCell( Padding( padding: const EdgeInsets.all(10), child: ClipRRect( - borderRadius: BorderRadius.circular(20), + borderRadius: BorderRadius.circular(10), child: Image( width: 64, height: 64, @@ -64,9 +64,13 @@ Widget completedCell( children: [ Text( "From " + type + " - ", - style: TextStyle(color: Colors.grey, fontSize: 12), + style: TextStyle( + color: Colors.grey, + fontSize: 12, + fontWeight: FontWeight.w600), ), - Text(date) + Text(date, + style: TextStyle(color: Colors.black, fontSize: 12)) ], ), Padding( diff --git a/game/lib/profile/profile_page.dart b/game/lib/profile/profile_page.dart index 557321e9..b5360f17 100644 --- a/game/lib/profile/profile_page.dart +++ b/game/lib/profile/profile_page.dart @@ -32,246 +32,259 @@ class _ProfilePageState extends State { Widget build(BuildContext context) { return Scaffold( backgroundColor: Color.fromARGB(255, 255, 245, 234), - body: SafeArea(child: Container( - child: Consumer5( - builder: (context, userModel, eventModel, trackerModel, - challengeModel, achModel, child) { - if (userModel.userData == null) { - return Center( - child: CircularProgressIndicator(), - ); - } + body: SafeArea( + child: SingleChildScrollView(child: Container( + child: Consumer5( + builder: (context, userModel, eventModel, trackerModel, + challengeModel, achModel, child) { + if (userModel.userData == null) { + return Center( + child: CircularProgressIndicator(), + ); + } - final achList = achModel.getAvailableTrackerPairs(); - var username = userModel.userData?.username; - var isGuest = userModel.userData?.authType == UserAuthTypeDto.device; - var score = userModel.userData?.score; + final achList = achModel.getAvailableTrackerPairs(); + var username = userModel.userData?.username; + var isGuest = + userModel.userData?.authType == UserAuthTypeDto.device; + var score = userModel.userData?.score; - List> completedEvents = []; + List> completedEvents = []; - //Get completed events - for (var eventId in userModel.userData!.trackedEvents!) { - if (completedEvents.length == 2) break; + //Get completed events + for (var eventId in userModel.userData!.trackedEvents!) { + if (completedEvents.length == 2) break; - var tracker = trackerModel.trackerByEventId(eventId); - EventDto? event = eventModel.getEventById(eventId); + var tracker = trackerModel.trackerByEventId(eventId); + EventDto? event = eventModel.getEventById(eventId); - if (tracker == null || event == null) { - continue; - } - if (tracker.prevChallenges.length != event.challenges!.length) { - continue; - } + if (tracker == null || event == null) { + continue; + } + if (tracker.prevChallenges.length != event.challenges!.length) { + continue; + } - try { - // prevChallenges.last will throw StateError if prevChallenges - // is empty, meaning the challenge was not completed properly - var completedDate = tracker.prevChallenges.last.dateCompleted; - DateTime date = - DateFormat("E, d MMM y HH:mm:ss").parse(completedDate); - int totalHintsUsed = 0; - for (var prev in tracker.prevChallenges) { - totalHintsUsed += prev.hintsUsed; + try { + // prevChallenges.last will throw StateError if prevChallenges + // is empty, meaning the challenge was not completed properly + var completedDate = tracker.prevChallenges.last.dateCompleted; + DateTime date = + DateFormat("E, d MMM y HH:mm:ss").parse(completedDate); + int totalHintsUsed = 0; + for (var prev in tracker.prevChallenges) { + totalHintsUsed += prev.hintsUsed; + } + completedEvents.add(Tuple3( + date, event, totalHintsUsed)); + } catch (e) { + displayToast("Error with completing challenge", Status.error); } - completedEvents.add( - Tuple3(date, event, totalHintsUsed)); - } catch (e) { - displayToast("Error with completing challenge", Status.error); } - } - //Sort so that the most recent events are first - completedEvents.sort((a, b) => b.item1.compareTo(a.item1)); - return Column( - children: [ - Stack(fit: StackFit.passthrough, children: [ - Center( - child: Container( - height: 160, - padding: EdgeInsets.only(top: 30), - child: Stack( - children: [ - Center( - child: SvgPicture.asset("assets/images/bear_prof.svg", - height: 100, width: 100), - ), - Align( - alignment: Alignment.bottomCenter, - child: Container( - height: 30, - width: 100, - padding: EdgeInsets.all(5.0), - decoration: BoxDecoration( - color: Color.fromARGB(255, 246, 228, 201), - borderRadius: BorderRadius.circular(15.0), - ), - child: Center( - child: Text( - score.toString() + " points", - style: TextStyle( - color: Colors.black, - fontWeight: FontWeight.w500, + //Sort so that the most recent events are first + completedEvents.sort((a, b) => b.item1.compareTo(a.item1)); + return Column( + children: [ + Stack(fit: StackFit.passthrough, children: [ + Center( + child: Container( + height: 180, + padding: EdgeInsets.only(top: 30), + child: Stack( + alignment: Alignment + .center, // Central alignment within the stack + children: [ + Positioned( + top: 0, // Adjust this value to move SVG up or down + child: SvgPicture.asset( + "assets/images/bear_prof.svg", + height: 100, + width: 100), + ), + Positioned( + bottom: 35, + child: Container( + height: 30, + width: 100, + padding: EdgeInsets.all(5.0), + decoration: BoxDecoration( + color: Color.fromARGB(255, 246, 228, 201), + borderRadius: BorderRadius.circular(15.0), + ), + child: Center( + child: Text( + score.toString() + " points", + style: TextStyle( + color: Colors.black, + fontWeight: FontWeight.w500, + ), ), ), ), ), - ), - ], + Positioned( + bottom: 0, + child: Text( + username!, + style: TextStyle( + fontSize: 20, fontWeight: FontWeight.bold), + ), + ) + ], + ), ), ), - ), - Positioned.directional( - textDirection: TextDirection.rtl, - start: 10, - // top: 22, - child: Padding( - padding: const EdgeInsets.only(top: 10, right: 20), - child: IconButton( - alignment: Alignment.topRight, - icon: Icon(Icons.settings, size: 40), + Positioned.directional( + textDirection: TextDirection.rtl, + start: 10, + // top: 22, + child: Padding( + padding: const EdgeInsets.only(top: 0, right: 20), + child: IconButton( + alignment: Alignment.topRight, + icon: Icon(Icons.settings, size: 40), + onPressed: () { + Navigator.push( + context, + MaterialPageRoute( + builder: (context) => + SettingsPage(isGuest))); + }), + ), + ), + ]), + //Completed Events + Padding( + padding: + const EdgeInsets.only(left: 28, right: 23.0, top: 14.0), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Text("Completed", + style: TextStyle( + fontSize: 16, fontWeight: FontWeight.bold)), + TextButton( onPressed: () { Navigator.push( context, MaterialPageRoute( - builder: (context) => SettingsPage(isGuest))); - }), - ), - ), - ]), - Padding( - padding: const EdgeInsets.all(5.0), - child: Text( - username!, - style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold), - ), - ), - //Completed Events - Padding( - padding: const EdgeInsets.only(left: 24, right: 24.0), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Text("Completed", - style: TextStyle( - fontSize: 16, fontWeight: FontWeight.bold)), - TextButton( - onPressed: () { - Navigator.push( - context, - MaterialPageRoute( - builder: (context) => CompletedFeedWidget())); - }, - child: Text( - 'View More →', - style: TextStyle( - color: Colors.black, - fontSize: 14.0, + builder: (context) => CompletedFeedWidget())); + }, + child: Text( + 'View All →', + style: TextStyle( + color: Colors.black, + fontSize: 14.0, + ), ), - ), - ) - ], + ) + ], + ), ), - ), - SizedBox( - height: MediaQuery.sizeOf(context).height * 0.25, - width: MediaQuery.sizeOf(context).width * 0.85, - child: ListView.separated( - itemCount: 2, - itemBuilder: (context, index) { - if (index >= completedEvents.length) { - return Container(); - } - var date = completedEvents[index].item1; - var event = completedEvents[index].item2; - var hintsUsed = completedEvents[index].item3; - String formattedDate = DateFormat("MMMM d, y").format(date); - var type = - event.challenges!.length > 1 ? "Journeys" : "Challenge"; + SizedBox( + height: MediaQuery.sizeOf(context).height * 0.24, + width: MediaQuery.sizeOf(context).width * 0.85, + child: ListView.separated( + itemCount: 2, + itemBuilder: (context, index) { + if (index >= completedEvents.length) { + return Container(); + } + var date = completedEvents[index].item1; + var event = completedEvents[index].item2; + var hintsUsed = completedEvents[index].item3; + String formattedDate = + DateFormat("MMMM d, y").format(date); + var type = event.challenges!.length > 1 + ? "Journeys" + : "Challenge"; - // Calculate totalPoints. - var totalPoints = 0; - var locationImage; - for (var challengeId in event.challenges ?? []) { - var challenge = - challengeModel.getChallengeById(challengeId); - locationImage = challenge?.imageUrl; - if (locationImage == null || locationImage.length == 0) - locationImage = - "https://upload.wikimedia.org/wikipedia/commons/b/b1/Missing-image-232x150.png"; - if (challenge != null) { - totalPoints += challenge.points ?? 0; + // Calculate totalPoints. + var totalPoints = 0; + var locationImage; + for (var challengeId in event.challenges ?? []) { + var challenge = + challengeModel.getChallengeById(challengeId); + locationImage = challenge?.imageUrl; + if (locationImage == null || locationImage.length == 0) + locationImage = + "https://upload.wikimedia.org/wikipedia/commons/b/b1/Missing-image-232x150.png"; + if (challenge != null) { + totalPoints += challenge.points ?? 0; + } } - } - return completedCell( - context, - event.name!, - locationImage, - type, - formattedDate, - friendlyDifficulty[event.difficulty]!, - hintsUsed, - totalPoints); - }, - physics: BouncingScrollPhysics(), - separatorBuilder: (context, index) { - return SizedBox(height: 10); - }, + return completedCell( + context, + event.name!, + locationImage, + type, + formattedDate, + friendlyDifficulty[event.difficulty]!, + hintsUsed, + totalPoints); + }, + physics: BouncingScrollPhysics(), + separatorBuilder: (context, index) { + return SizedBox(height: 10); + }, + ), ), - ), - Padding( - padding: const EdgeInsets.only(left: 24, right: 24), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - crossAxisAlignment: CrossAxisAlignment.center, - children: [ - Text("Achievements", - style: TextStyle( - fontSize: 16, fontWeight: FontWeight.bold)), - TextButton( - onPressed: () { - // Handle button press, e.g., navigate to details page - Navigator.of(context).push(MaterialPageRoute( - builder: (context) => AchievementsPage())); - }, - child: Text( - 'View Details →', - style: TextStyle( - color: Colors.black, - fontSize: 14.0, + Padding( + padding: const EdgeInsets.only(left: 30, right: 23), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Text("Achievements", + style: TextStyle( + fontSize: 16, fontWeight: FontWeight.bold)), + TextButton( + onPressed: () { + // Handle button press, e.g., navigate to details page + Navigator.of(context).push(MaterialPageRoute( + builder: (context) => AchievementsPage())); + }, + child: Text( + 'View Details →', + style: TextStyle( + color: Colors.black, + fontSize: 14.0, + ), ), - ), - ) - ], + ) + ], + ), ), - ), - //To be replaced with real data - Padding( - padding: EdgeInsets.only(left: 30, right: 30), - child: Column( - children: (achList - .sortedBy((a, b) => (a - .$1.progress / // least completed first - (a.$2.requiredPoints ?? 1)) - .compareTo( - b.$1.progress / (b.$2.requiredPoints ?? 1))) - .take(2) - .map((e) => ([ - AchievementCell( - e.$2.description ?? "", - SvgPicture.asset( - "assets/icons/achievementsilver.svg"), - e.$1.progress, - e.$2.requiredPoints ?? 0), - SizedBox(height: 10), - ])) - .expand((el) => el) - .toList()))), - ], - ); - }), - )), + //To be replaced with real data + Padding( + padding: EdgeInsets.only(left: 30, right: 30), + child: Column( + children: (achList + .sortedBy((a, b) => (a + .$1.progress / // least completed first + (a.$2.requiredPoints ?? 1)) + .compareTo( + b.$1.progress / (b.$2.requiredPoints ?? 1))) + .take(2) + .map((e) => ([ + AchievementCell( + e.$2.description ?? "", + SvgPicture.asset( + "assets/icons/achievementsilver.svg"), + e.$1.progress, + e.$2.requiredPoints ?? 0), + SizedBox(height: 10), + ])) + .expand((el) => el) + .toList()))), + ], + ); + }), + )), + ), ); } }