Scale down dragged Participants in Call (#190)

CHANGELOG.md

@@ -16,6 +16,8 @@ All user visible changes to this project will be documented in this file. This p
 - UI:
     - Home page:
         - Redesigned chats tab. ([#142])
+    - Media panel:
+        - Video resizing when dragged. ([#191], [#190])
 
 ### Fixed
 
@@ -26,6 +28,8 @@ All user visible changes to this project will be documented in this file. This p
     - Context menu not opening over video previews. ([#198], [#196])
 
 [#142]: /../../pull/142
+[#190]: /../../issues/190
+[#191]: /../../pull/191
 [#192]: /../../issues/192
 [#193]: /../../pull/193
 [#196]: /../../issues/196

lib/ui/page/call/component/desktop.dart

@@ -1351,6 +1351,15 @@ Widget _primaryView(CallController c) {
             });
           },
           decoratorBuilder: (_) => const ParticipantDecoratorWidget(),
+          itemConstraints: (_DragData data) {
+            if (data.participant.video.value != null ||
+                data.participant.user.value?.user.value.callCover != null) {
+              final double size = (c.size.longestSide * 0.33).clamp(100, 250);
+              return BoxConstraints(maxWidth: size, maxHeight: size);
+            }
+
+            return null;
+          },
           itemBuilder: (_DragData data) {
             var participant = data.participant;
             return Obx(() {
@@ -1849,8 +1858,16 @@ Widget _secondaryView(CallController c, BuildContext context) {
                 );
               });
             },
-            decoratorBuilder: (_DragData item) =>
-                const ParticipantDecoratorWidget(),
+            decoratorBuilder: (_) => const ParticipantDecoratorWidget(),
+            itemConstraints: (_DragData data) {
+              if (data.participant.video.value != null ||
+                  data.participant.user.value?.user.value.callCover != null) {
+                final double size = (c.size.longestSide * 0.33).clamp(100, 250);
+                return BoxConstraints(maxWidth: size, maxHeight: size);
+              }
+
+              return null;
+            },
             itemBuilder: (_DragData data) {
               var participant = data.participant;
               return Obx(

lib/ui/page/call/controller.dart

@@ -1738,6 +1738,8 @@ class CallController extends GetxController {
     primary.value = focused.isNotEmpty ? focused : [...locals, ...remotes];
     secondary.value =
         focused.isNotEmpty ? [...locals, ...paneled, ...remotes] : paneled;
+
+    applySecondaryConstraints();
   }
 
   /// Returns all [Participant]s identified by an [id] and [source].