feat: support multiple drop targets

LorTos · LorTos · commit fe53a9d62c04 · 2023-11-15T15:49:06.000+07:00
diff --git a/packages/desktop_drop/lib/desktop_drop_web.dart b/packages/desktop_drop/lib/desktop_drop_web.dart
@@ -1,5 +1,5 @@
 import 'dart:async';
-import 'dart:html' as html show window, Url;
+import 'dart:html' as html show window, Url, DataTransfer;
 
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/services.dart';
@@ -25,66 +25,92 @@ class DesktopDropWeb {
     pluginInstance._registerEvents();
   }
 
+  html.DataTransfer? _dataTransfer;
+
   void _registerEvents() {
-    html.window.onDrop.listen((event) {
-      event.preventDefault();
+    html.window.onDragEnter.listen(
+      (event) {
+        event.preventDefault();
+        _dataTransfer = event.dataTransfer;
+        channel.invokeMethod('entered', [
+          event.client.x.toDouble(),
+          event.client.y.toDouble(),
+        ]);
+      },
+    );
 
-      final results = <WebDropItem>[];
+    html.window.onDragOver.listen(
+      (event) {
+        event.preventDefault();
+        _dataTransfer = event.dataTransfer;
+        channel.invokeMethod('updated', [
+          event.client.x.toDouble(),
+          event.client.y.toDouble(),
+        ]);
+      },
+    );
 
-      try {
-        final items = event.dataTransfer.files;
-        if (items != null) {
-          for (final item in items) {
-            results.add(
-              WebDropItem(
-                uri: html.Url.createObjectUrl(item),
-                name: item.name,
-                size: item.size,
-                type: item.type,
-                relativePath: item.relativePath,
-                lastModified: item.lastModified != null
-                    ? DateTime.fromMillisecondsSinceEpoch(item.lastModified!)
-                    : item.lastModifiedDate,
-              ),
-            );
+    html.window.onDrop.listen(
+      (event) {
+        event.preventDefault();
+        _dataTransfer = null;
+        final results = <WebDropItem>[];
+
+        try {
+          final items = event.dataTransfer.files;
+          if (items != null) {
+            for (final item in items) {
+              results.add(
+                WebDropItem(
+                  uri: html.Url.createObjectUrl(item),
+                  name: item.name,
+                  size: item.size,
+                  type: item.type,
+                  relativePath: item.relativePath,
+                  lastModified: item.lastModified != null
+                      ? DateTime.fromMillisecondsSinceEpoch(item.lastModified!)
+                      : item.lastModifiedDate,
+                ),
+              );
+            }
           }
+        } catch (e, s) {
+          debugPrint('desktop_drop_web: $e $s');
+        } finally {
+          channel.invokeMethod(
+            "performOperation_web",
+            results.map((e) => e.toJson()).toList(),
+          );
         }
-      } catch (e, s) {
-        debugPrint('desktop_drop_web: $e $s');
-      } finally {
-        channel.invokeMethod(
-          "performOperation_web",
-          results.map((e) => e.toJson()).toList(),
-        );
-      }
-    });
-
-    html.window.onDragEnter.listen((event) {
-      event.preventDefault();
-      channel.invokeMethod('entered', [
-        event.client.x.toDouble(),
-        event.client.y.toDouble(),
-      ]);
-    });
-
-    html.window.onDragOver.listen((event) {
-      event.preventDefault();
-      channel.invokeMethod('updated', [
-        event.client.x.toDouble(),
-        event.client.y.toDouble(),
-      ]);
-    });
+      },
+    );
 
-    html.window.onDragLeave.listen((event) {
-      event.preventDefault();
-      channel.invokeMethod('exited', [
-        event.client.x.toDouble(),
-        event.client.y.toDouble(),
-      ]);
-    });
+    html.window.onDragLeave.listen(
+      (event) {
+        event.preventDefault();
+        _dataTransfer = null;
+        channel.invokeMethod('exited', [
+          event.client.x.toDouble(),
+          event.client.y.toDouble(),
+        ]);
+      },
+    );
   }
 
   Future<dynamic> handleMethodCall(MethodCall call) async {
+    switch (call.method) {
+      case 'updateDroppableStatus':
+        final enable = call.arguments as bool;
+        final current = _dataTransfer?.dropEffect;
+        final newValue = enable ? 'copy' : 'move';
+        if (current !=  newValue) {
+          _dataTransfer?.dropEffect = newValue;
+        }
+        return;
+      default:
+        break;
+    }
+
     throw PlatformException(
       code: 'Unimplemented',
       details: 'desktop_drop for web doesn\'t implement \'${call.method}\'',
diff --git a/packages/desktop_drop/lib/src/channel.dart b/packages/desktop_drop/lib/src/channel.dart
@@ -8,7 +8,10 @@ import 'drop_item.dart';
 import 'events.dart';
 import 'utils/platform.dart' if (dart.library.html) 'utils/platform_web.dart';
 
-typedef RawDropListener = void Function(DropEvent);
+abstract class RawDropListener {
+  void onEvent(DropEvent event);
+  bool isInBounds(DropEvent event);
+}
 
 class DesktopDrop {
   static const MethodChannel _channel = MethodChannel('desktop_drop');
@@ -19,22 +22,24 @@ class DesktopDrop {
 
   final _listeners = <RawDropListener>{};
 
-  var _inited = false;
+  var _initialized = false;
 
   Offset? _offset;
 
   void init() {
-    if (_inited) {
+    if (_initialized) {
       return;
     }
-    _inited = true;
-    _channel.setMethodCallHandler((call) async {
-      try {
-        return await _handleMethodChannel(call);
-      } catch (e, s) {
-        debugPrint('_handleMethodChannel: $e $s');
-      }
-    });
+    _initialized = true;
+    _channel.setMethodCallHandler(
+      (call) async {
+        try {
+          return await _handleMethodChannel(call);
+        } catch (e, s) {
+          debugPrint('_handleMethodChannel: $e $s');
+        }
+      },
+    );
   }
 
   Future<void> _handleMethodChannel(MethodCall call) async {
@@ -45,15 +50,14 @@ class DesktopDrop {
         _notifyEvent(DropEnterEvent(location: _offset!));
         break;
       case "updated":
-        if (_offset == null && Platform.isLinux) {
-          final position = (call.arguments as List).cast<double>();
-          _offset = Offset(position[0], position[1]);
-          _notifyEvent(DropEnterEvent(location: _offset!));
-          return;
-        }
         final position = (call.arguments as List).cast<double>();
+        final previousOffset = _offset;
         _offset = Offset(position[0], position[1]);
-        _notifyEvent(DropUpdateEvent(location: _offset!));
+        if (previousOffset == null) {
+          _notifyEvent(DropEnterEvent(location: _offset!));
+        } else {
+          _notifyEvent(DropUpdateEvent(location: _offset!));
+        }
         break;
       case "exited":
         _notifyEvent(DropExitEvent(location: _offset ?? Offset.zero));
@@ -109,9 +113,19 @@ class DesktopDrop {
   }
 
   void _notifyEvent(DropEvent event) {
-    for (final listener in _listeners) {
-      listener(event);
+    final reversedListeners = _listeners.toList(growable: false).reversed;
+    var foundTargetListener = false;
+    for (final listener in reversedListeners) {
+      final isInBounds = listener.isInBounds(event);
+      if (isInBounds && !foundTargetListener) {
+        foundTargetListener = true;
+        listener.onEvent(event);
+      } else {
+        listener.onEvent(DropExitEvent(location: event.location));
+      }
     }
+
+    _channel.invokeMethod('updateDroppableStatus', foundTargetListener);
   }
 
   void addRawDropEventListener(RawDropListener listener) {
diff --git a/packages/desktop_drop/lib/src/drop_target.dart b/packages/desktop_drop/lib/src/drop_target.dart
