Our pure JavaScript Scheduler component


Post by Jannvhi »

Hi Team,

Say I have defined start and end dates as Apr-25 2021 and May-1 2021.

One unique feature I noticed in Scheduler(4.1.0) was that when you drag/resize an event beyond the visible date, it gets dragged/stretched till we reach the end-date.This is super awesome!!
But once we reach the end-date, I can't drag/resize my event anymore !!

But what if I want the same feature to be applicable when I go beyond the end-date?
i.e, say
startDate -> Apr25 - 2021
endDate -> May-1 2021

I drag/resize my event from Apr25 and I go beyond the May-1.Now I add one more day/week to my end-date and I shall be able to either drop or resize my event beyond May-1.

I came across this link: https://github.com/bryntum/support/issues/1114.

I'm not sure if this can be called infinite scrolling, because I want my event to be moved only when I drag/resize my event beyond the end-date and not when I just simply reach my end-date using horizontal scroll.Correct me if I misunderstood.

What I tried:

My idea was to detect the event when I reach my end-date and add one week to my end-date and scroll to my next day of week.

        let  schedule = this.$refs.scheduler.schedulerInstance,
        schedule.subGrids.normal.scrollable.on('scrollend', this.onScrollEnd, this);

Inside onScrollEnd, I add one more week to my end-date.

        onScrollEnd(e){
           //global variable to avoid repeated method execution because of calling scrollToDate
            if(!isDateScrolled){
           //here I will set my new end-date as new Date(currentEndDate.getDate() + 7) and return my 
           //nextWeek's first day as new Date(currentStartDate.getDate() + 7)
                let nextWeekFirstDay = this.goToNextWeek();
                isDateScrolled = true;
                //I scroll the scheduler to the first day of next week
                this.$refs.scheduler.schedulerInstance.scrollToDate(nextWeekFirstDay, { block : 'start' })
            }else{
                isDateScrolled = false;
            }
        },

But unfortunately, I can't achieve this properly.

1.When I drag beyond my end-date, the event is still struck.But I see from logs that the start,end dates are changed.

I used the below to change my scheduler timespan dates:

            this.$refs.scheduler.schedulerInstance.timeAxis.setTimeSpan(firstday, lastday);

2.I want the scroll event to be triggered only when I reach my end-date (that also when I drag/resize my event).

a.But the above event is getting triggered when I normally scroll and leave.

b.And it is not triggered when I drag my event from my end-date.
i.e say my event is already at May-1 2021 which is my end-date.So now when I try to drag, it is not triggered.
But when I drag backwards till (Apr-30) and drag beyond end-date(May-1), it is getting triggered.

c.And using this event, I can't understand in which direction, I'm actually dragging my event(left side or right side).Because depending upon the direction, I can set dynamically the start-date and end-date of my scheduler and move my event accordingly.

Kindly provide some insights/solution to achieve this?


Post by mats »

Unless I'm missing something, you need infinite scrolling. It's not so far left until this feature is finished, so I would recommend you to wait for 4.2.0. It's not worth for you to try to implement it yourself, big big feature.


Post by Jannvhi »

Thanks for the reply mats.

Image

Kindly have a look at the attachment, just to let you know what exactly I meant.In the gif, I can't drag/resize my event beyond my end-date.

Could you kindly confirm if I can drag/resize beyond end-date using infinite scroll? so that I shall start concentrating on other features!.

Thanks !

Attachments
qs.gif
qs.gif (3.68 MiB) Viewed 552 times

Post by mats »

Yes that's it, this is what 'infinite' refers to! :)


Post by Jannvhi »

Thanks for the clarification mats :)


Post by Srindt »

Guys, could you kindly confirm, when will the version 4.2.0 be released along with this infinite scroll ?
Depending upon which I shall plan my development..


Post by mats »

The development is finished, tests green so now just awaiting review phase. Hopeful 4.2.0 is out in the next 2-4 weeks.


Post Reply