Skip to content

Commit

Permalink
Revert "Redesign home page header (#264)" (#266)
Browse files Browse the repository at this point in the history 
This reverts commit d0539b5.
  • Loading branch information
@nilsreichardt
nilsreichardt authored Oct 16, 2024
1 parent d0539b5 commit 4fd3a6e
Show file tree
Hide file tree
Showing 9 changed files with 152 additions and 206 deletions.
5 changes: 4 additions & 1 deletion lib/src/pages/home_page.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,13 @@ import 'package:ankigpt/src/pages/home_page/about_section.dart';
import 'package:ankigpt/src/pages/home_page/app_bar.dart';
import 'package:ankigpt/src/pages/home_page/demo_section.dart';
import 'package:ankigpt/src/pages/home_page/drag_zone.dart';
import 'package:ankigpt/src/pages/home_page/drawer.dart';
import 'package:ankigpt/src/pages/home_page/faq_section.dart';
import 'package:ankigpt/src/pages/home_page/input_section.dart';
import 'package:ankigpt/src/pages/home_page/my_decks_section.dart';
import 'package:ankigpt/src/pages/home_page/pricing_section.dart';
import 'package:ankigpt/src/pages/successful_payment_dialog.dart';
import 'package:ankigpt/src/pages/widgets/extensions.dart';
import 'package:ankigpt/src/pages/widgets/footer.dart';
import 'package:ankigpt/src/providers/cloud_firestore_provider.dart';
import 'package:ankigpt/src/providers/is_signed_in_provider.dart';
Expand Down Expand Up @@ -83,6 +85,8 @@ class _HomePage2State extends ConsumerState<HomePage> {
final isSignedIn = ref.watch(isSignedInProvider);
return SelectionArea(
child: Scaffold(
appBar: const HomePageAppBar2(),
drawer: context.isMobile ? const HomePageDrawer() : null,
body: DragZone(
child: SingleChildScrollView(
child: SafeArea(
Expand All @@ -96,7 +100,6 @@ class _HomePage2State extends ConsumerState<HomePage> {
),
child: Column(
children: [
const HomePageAppBar2(),
// const NewCard(),
const InputSection(),
const SizedBox(height: 50),
Expand Down
254 changes: 103 additions & 151 deletions lib/src/pages/home_page/app_bar.dart
View file
Original file line number Diff line number Diff line change
@@ -1,20 +1,25 @@
import 'package:ankigpt/src/pages/widgets/ankigpt_logo.dart';
import 'package:ankigpt/src/pages/widgets/account_page_icon_button.dart';
import 'package:ankigpt/src/pages/widgets/extensions.dart';
import 'package:ankigpt/src/providers/traction_provider.dart';
import 'package:ankigpt/src/pages/widgets/scroll_to.dart';
import 'package:ankigpt/src/pages/widgets/theme.dart';
import 'package:ankigpt/src/providers/has_plus_provider.dart';
import 'package:ankigpt/src/providers/home_page_scroll_view.dart';
import 'package:ankigpt/src/providers/is_signed_in_provider.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:number_slide_animation/number_slide_animation.dart';
import 'package:url_launcher/url_launcher.dart';

class HomePageAppBar2 extends StatelessWidget {
class HomePageAppBar2 extends ConsumerWidget implements PreferredSizeWidget {
const HomePageAppBar2({super.key});

@override
Widget build(BuildContext context) {
Size get preferredSize => const Size.fromHeight(kToolbarHeight);

@override
Widget build(BuildContext context, WidgetRef ref) {
return context.isMobile
? const _AppBarSmallScreen()
: const AppBarLargeScreen();
: const _AppBarLargeScreen();
}
}

Expand All @@ -23,182 +28,129 @@ class _AppBarSmallScreen extends StatelessWidget {

@override
Widget build(BuildContext context) {
return const Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
AccountPageButton(),
SizedBox(width: 12),
_MoreOptions(),
],
),
SizedBox(height: 12),
Center(child: _Title()),
SizedBox(height: 12),
_Traction(
crossAxisAlignment: CrossAxisAlignment.center,
return AppBar(
leading: SizedBox(
height: 1,
child: DrawerButton(
style: IconButton.styleFrom(
foregroundColor: blackGreen,
),
onPressed: () => Scaffold.of(context).openDrawer(),
),
),
centerTitle: true,
title: const SizedBox(
height: 40,
child: AnkiGptMembershipTextLogo(),
),
actions: const [
AccountPageIconButton(),
],
);
}
}

class AppBarLargeScreen extends StatelessWidget {
const AppBarLargeScreen({super.key});
class _AppBarLargeScreen extends ConsumerWidget {
const _AppBarLargeScreen();

@override
Widget build(BuildContext context) {
return const Padding(
padding: EdgeInsets.all(18),
child: Stack(
children: [
Positioned(
left: 0,
child: _Traction(),
),
Center(child: _Title()),
Positioned(
right: 0,
child: Row(
children: [
AccountPageButton(),
SizedBox(width: 12),
_MoreOptions(),
],
),
),
],
Widget build(BuildContext context, WidgetRef ref) {
final hasPlus = ref.watch(hasPlusProvider);
return AppBar(
leadingWidth: hasPlus ? 200 : 150,
leading: const Padding(
padding: EdgeInsets.only(left: 12, top: 6, bottom: 6),
child: AnkiGptMembershipTextLogo(),
),
centerTitle: true,
title: const _NavigationItems(),
actions: const [
AccountPageIconButton(),
],
);
}
}

class _Traction extends ConsumerWidget {
const _Traction({
this.crossAxisAlignment = CrossAxisAlignment.start,
});

final CrossAxisAlignment crossAxisAlignment;
class _NavigationItems extends ConsumerWidget {
const _NavigationItems();

@override
Widget build(BuildContext context, WidgetRef ref) {
final value = ref.watch(getTractionStreamIntProvider);
return Column(
crossAxisAlignment: crossAxisAlignment,
mainAxisSize: MainAxisSize.min,
children: [
Theme(
data: Theme.of(context).copyWith(
scrollbarTheme:
ScrollbarThemeData(thickness: WidgetStateProperty.all(0))),
child: AnimatedSwitcher(
duration: const Duration(milliseconds: 500),
key: ValueKey(value),
child: NumberSlideAnimation(
number: value.when(
data: (v) => '$v',
error: (e, s) => '0',
loading: () => '000000',
),
duration: const Duration(seconds: 4),
curve: Curves.easeOut,
textStyle: const TextStyle(
// color: Colors.white,
fontSize: 28,
fontWeight: FontWeight.w600,
),
final spaceBetweenItems = SizedBox(width: context.isDesktop ? 16 : 0);
final isSignedIn = ref.watch(isSignedInProvider);
return Theme(
data: Theme.of(context).copyWith(
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
textStyle: const TextStyle(
fontSize: 18,
color: Colors.white,
),
foregroundColor: blackGreen,
),
),
Text(
'Flashcards generated so far'.toUpperCase(),
style: TextStyle(
fontSize: 14,
color: DefaultTextStyle.of(context).style.color?.withOpacity(0.7),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
isSignedIn ? const _MyDecksButton() : const _DemoButton(),
spaceBetweenItems,
TextButton(
onPressed: () {
final key =
ref.read(homePageScrollViewProvider).pricingSectionKey;
scrollTo(context: context, key: key);
},
child: const Text('Pricing'),
),
textAlign: TextAlign.center,
),
],
spaceBetweenItems,
TextButton(
onPressed: () {
final key = ref.read(homePageScrollViewProvider).aboutSectionKey;
scrollTo(context: context, key: key);
},
child: const Text('About'),
),
spaceBetweenItems,
TextButton(
onPressed: () {
final key = ref.read(homePageScrollViewProvider).faqSectionKey;
scrollTo(context: context, key: key);
},
child: const Text('FAQ'),
),
],
),
);
}
}

class _MoreOptions extends StatelessWidget {
const _MoreOptions();
class _DemoButton extends ConsumerWidget {
const _DemoButton();

@override
Widget build(BuildContext context) {
return PopupMenuButton<int>(
icon: Container(
decoration: const BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
),
child: const Padding(
padding: EdgeInsets.all(8),
child: Icon(Icons.more_vert),
),
),
onSelected: (item) => _onSelected(context, item),
itemBuilder: (context) => [
const PopupMenuItem<int>(value: 0, child: Text('Support (WhatsApp)')),
const PopupMenuItem<int>(value: 1, child: Text('Privacy Policy')),
const PopupMenuItem<int>(value: 2, child: Text('Imprint')),
const PopupMenuItem<int>(value: 3, child: Text('Terms of Service')),
],
Widget build(BuildContext context, WidgetRef ref) {
return TextButton(
onPressed: () {
final key = ref.read(homePageScrollViewProvider).demoSectionKey;
scrollTo(context: context, key: key);
},
child: const Text('Demo'),
);
}

void _onSelected(BuildContext context, int item) {
switch (item) {
case 0:
_launchURL(context, Uri.parse('https://ankigpt.help/support'));
break;
case 1:
_launchURL(context, Uri.parse('https://ankigpt.help/privacy-policy'));
break;
case 2:
_launchURL(context, Uri.parse('/imprint'));
break;
case 3:
_launchURL(context, Uri.parse('https://ankigpt.help/terms-of-service'));
break;
}
}

void _launchURL(BuildContext context, Uri uri) async {
if (uri.scheme.isEmpty) {
context.go('$uri');
} else {
launchUrl(uri);
}
}
}

class _Title extends StatelessWidget {
const _Title();
class _MyDecksButton extends ConsumerWidget {
const _MyDecksButton();

@override
Widget build(BuildContext context) {
return Column(
mainAxisSize: MainAxisSize.min,
children: [
const Text(
'AnkiGPT',
style: TextStyle(
fontWeight: FontWeight.w600,
fontSize: 28,
),
),
Text(
'Turn lecture slides into flashcards'.toUpperCase(),
style: TextStyle(
fontSize: 14,
color: DefaultTextStyle.of(context).style.color?.withOpacity(0.7),
),
),
],
Widget build(BuildContext context, WidgetRef ref) {
return TextButton(
onPressed: () {
final key = ref.read(homePageScrollViewProvider).myDecksSectionKey;
scrollTo(context: context, key: key);
},
child: const Text('My Decks'),
);
}
}
Loading

0 comments on commit 4fd3a6e

Please sign in to comment.