Add an experimental Login page

Code adapted from https://github.com/TheAlphamerc/flutter_login_signup

assets/langs/en.yaml

@@ -76,6 +76,7 @@ settings:
     fs: Show File System
     markdownToolbar: Show Markdown Toolbar in Editor
     graphView: Graph View
+    accounts: Platform Independent Accounts
   editors:
     title: Editor Settings
     subtitle: Configure how different editors work

lib/app_router.dart

@@ -9,6 +9,7 @@ import 'package:gitjournal/screens/filesystem_screen.dart';
 import 'package:gitjournal/screens/folder_listing.dart';
 import 'package:gitjournal/screens/graph_view.dart';
 import 'package:gitjournal/screens/home_screen.dart';
+import 'package:gitjournal/screens/login_screen.dart';
 import 'package:gitjournal/screens/note_editor.dart';
 import 'package:gitjournal/screens/onboarding_screens.dart';
 import 'package:gitjournal/screens/purchase_screen.dart';
@@ -96,6 +97,8 @@ class AppRouter {
         return GraphViewScreen();
       case '/settings':
         return SettingsScreen();
+      case '/login':
+        return LoginPage();
       case '/setupRemoteGit':
         return GitHostSetupScreen(
           repoFolderName: settings.folderName,

lib/app_settings.dart

@@ -33,6 +33,7 @@ class AppSettings extends ChangeNotifier {
   var experimentalMarkdownToolbar = false;
   var experimentalGraphView = false;
   var experimentalZeroConf = false;
+  var experimentalAccounts = false;
 
   var appVersion = "";
 
@@ -63,6 +64,8 @@ class AppSettings extends ChangeNotifier {
         pref.getBool("experimentalGraphView") ?? experimentalGraphView;
     experimentalZeroConf =
         pref.getBool("experimentalZeroConf") ?? experimentalZeroConf;
+    experimentalAccounts =
+        pref.getBool("experimentalAccounts") ?? experimentalAccounts;
 
     appVersion = pref.getString("appVersion") ?? "";
   }
@@ -89,6 +92,8 @@ class AppSettings extends ChangeNotifier {
         defaultSet.experimentalGraphView);
     _setBool(pref, "experimentalZeroConf", experimentalZeroConf,
         defaultSet.experimentalZeroConf);
+    _setBool(pref, "experimentalAccounts", experimentalAccounts,
+        defaultSet.experimentalAccounts);
 
     pref.setInt("appSettingsVersion", version);
     pref.setString("appVersion", appVersion);
@@ -110,6 +115,7 @@ class AppSettings extends ChangeNotifier {
       'experimentalMarkdownToolbar': experimentalMarkdownToolbar.toString(),
       'experimentalGraphView': experimentalGraphView.toString(),
       'experimentalZeroConf': experimentalZeroConf.toString(),
+      'experimentalAccounts': experimentalAccounts.toString(),
     };
   }
 

lib/screens/login_screen.dart

@@ -0,0 +1,309 @@
+/*
+  Code adapted from https://github.com/TheAlphamerc/flutter_login_signup/
+
+  MIT License
+
+  Copyright (c) 2020 Sonu Sharma
+
+  Permission is hereby granted, free of charge, to any person obtaining a copy
+  of this software and associated documentation files (the "Software"), to deal
+  in the Software without restriction, including without limitation the rights
+  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+  copies of the Software, and to permit persons to whom the Software is
+  furnished to do so, subject to the following conditions:
+
+  The above copyright notice and this permission notice shall be included in all
+  copies or substantial portions of the Software.
+
+  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+  SOFTWARE.
+*/
+
+/*
+  All Modifications are Licensed under -
+    GNU AFFERO GENERAL PUBLIC LICENSE
+    Copyright (c) 2020 Vishesh Handa
+  See the LICENSE file
+*/
+
+import 'package:flutter/material.dart';
+
+import 'package:google_fonts/google_fonts.dart';
+
+//import 'Widget/bezierContainer.dart';
+
+class LoginPage extends StatefulWidget {
+  LoginPage({Key key, this.title}) : super(key: key);
+
+  final String title;
+
+  @override
+  _LoginPageState createState() => _LoginPageState();
+}
+
+class _LoginPageState extends State<LoginPage> {
+  Widget _backButton() {
+    return InkWell(
+      onTap: () {
+        Navigator.pop(context);
+      },
+      child: Container(
+        padding: const EdgeInsets.symmetric(horizontal: 10),
+        child: Row(
+          children: <Widget>[
+            Container(
+              padding: const EdgeInsets.only(left: 0, top: 10, bottom: 10),
+              child: const Icon(Icons.keyboard_arrow_left, color: Colors.black),
+            ),
+            const Text('Back',
+                style: TextStyle(fontSize: 12, fontWeight: FontWeight.w500))
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _entryField(String title, {bool isPassword = false}) {
+    return Container(
+      margin: const EdgeInsets.symmetric(vertical: 10),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: <Widget>[
+          Text(
+            title,
+            style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 15),
+          ),
+          const SizedBox(
+            height: 10,
+          ),
+          TextField(
+              obscureText: isPassword,
+              decoration: const InputDecoration(
+                border: InputBorder.none,
+                fillColor: Color(0xfff3f3f4),
+                filled: true,
+              ))
+        ],
+      ),
+    );
+  }
+
+  Widget _submitButton() {
+    return Container(
+      width: MediaQuery.of(context).size.width,
+      padding: const EdgeInsets.symmetric(vertical: 15),
+      alignment: Alignment.center,
+      decoration: BoxDecoration(
+          borderRadius: const BorderRadius.all(Radius.circular(5)),
+          boxShadow: <BoxShadow>[
+            BoxShadow(
+                color: Colors.grey.shade200,
+                offset: const Offset(2, 4),
+                blurRadius: 5,
+                spreadRadius: 2)
+          ],
+          gradient: const LinearGradient(
+              begin: Alignment.centerLeft,
+              end: Alignment.centerRight,
+              colors: [Color(0xfffbb448), Color(0xfff7892b)])),
+      child: const Text(
+        'Login',
+        style: TextStyle(fontSize: 20, color: Colors.white),
+      ),
+    );
+  }
+
+  Widget _divider() {
+    return Container(
+      margin: const EdgeInsets.symmetric(vertical: 10),
+      child: Row(
+        children: <Widget>[
+          const SizedBox(width: 20),
+          const Expanded(
+            child: Padding(
+              padding: EdgeInsets.symmetric(horizontal: 10),
+              child: Divider(
+                thickness: 1,
+              ),
+            ),
+          ),
+          const Text('or'),
+          const Expanded(
+            child: Padding(
+              padding: EdgeInsets.symmetric(horizontal: 10),
+              child: Divider(
+                thickness: 1,
+              ),
+            ),
+          ),
+          const SizedBox(width: 20),
+        ],
+      ),
+    );
+  }
+
+  Widget _facebookButton() {
+    return Container(
+      height: 50,
+      margin: const EdgeInsets.symmetric(vertical: 20),
+      decoration: const BoxDecoration(
+        borderRadius: BorderRadius.all(Radius.circular(10)),
+      ),
+      child: Row(
+        children: <Widget>[
+          Expanded(
+            flex: 1,
+            child: Container(
+              decoration: const BoxDecoration(
+                color: Color(0xff1959a9),
+                borderRadius: BorderRadius.only(
+                    bottomLeft: Radius.circular(5),
+                    topLeft: Radius.circular(5)),
+              ),
+              alignment: Alignment.center,
+              child: const Text('f',
+                  style: TextStyle(
+                      color: Colors.white,
+                      fontSize: 25,
+                      fontWeight: FontWeight.w400)),
+            ),
+          ),
+          Expanded(
+            flex: 5,
+            child: Container(
+              decoration: const BoxDecoration(
+                color: Color(0xff2872ba),
+                borderRadius: BorderRadius.only(
+                    bottomRight: Radius.circular(5),
+                    topRight: Radius.circular(5)),
+              ),
+              alignment: Alignment.center,
+              child: const Text('Log in with Facebook',
+                  style: TextStyle(
+                      color: Colors.white,
+                      fontSize: 18,
+                      fontWeight: FontWeight.w400)),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget _createAccountLabel() {
+    return InkWell(
+      onTap: () {
+        //Navigator.push(
+        //    context, MaterialPageRoute(builder: (context) => SignUpPage()));
+      },
+      child: Container(
+        margin: const EdgeInsets.symmetric(vertical: 20),
+        padding: const EdgeInsets.all(15),
+        alignment: Alignment.bottomCenter,
+        child: Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: <Widget>[
+            const Text(
+              "Don't have an account ?",
+              style: TextStyle(fontSize: 13, fontWeight: FontWeight.w600),
+            ),
+            const SizedBox(
+              width: 10,
+            ),
+            const Text(
+              'Register',
+              style: TextStyle(
+                  color: Color(0xfff79c4f),
+                  fontSize: 13,
+                  fontWeight: FontWeight.w600),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget _title() {
+    return RichText(
+      textAlign: TextAlign.center,
+      text: TextSpan(
+          text: 'd',
+          style: GoogleFonts.portLligatSans(
+            textStyle: Theme.of(context).textTheme.headline4,
+            fontSize: 30,
+            fontWeight: FontWeight.w700,
+            color: const Color(0xffe46b10),
+          ),
+          children: [
+            const TextSpan(
+              text: 'ev',
+              style: TextStyle(color: Colors.black, fontSize: 30),
+            ),
+            const TextSpan(
+              text: 'rnz',
+              style: TextStyle(color: Color(0xffe46b10), fontSize: 30),
+            ),
+          ]),
+    );
+  }
+
+  Widget _emailPasswordWidget() {
+    return Column(
+      children: <Widget>[
+        _entryField("Email id"),
+        _entryField("Password", isPassword: true),
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final height = MediaQuery.of(context).size.height;
+    return Scaffold(
+        body: Container(
+      height: height,
+      child: Stack(
+        children: <Widget>[
+          /*Positioned(
+              top: -height * .15,
+              right: -MediaQuery.of(context).size.width * .4,
+              child: BezierContainer()),*/
+          Container(
+            padding: const EdgeInsets.symmetric(horizontal: 20),
+            child: SingleChildScrollView(
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.center,
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: <Widget>[
+                  SizedBox(height: height * .2),
+                  _title(),
+                  const SizedBox(height: 50),
+                  _emailPasswordWidget(),
+                  const SizedBox(height: 20),
+                  _submitButton(),
+                  Container(
+                    padding: const EdgeInsets.symmetric(vertical: 10),
+                    alignment: Alignment.centerRight,
+                    child: const Text('Forgot Password ?',
+                        style: TextStyle(
+                            fontSize: 14, fontWeight: FontWeight.w500)),
+                  ),
+                  _divider(),
+                  _facebookButton(),
+                  SizedBox(height: height * .055),
+                  _createAccountLabel(),
+                ],
+              ),
+            ),
+          ),
+          Positioned(top: 40, left: 0, child: _backButton()),
+        ],
+      ),
+    ));
+  }
+}

lib/screens/settings_experimental.dart

@@ -50,9 +50,18 @@ class _ExperimentalSettingsScreenState
             ),
             SwitchListTile(
               title: Text(tr('settings.experimental.markdownToolbar')),
-              value: appSettings.experimentalFs,
+              value: appSettings.experimentalMarkdownToolbar,
               onChanged: (bool newVal) {
-                appSettings.experimentalFs = newVal;
+                appSettings.experimentalMarkdownToolbar = newVal;
+                appSettings.save();
+                setState(() {});
+              },
+            ),
+            SwitchListTile(
+              title: Text(tr('settings.experimental.accounts')),
+              value: appSettings.experimentalAccounts,
+              onChanged: (bool newVal) {
+                appSettings.experimentalAccounts = newVal;
                 appSettings.save();
                 setState(() {});
               },

lib/widgets/app_drawer.dart

@@ -67,6 +67,14 @@ class AppDrawer extends StatelessWidget {
                 );
               },
             ),
+          if (appSettings.experimentalAccounts)
+            _buildDrawerTile(
+              context,
+              icon: Icons.account_circle,
+              title: 'Login',
+              onTap: () => _navTopLevel(context, '/login'),
+              selected: currentRoute == '/login',
+            ),
           if (!appSettings.proMode) divider,
           _buildDrawerTile(
             context,

pubspec.lock

@@ -469,6 +469,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.2.0"
+  google_fonts:
+    dependency: "direct main"
+    description:
+      name: google_fonts
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.1"
   html:
     dependency: transitive
     description:

pubspec.yaml

@@ -28,6 +28,7 @@ dependencies:
   auto_size_text: ^2.0.1
   fimber: ^0.3.0
   dynamic_theme: ^1.0.0
+  google_fonts: ^1.1.1
   flutter_staggered_grid_view: ^0.3.0
   provider: ^4.3.2+2
   git_bindings: #^0.0.18