jquense / react-big-calendar

gcal/outlook like calendar component
http://jquense.github.io/react-big-calendar/examples/index.html
MIT License
7.89k stars 2.24k forks source link

Resizing events on a mobile device. #2390

Open VasilKostadinov0104 opened 1 year ago

VasilKostadinov0104 commented 1 year ago

Hello! 👋 A junior dev here!

I have a question that, by my opinion, cannot be classified as a bug or a feature request. The feature is there, it just does not work the way I want it to and I cannot think of a way to implement my idea with the supplied methods of DnDCalendar.

I am using react-big-calendar with the drag and drop feature and custom comonents for the EventWrapper and the Event. I know that events can be resized on desktop by clicking the edges and dragging. They can also be moved by clicking anywhere on the event (except the anchors) and dragging it somewhere. This works fine.

On mobile, however, the experience is quite strange. I have to longpress the event for it to become draggable. Then i have to lift my finger and press again to start dragging it around. When I lift my finger, the event "drops" and is not editable anymore ( for example i might want to move it, then resize it a bit and when I decide that I am done with it, click a button or just click elsewhere). On the other hand if I want to resize the event, I have to longpress on one of the anchors. Sometimes it allows me to resize it, sometimes it just moves up or down. Here is a video showing it. The experience with the default components for the event are similar.

Video of mobile experience https://user-images.githubusercontent.com/84008877/230392502-4b0c197a-db41-4ae7-a1bf-0996c78f511e.mp4

My idea is this: When an event is selected (blue rind around it and two dots over the anchors) it should be movable and resizable at the same time. When i drag it, it should move, when i drag over the dots, it should resize.

So the question is: Is this possible with the current version of big calendar. Is it somehow already implemented and I am missing something? Has anyone made something similiar?

P.S. I will provide code if needed to solve this.

wesloker commented 1 year ago

Hello, I have the same incident. I don't see a solution to the behavior on mobile devices. Could you share the solution you mentioned? your alternative is great.

mitsol commented 1 year ago

can you provide your code you have?