Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix jumpy dragging when snapDuration !== slotDuration #622

Open
wants to merge 1 commit into
base: v7-dev
Choose a base branch
from

Conversation

jfrancos
Copy link

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch @fullcalendar/timegrid@7.0.0-beta.4 for the project I'm working on.

with

snapDuration={{ minutes: 15 }}
slotDuration={{ minutes: 30 }}

Before: dragging an event up or down is jumpy (up 30 minutes, down 15 minutes, etc) and mouse gets out of sync:

Screen.Recording.2025-01-25.at.1.08.48.PM.mov

After: smooth and mouse in sync:

Screen.Recording.2025-01-25.at.1.01.30.PM.mov

Here is the diff that solved my problem:

diff --git a/node_modules/@fullcalendar/timegrid/internal.js b/node_modules/@fullcalendar/timegrid/internal.js
index ac5854a..b7cf5d8 100644
--- a/node_modules/@fullcalendar/timegrid/internal.js
+++ b/node_modules/@fullcalendar/timegrid/internal.js
@@ -684,7 +684,7 @@ class TimeGridCols extends DateComponent {
         const slatTop = slatIndex * slatHeight;
         const partial = (positionTop - slatTop) / slatHeight; // floating point number between 0 and 1
         const localSnapIndex = Math.floor(partial * snapsPerSlot); // the snap # relative to start of slat
-        const snapIndex = slatIndex + localSnapIndex * snapsPerSlot;
+        const snapIndex = slatIndex * snapsPerSlot + localSnapIndex;
         const time = addDurations(dateProfile.slotMinTime, multiplyDuration(snapDuration, snapIndex));
         const start = dateEnv.add(cell.date, time);
         const end = dateEnv.add(start, snapDuration);

Maybe this is helpful for fullcalendar/fullcalendar#4865? Or maybe it breaks something. Haven't tested beyond that it seems to fix my own issue.

Thank you for your hard work!

This issue body was partially generated by patch-package.

Hi! 👋 
      
Firstly, thanks for your work on this project! 🙂

Today I used [patch-package](https://github.com/ds300/patch-package) to patch `@fullcalendar/timegrid@7.0.0-beta.4` for the project I'm working on.

with
```
snapDuration={{ minutes: 15 }}
slotDuration={{ minutes: 30 }}
```
Before: dragging an event up or down is jumpy (up 30 minutes, down 15 minutes, etc) and mouse gets out of sync:

https://github.com/user-attachments/assets/a83f6bc6-c011-4539-a4ad-2d1071edb401

After: smooth and mouse in sync:

https://github.com/user-attachments/assets/da9308c3-7d51-4286-9788-01da286c517a

Here is the diff that solved my problem:

```diff
diff --git a/node_modules/@fullcalendar/timegrid/internal.js b/node_modules/@fullcalendar/timegrid/internal.js
index ac5854a..b7cf5d8 100644
--- a/node_modules/@fullcalendar/timegrid/internal.js
+++ b/node_modules/@fullcalendar/timegrid/internal.js
@@ -684,7 +684,7 @@ class TimeGridCols extends DateComponent {
         const slatTop = slatIndex * slatHeight;
         const partial = (positionTop - slatTop) / slatHeight; // floating point number between 0 and 1
         const localSnapIndex = Math.floor(partial * snapsPerSlot); // the snap # relative to start of slat
-        const snapIndex = slatIndex + localSnapIndex * snapsPerSlot;
+        const snapIndex = slatIndex * snapsPerSlot + localSnapIndex;
         const time = addDurations(dateProfile.slotMinTime, multiplyDuration(snapDuration, snapIndex));
         const start = dateEnv.add(cell.date, time);
         const end = dateEnv.add(start, snapDuration);
```

Maybe this is helpful for fullcalendar/fullcalendar#4865?
Or maybe it breaks something.  Haven't tested beyond that it seems to fix my own issue.

Thank you for your hard work!

<em>This issue body was [partially generated by patch-package](https://github.com/ds300/patch-package/issues/296).</em>
@jfrancos
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant