Fix scrolling in mobile browser

mokhosh · Jul 13, 2024 · c56ce54 · c56ce54
1 parent 65925e2
commit c56ce54
Showing 1 changed file with 29 additions and 14 deletions.
diff --git a/resources/views/kanban-scripts.blade.php b/resources/views/kanban-scripts.blade.php
@@ -29,18 +29,33 @@ function onUpdate(e) {
     }
 
     document.addEventListener('livewire:navigated', () => {
-        const statuses = @js($statuses->map(fn ($status) => $status['id']))
-
-        statuses.forEach(status => Sortable.create(document.querySelector(`[data-status-id='${status}']`), {
-            group: 'filament-kanban',
-            ghostClass: 'opacity-50',
-            animation: 150,
-
-            onStart,
-            onEnd,
-            onUpdate,
-            setData,
-            onAdd,
-        }))
-    })
+        const statuses = @js($statuses->map(fn ($status) => $status['id']));
+    
+        statuses.forEach(status => {
+            const element = document.querySelector(`[data-status-id='${status}']`);
+            const sortableInstance = Sortable.create(element, {
+                group: 'filament-kanban',
+                ghostClass: 'opacity-50',
+                animation: 150,
+                onStart(event) {
+                    // Disable dragging initially
+                    sortableInstance.option('disabled', true);
+    
+                    // Re-enable dragging after 2 seconds
+                    setTimeout(() => {
+                        sortableInstance.option('disabled', false);
+                    }, 1000);
+    
+                    // Call your original onStart function if needed
+                    if (typeof onStart === 'function') {
+                        onStart(event);
+                    }
+                },
+                onEnd,
+                onUpdate,
+                setData,
+                onAdd,
+            });
+        });
+    });
 </script>