Drop hover effect (#138)

lib/constants/app_constants.dart

@@ -9,6 +9,7 @@ const String SETTINGS = "Settings";
 //ui strings
 const String SEND_AND_RECEIVE_FILES_SECURLY_AND_FAST =
     'Send and receive files securely and fast';
+const String DROP_HERE = 'Drop Here';
 const String SEND_FILES_SIMPLE_SECURE_FAST =
     'Send files simply, securely, and fast.';
 const String SENDING_IN_PROGRESS = 'Sending in progress...';
@@ -78,7 +79,6 @@ const String THE_TRANSFER_HAS_BEEN_CANCELLED =
     "The transfer has been cancelled by";
 
 //Slider UI strings
-const String GET_STARTED = 'Get Started';
 const String START_HERE = 'Start Here';
 const String END_TO_END_ENCRYPTION = 'End-to-End Encryption';
 const String NO_SIGN_UP = 'No Sign-Up';

lib/views/desktop/introduction-slider.dart

@@ -34,7 +34,7 @@ class IntroScreenState extends State<IntroScreen> {
           desktopActionButtonEnabled: true,
           description:
               SEND_AND_RECEIVE_FILES_SECURELY_WITH_SIMPLICITY_AND_SPEED,
-          btnTitle: GET_STARTED,
+          btnTitle: NEXT,
           pathImage: INTRO_LOGO,
           backgroundColor: Colors.black,
           heightImage: 300.0),

lib/views/desktop/send/send.dart

@@ -3,7 +3,7 @@ import 'package:dart_wormhole_gui/config/theme/colors.dart';
 import 'package:dart_wormhole_gui/constants/app_constants.dart';
 import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTCodeGeneration.dart';
 import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTErrorUI.dart';
-import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTSelectAFile.dart';
+import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTSelectOrDropAFile.dart';
 import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTSendingDone.dart';
 import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTSendingProgress.dart';
 import 'package:dart_wormhole_gui/views/desktop/widgets/custom-app-bar.dart';
@@ -54,7 +54,7 @@ class SendScreen extends StatelessWidget {
 
   Widget selectAFileUI() {
     return Consumer<SendSharedState>(builder: (context, state, _) {
-      return DTSelectAFile(
+      return DTSelectOrDropAFile(
               onFileSelected: state.handleSelectFile, onFileDropped: state.send)
           .dottedParent();
     });

lib/views/desktop/send/widgets/DTDropAFile.dart

@@ -0,0 +1,25 @@
+import 'package:dart_wormhole_gui/constants/app_constants.dart';
+import 'package:dart_wormhole_gui/views/widgets/Heading.dart';
+import 'package:flutter/material.dart';
+
+class DTDropAFile extends StatelessWidget {
+  DTDropAFile();
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      mainAxisAlignment: MainAxisAlignment.center,
+      children: [
+        Heading(
+          title: DROP_HERE,
+          textAlign: TextAlign.center,
+          textStyle: TextStyle(
+            fontSize: 40.0,
+            fontFamily: Theme.of(context).textTheme.headline1?.fontFamily,
+            color: Theme.of(context).textTheme.headline1?.color,
+          ),
+          // key: Key('Timing_Progress'),
+        ),
+      ],
+    );
+  }
+}

lib/views/desktop/send/widgets/DTSelectAFile.dart

@@ -1,71 +1,55 @@
 import 'package:dart_wormhole_gui/constants/app_constants.dart';
 import 'package:dart_wormhole_gui/constants/asset_path.dart';
-import 'package:dart_wormhole_gui/views/shared/util.dart';
 import 'package:dart_wormhole_gui/views/widgets/Heading.dart';
-import 'package:dart_wormhole_william/client/file.dart' as f;
-import 'package:desktop_drop/desktop_drop.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 
 class DTSelectAFile extends StatelessWidget {
-  final Future<void> Function() onFileSelected;
-  final Future<void> Function(f.File) onFileDropped;
-
-  DTSelectAFile(
-      {Key? key, required this.onFileSelected, required this.onFileDropped})
-      : super(key: key);
-
+  final Function onFileSelected;
+  DTSelectAFile(this.onFileSelected);
   @override
   Widget build(BuildContext context) {
     return Container(
-      color: Theme.of(context).dialogBackgroundColor,
-      child: DropTarget(
-        onDragDone: (detail) async {
-          await onFileDropped(detail.files.first.readOnlyFile());
-        },
-        child: Container(
-          padding: EdgeInsets.only(top: 80.0.h),
-          child: Column(
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      padding: EdgeInsets.only(top: 80.0.h),
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Heading(
+            title: SEND_FILES_SIMPLE_SECURE_FAST,
+            textStyle: Theme.of(context).textTheme.headline1,
+          ),
+          Column(
             children: [
               Heading(
-                title: SEND_FILES_SIMPLE_SECURE_FAST,
-                textStyle: Theme.of(context).textTheme.headline1,
+                title: DROP_A_FILE,
+                textStyle: Theme.of(context).textTheme.headline5,
               ),
-              Column(
-                children: [
-                  Heading(
-                    title: DROP_A_FILE,
-                    textStyle: Theme.of(context).textTheme.headline5,
-                  ),
-                  Heading(
-                    title: OR,
-                    textStyle: Theme.of(context).textTheme.headline5,
-                    marginTop: 26.0,
-                  ),
-                ],
+              Heading(
+                title: OR,
+                textStyle: Theme.of(context).textTheme.headline5,
+                marginTop: 26.0,
               ),
-              MouseRegion(
-                  cursor: SystemMouseCursors.click,
-                  child: GestureDetector(
-                    onTap: () async {
-                      await onFileSelected();
-                    },
-                    child: Container(
-                      height: 200.0,
-                      width: 250.0,
-                      child: Image.asset(
-                        PLUS_ICON,
-                        width: 250.0,
-                      ),
-                    ),
-                  )),
-              SizedBox(
-                height: 20.0,
-              )
             ],
           ),
-        ),
+          MouseRegion(
+              cursor: SystemMouseCursors.click,
+              child: GestureDetector(
+                onTap: () async {
+                  await onFileSelected();
+                },
+                child: Container(
+                  height: 200.0,
+                  width: 250.0,
+                  child: Image.asset(
+                    PLUS_ICON,
+                    width: 250.0,
+                  ),
+                ),
+              )),
+          SizedBox(
+            height: 20.0,
+          )
+        ],
       ),
     );
   }

lib/views/desktop/send/widgets/DTSelectOrDropAFile.dart

@@ -0,0 +1,48 @@
+import 'package:dart_wormhole_gui/views/desktop/send/widgets/DTSelectAFile.dart';
+import 'package:dart_wormhole_gui/views/shared/util.dart';
+import 'package:dart_wormhole_william/client/file.dart' as f;
+import 'package:desktop_drop/desktop_drop.dart';
+import 'package:flutter/material.dart';
+
+import 'DTDropAFile.dart';
+
+class DTSelectOrDropAFile extends StatefulWidget {
+  final Future<void> Function() onFileSelected;
+  final Future<void> Function(f.File) onFileDropped;
+  bool dragEntered = false;
+  DTSelectOrDropAFile(
+      {Key? key, required this.onFileSelected, required this.onFileDropped})
+      : super(key: key);
+
+  @override
+  State<DTSelectOrDropAFile> createState() => _DTSelectOrDropAFile();
+}
+
+class _DTSelectOrDropAFile extends State<DTSelectOrDropAFile> {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      color: widget.dragEntered
+          ? Color(0xff3A2655)
+          : Theme.of(context).dialogBackgroundColor,
+      child: DropTarget(
+        onDragDone: (detail) async {
+          await widget.onFileDropped(detail.files.first.readOnlyFile());
+        },
+        onDragEntered: (detail) async {
+          this.setState(() {
+            widget.dragEntered = true;
+          });
+        },
+        onDragExited: (detail) async {
+          this.setState(() {
+            widget.dragEntered = false;
+          });
+        },
+        child: widget.dragEntered
+            ? DTDropAFile()
+            : DTSelectAFile(widget.onFileSelected),
+      ),
+    );
+  }
+}

lib/views/mobile/introduction-slider.dart

@@ -33,7 +33,7 @@ class IntroScreenState extends State<IntroScreen> {
               SEND_AND_RECEIVE_FILES_SECURELY_WITH_SIMPLICITY_AND_SPEED,
           subTitleTextFontSize: 14.0,
           titleTextFontSize: 23.0,
-          btnTitle: GET_STARTED,
+          btnTitle: NEXT,
           pathImage: INTRO_LOGO,
           backgroundColor: Colors.black,
           heightImage: 300.0),

lib/views/shared/settings.dart

@@ -9,6 +9,7 @@ import 'package:shared_preferences/shared_preferences.dart';
 
 abstract class SettingsShared<T extends SettingsState> extends State<T> {
   SharedPreferences? prefs;
+  bool selectingFolder = false;
 
   String? get path {
     final path = prefs?.get(PATH);
@@ -41,22 +42,32 @@ abstract class SettingsShared<T extends SettingsState> extends State<T> {
   }
 
   void handleSelectFile() async {
-    String? directory = await FilePicker.platform.getDirectoryPath();
-    if (directory == null) {
-      return;
-    }
-    await canWriteToDirectory(directory).then((canWrite) async {
-      if (canWrite) {
-        setState(() {
-          prefs?.setString(PATH, directory);
-        });
-      } else {
-        ScaffoldMessenger.of(context).showSnackBar(SnackBar(
-          content: Text(
-              THE_APP_DOES_NOT_HAVE_THE_PREMISSION_TO_STORE_FILES_IN_THE_DIR),
-        ));
+    if (selectingFolder) return;
+    try {
+      this.setState(() {
+        selectingFolder = true;
+      });
+      String? directory = await FilePicker.platform.getDirectoryPath();
+      if (directory == null) {
+        return;
       }
-    });
+      await canWriteToDirectory(directory).then((canWrite) async {
+        if (canWrite) {
+          setState(() {
+            prefs?.setString(PATH, directory);
+          });
+        } else {
+          ScaffoldMessenger.of(context).showSnackBar(SnackBar(
+            content: Text(
+                THE_APP_DOES_NOT_HAVE_THE_PREMISSION_TO_STORE_FILES_IN_THE_DIR),
+          ));
+        }
+      });
+    } finally {
+      this.setState(() {
+        selectingFolder = false;
+      });
+    }
   }
 
   Widget build(BuildContext context);