Skip to content

Commit

Permalink
Home page update (#353)
Browse files Browse the repository at this point in the history 
* Implement search change

* Color and padding changes and add InkWell

* Some bugs are fixed about home page

---------

Co-authored-by: mehmetSuzer <mehmet.suzer@boun.edu.tr>
  • Loading branch information
@omerfaunal
omerfaunal and mehmetSuzer authored Oct 30, 2023
1 parent e3b44df commit 33f5a48
Show file tree
Hide file tree
Showing 8 changed files with 199 additions and 181 deletions.
Empty file removed project/FrontEnd/collaborative_science_platform/lib/helpers/.gitkeep
View file
Empty file.
5 changes: 5 additions & 0 deletions project/FrontEnd/collaborative_science_platform/lib/helpers/search_helper.dart
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import 'package:collaborative_science_platform/widgets/app_search_bar.dart';

class SearchHelper {
static SearchType searchType = SearchType.theorem;
}
8 changes: 2 additions & 6 deletions project/FrontEnd/collaborative_science_platform/lib/models/small_node.dart
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,3 @@

import 'package:collaborative_science_platform/models/account.dart';
import 'package:collaborative_science_platform/models/basic_user.dart';
import 'package:collaborative_science_platform/models/contributor_user.dart';

class SmallNode {
int nodeId;
String nodeTitle;
Expand All @@ -23,7 +18,8 @@ class SmallNode {
nodeId: 0,
nodeTitle: "Lorem Ipsum $id",
contributors: ["Marcus Tullius Cicero", "Jesus Christ", "Remus", "Romulus", "Julius Caesar"],
theorem: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
theorem:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
publishDate: DateTime(1989, 10, 29, 8, 0, 0),
);
}
Expand Down
92 changes: 63 additions & 29 deletions project/FrontEnd/collaborative_science_platform/lib/screens/home_page/home_page.dart
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import 'package:collaborative_science_platform/helpers/search_helper.dart';
import 'package:collaborative_science_platform/models/profile_data.dart';
import 'package:collaborative_science_platform/models/small_node.dart';
import 'package:collaborative_science_platform/screens/home_page/home_page_appbar.dart';
Expand All @@ -21,7 +22,7 @@ class HomePage extends StatefulWidget {
class _HomePageState extends State<HomePage> {
final searchBarController = TextEditingController();
final searchBarFocusNode = FocusNode();
bool searchBarActive = false;
SearchType searchType = SearchHelper.searchType;

@override
void dispose() {
Expand All @@ -30,14 +31,19 @@ class _HomePageState extends State<HomePage> {
super.dispose();
}

void search(SearchType searchType) { }
void search() {
setState(() {
searchType = SearchHelper.searchType;
});
}

@override
Widget build(BuildContext context) {
return MobileHomePage(
searchBarFocusNode: searchBarFocusNode,
searchBarController: searchBarController,
onSearch: search,
searchType: searchType,
);
}
}
Expand All @@ -54,24 +60,26 @@ class DesktopMobilePage extends StatelessWidget {
class MobileHomePage extends StatelessWidget {
final FocusNode searchBarFocusNode;
final TextEditingController searchBarController;
final Function(SearchType) onSearch;
final Function onSearch;
final SearchType searchType;

const MobileHomePage({
super.key,
required this.searchBarFocusNode,
required this.searchBarController,
required this.onSearch,
required this.searchType,
});

@override
Widget build(BuildContext context) {
return PageWithAppBar(
appBar: const HomePageAppBar(),
child: SizedBox(
width: Responsive.getGenericPageWidth(context),
child: SingleChildScrollView(
primary: false,
scrollDirection: Axis.vertical,
child: SingleChildScrollView(
primary: false,
scrollDirection: Axis.vertical,
child: SizedBox(
width: Responsive.getGenericPageWidth(context),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
Expand All @@ -86,27 +94,7 @@ class MobileHomePage extends StatelessWidget {
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: ListView.builder(
physics: const NeverScrollableScrollPhysics(), // Prevents a conflict with SingleChildScrollView
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: 10,
itemBuilder: (context, index) {
return HomePageUserCard(
profileData: ProfileData.getLoremIpsum(index+1),
onTap: () { /* Navigate to the Profile Page of the User */ },
color: AppColors.primaryLightColor,
profilePagePath: (index % 2 == 0) ? "assets/images/gumball.jpg" : null,
);

/*
return HomePageNodeCard(
smallNode: SmallNode.getLoremIpsum(index+1),
onTap: () { /* Navigate to the Screen of the Node */ },
);
*/
},
),
child: (searchType == SearchType.theorem) ? const NodeCards() : const UserCards(),
),
],
),
Expand All @@ -115,3 +103,49 @@ class MobileHomePage extends StatelessWidget {
);
}
}

class NodeCards extends StatelessWidget {
const NodeCards({
super.key,
});

@override
Widget build(BuildContext context) {
return ListView.builder(
physics: const NeverScrollableScrollPhysics(), // Prevents a conflict with SingleChildScrollView
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: 10,
itemBuilder: (context, index) {
return HomePageNodeCard(
smallNode: SmallNode.getLoremIpsum(index + 1),
onTap: () {/* Navigate to the Screen of the Node */},
);
},
);
}
}

class UserCards extends StatelessWidget {
const UserCards({
super.key,
});

@override
Widget build(BuildContext context) {
return ListView.builder(
physics: const NeverScrollableScrollPhysics(), // Prevents a conflict with SingleChildScrollView
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemCount: 10,
itemBuilder: (context, index) {
return HomePageUserCard(
profileData: ProfileData.getLoremIpsum(index + 1),
onTap: () {/* Navigate to the Profile Page of the User */},
color: AppColors.primaryLightColor,
profilePagePath: "assets/images/gumball.jpg",
);
},
);
}
}
104 changes: 51 additions & 53 deletions ...End/collaborative_science_platform/lib/screens/home_page/widgets/home_page_node_card.dart
View file
Original file line number Diff line number Diff line change
@@ -1,78 +1,76 @@

import 'package:collaborative_science_platform/helpers/date_to_string.dart';
import 'package:collaborative_science_platform/models/small_node.dart';
import 'package:flutter/material.dart';

class HomePageNodeCard extends StatelessWidget {
final SmallNode smallNode;
final Color color;
final Color? color;
final Function() onTap;

const HomePageNodeCard({
super.key,
required this.smallNode,
required this.color,
this.color,
required this.onTap,
});

@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: MouseRegion(
cursor: SystemMouseCursors.click,
child: GestureDetector(
onTap: onTap, // Navigate to the Screen of the Node
child: Card(
color: color,
elevation: 4.0,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
return Card(
elevation: 4.0,
margin: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.0),
),
child: InkWell(
onTap: onTap, // Navigate to the screen of the Node
customBorder: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8.0),
),
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
smallNode.nodeTitle,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18.0,
),
),
const SizedBox(height: 8.0),
Text(
smallNode.contributors.join(", "),
style: const TextStyle(
fontWeight: FontWeight.w600,
fontSize: 14.0,
color: Colors.grey,
),
),
const SizedBox(height: 8.0),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Row(
children: [
Flexible(
child: Text(
smallNode.nodeTitle,
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: const TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16.0,
),
),
),
const SizedBox(width: 10.0),
Text(
getDurationFromNow(smallNode.publishDate),
style: TextStyle(
color: Colors.grey.shade600,
fontWeight: FontWeight.bold,
),
),
],
),
Text(
smallNode.contributors.join(", "),
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontWeight: FontWeight.w700,
fontSize: 14.0,
color: Colors.grey.shade600,
getDurationFromNow(smallNode.publishDate),
style: const TextStyle(
color: Colors.grey,
fontWeight: FontWeight.w600,
),
),
Text(
smallNode.theorem,
maxLines: 4,
overflow: TextOverflow.ellipsis,
),
],
),
),
// SizedBox(height: 12.0),
// Text(
// smallNode.theorem,
// maxLines: 4,
// overflow: TextOverflow.ellipsis,
// style: TextStyle(
// fontSize: 14.0,
// ),
// ),
],
),
),
),
Expand Down
Loading

0 comments on commit 33f5a48

Please sign in to comment.