Merge pull request #7 from patelneel55/firebase-auth

Initialize Firebase with Flutter

frontend/memoree_client/.gitignore

@@ -44,3 +44,5 @@ app.*.map.json
 /android/app/debug
 /android/app/profile
 /android/app/release
+
+**secrets**

frontend/memoree_client/fonts/f2pub.py

@@ -0,0 +1,27 @@
+#!/env/python3
+
+import sys
+import sh
+
+folder = sys.argv[1]
+files = sh.ls("-1", folder, _iter=True)
+weight_mapping = {
+  'Thin': 100,
+  'ExtraLight': 200,
+  'Light': 300,
+  'Medium': 500,
+  'SemiBold': 600,
+  'Bold': 700,
+  'ExtraBold': 800,
+  'Black': 900,
+}
+
+for file in files:
+    file = str(file[:-1])
+    print("- asset: fonts/" + folder + "/" + file)
+    for key, value in weight_mapping.items():
+        if key in file:
+            print("  weight:", value)
+            break
+    if "Italic" in file:
+        print("  style: italic")

frontend/memoree_client/lib/themes.dart → frontend/memoree_client/lib/app/models/themes.dart

@@ -3,13 +3,13 @@ import 'package:flutter/material.dart';
 class AppTheme {
   AppTheme._();
 
-  static Color _iconColor = Colors.redAccent.shade200;
+  static Color _iconColor = Colors.black87;
 
   static const Color _lightPrimaryColor = Colors.white;
   static const Color _lightPrimaryVariantColor = Colors.white;
   static const Color _lightSecondaryColor = Colors.green;
-  static const Color _lightOnPrimaryColor = Colors.black;
-  static const String _fontFamily = "OpenSans";
+  static const Color _lightOnPrimaryColor = Color(0xff3c4043);
+  static const String _fontFamily = "Montserrat";
 
   static final ThemeData lightTheme = ThemeData(
     fontFamily: _fontFamily,

frontend/memoree_client/lib/app/models/user.dart

@@ -0,0 +1,16 @@
+import 'package:meta/meta.dart';
+
+@immutable
+class User {
+  final String uid;
+  final String email;
+  final String photoUrl;
+  final String displayName;
+
+  const User({
+    @required this.uid,
+    this.email,
+    this.photoUrl,
+    this.displayName
+  });
+}

frontend/memoree_client/lib/app/pages/app_scaffold.dart

@@ -0,0 +1,28 @@
+import 'package:flutter/material.dart';
+
+import 'package:memoree_client/app/pages/video_page.dart';
+import 'package:memoree_client/app/widgets/app_bar.dart';
+import 'package:memoree_client/app/widgets/drawer.dart';
+
+class AppScaffold extends StatelessWidget {
+  final String page;
+  const AppScaffold({Key key, this.page}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final bool isMobileLayout = MediaQuery.of(context).size.width < 600;
+    final bool isTabletLayout = MediaQuery.of(context).size.width < 1008;
+
+    return Scaffold(
+        appBar:
+            CustomAppBar(isMobile: isMobileLayout, isTablet: isTabletLayout),
+        drawer: isMobileLayout ? AppDrawer(isMobile: isMobileLayout,) : null,
+        body: SafeArea(
+            child: Container(
+                child: Row(children: <Widget>[
+          if (!isMobileLayout) AppDrawer(isMobile: isMobileLayout,),
+          Container(
+              child: Expanded(child: VideoPage()))
+        ]))));
+  }
+}

frontend/memoree_client/lib/app/pages/login.dart

@@ -0,0 +1,64 @@
+import 'package:flutter/material.dart';
+import 'package:memoree_client/app/services/firebase_auth.dart';
+import 'package:memoree_client/app/pages/app_scaffold.dart';
+import 'package:memoree_client/app/models/constants.dart';
+
+class LoginPage extends StatefulWidget {
+  @override
+  _LoginPageState createState() => _LoginPageState();
+}
+
+class _LoginPageState extends State<LoginPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: SafeArea(
+        child: Container(
+          child: Center(
+            child: Column(
+              mainAxisSize: MainAxisSize.max,
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: <Widget>[
+                Image(image: AssetImage("logos/memoree_logo.png"), height: 275,),
+                Text(PageTitles.appName, textScaleFactor: 2, style: TextStyle(color: Color(0xffb83b5e), letterSpacing: 1, fontWeight: FontWeight.w600),),
+                SizedBox(height: 50,),
+                OutlineButton(
+                  splashColor: Colors.grey,
+                  onPressed: () {
+                    FirebaseAuthService().signInWithGoogle().then((user) {
+                      if (user != null) {
+                        Navigator.of(context).pop();
+                        Navigator.of(context).push(MaterialPageRoute(
+                          builder: (context) {
+                            return AppScaffold(page: 'videos');
+                          },
+                        ),);
+                      }
+                    });
+                  },
+                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(40)),
+                  highlightElevation: 0,
+                  borderSide: BorderSide(color: Colors.grey),
+                  child: Padding(
+                    padding: const EdgeInsets.only(top: 10.0, bottom: 10.0),
+                    child: Row(
+                      mainAxisSize: MainAxisSize.min,
+                      mainAxisAlignment: MainAxisAlignment.center,
+                      children: <Widget>[
+                        Image(image: AssetImage("logos/google_logo.png"), height: 30.0),
+                        Padding(
+                          padding: const EdgeInsets.only(left: 10.0),
+                          child: Text("Sign in with Google")
+                        ),
+                      ],
+                    ),
+                  ),
+                ),
+              ]
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

frontend/memoree_client/lib/app/pages/video_page.dart

@@ -0,0 +1,54 @@
+import 'package:flutter/material.dart';
+
+import 'package:memoree_client/app/widgets/grid_results.dart';
+
+class VideoPage extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return FutureBuilder(
+      future: Future.delayed(Duration(seconds: 3)),
+      builder: (context, snapshot) {
+        switch(snapshot.connectionState) {
+          case ConnectionState.none:
+          case ConnectionState.waiting:
+            return Center(child: CircularProgressIndicator());
+            break;
+          case ConnectionState.active:
+          case ConnectionState.done:
+            return Padding(
+              padding: const EdgeInsets.only(top: 25.0),
+              child: Column(
+                children: <Widget>[
+                  Padding(
+                    padding: const EdgeInsets.fromLTRB(20.0, 5, 20, 0),
+                    child: Row(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: <Widget>[
+                        Expanded(
+                          flex: 9,
+                          child: Text("Results for: ", textScaleFactor: 1.5, style: TextStyle(fontWeight: FontWeight.w500),),
+                        ),
+                        Expanded(
+                          flex: 2,
+                          child: Text("98%", textAlign: TextAlign.right,)
+                        )
+                      ],
+                    ),
+                  ),
+                  Padding(
+                    padding: const EdgeInsets.only(top: 8.0),
+                    child: Divider(height: 1, thickness: 1.5,)
+                  ),
+                  Expanded(
+                    child: ContentGrid()
+                  ),
+                ],
+              )
+            );
+            break;
+        }
+        return Container();
+      }
+    );
+  }
+}

frontend/memoree_client/lib/app/services/firebase_auth.dart

@@ -0,0 +1,52 @@
+import 'package:firebase_auth/firebase_auth.dart' as auth;
+import 'package:firebase_core/firebase_core.dart';
+import 'package:google_sign_in/google_sign_in.dart';
+import 'package:memoree_client/app/models/user.dart';
+
+class FirebaseAuthService {
+  final auth.FirebaseAuth _firebaseAuth;
+  final GoogleSignIn _googleSignIn;
+
+  FirebaseAuthService({auth.FirebaseAuth firebaseAuth, GoogleSignIn googleSignin})
+      : _firebaseAuth = firebaseAuth ?? auth.FirebaseAuth.instance,
+        _googleSignIn = googleSignin ?? GoogleSignIn();
+
+  User _userFromFirebase(auth.User user) {
+    if (user == null) {
+      return null;
+    }
+    return User(
+      uid: user.uid,
+      email: user.email,
+      displayName: user.displayName,
+      photoUrl: user.photoURL,
+    );
+  }
+
+  Stream<User> get onAuthStateChanged {
+    return _firebaseAuth.authStateChanges().map(_userFromFirebase);
+  }
+
+  Future<User> signInWithGoogle() async {
+    await Firebase.initializeApp();
+
+    final googleUser = await _googleSignIn.signIn();
+    final googleAuth = await googleUser.authentication;
+    final credential = auth.GoogleAuthProvider.credential(
+      accessToken: googleAuth.accessToken,
+      idToken: googleAuth.idToken,
+    );
+    final authResult = await _firebaseAuth.signInWithCredential(credential);
+    return _userFromFirebase(authResult.user);
+  }
+
+  Future<void> signOut() async {
+    await _googleSignIn.disconnect();
+    return _firebaseAuth.signOut();
+  }
+
+  Future<User> currentUser() async {
+    final user = _firebaseAuth.currentUser;
+    return _userFromFirebase(user);
+  }
+}

frontend/memoree_client/lib/app/widgets/account_info.dart

@@ -0,0 +1,72 @@
+import 'package:flutter/material.dart';
+
+import 'package:memoree_client/app/pages/login.dart';
+import 'package:memoree_client/app/services/firebase_auth.dart';
+
+class AccountInfo extends StatefulWidget {
+  @override
+  _AccountInfoState createState() => _AccountInfoState();
+}
+
+class _AccountInfoState extends State<AccountInfo> {
+  @override
+  Widget build(BuildContext context) {
+    return FutureBuilder(
+      future: FirebaseAuthService().currentUser(),
+      builder: (context, snapshot) {
+        switch (snapshot.connectionState) {
+          case ConnectionState.none:
+          case ConnectionState.waiting:
+            return Padding(
+              padding: const EdgeInsets.all(20.0),
+              child: Center(child: CircularProgressIndicator()), 
+            ); 
+            break;
+          case ConnectionState.active:
+          case ConnectionState.done:
+            return Padding(
+              padding: const EdgeInsets.all(20.0),
+              child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: <Widget>[
+                    CircleAvatar(
+                      radius: 35,
+                      child: ClipOval(
+                        child: Image.network(snapshot.data.photoUrl, fit: BoxFit.cover)
+                      ),
+                    ),
+                    SizedBox(height: 20,),
+                    Text(snapshot.data.displayName, textScaleFactor: 1.25),
+                    Text(snapshot.data.email, style: TextStyle(color: Colors.black54,)),
+                    SizedBox(height: 20,),
+                    Divider(thickness: 1,),
+                    SizedBox(height: 15,),
+                    OutlineButton(
+                      // padding: const EdgeInsets.only(top: 20.0),
+                      splashColor: Colors.grey,
+                      onPressed: () async {
+                        await FirebaseAuthService().signOut();
+                        Navigator.of(context).pop();
+                        Navigator.of(context).push(MaterialPageRoute(
+                          builder: (context) {
+                            return LoginPage();
+                          }));
+                      },
+                      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(2)),
+                      highlightElevation: 0,
+                      borderSide: BorderSide(color: Colors.grey),
+                      child: Padding(
+                        padding: const EdgeInsets.all(10),
+                        child: Text("Sign out", textScaleFactor: 1.1,)
+                      ),
+                    ),
+                  ],
+              ),
+            );
+            break;
+        }
+        return Center();
+      }
+    );
+  }
+}