Our powerful JS Calendar component


Post by klaus »

Hello.

I'm trying to make calendar scroll open in current hour when it opens.

I found this property

scrollable

, I tried like this:

.html:

<bry-calendar #calendar style="height: calc(100vh - 165px) !important;" *ngIf="flag" [date]='calendarDate'
            [modes]='modes' [resources]='resources' [events]='events' [sidebar]='calendarConfig.sidebar'
            [tbar]='calendarConfig.tbar' (onCalendarEvents)='onCalendarEvents($event)' [scrollable]="scrollableVar">
        </bry-calendar>
scrollableVar = {
    x: 500,
    y: 1500,
    overflowX: false,
    overflowY: false
  }

After that I tried to use a function from this property in my .ts file:

this.calendar.calendarInstance.scrollable.x = 200;
      this.calendar.calendarInstance.scrollable.y = 1000;
      this.calendar.calendarInstance.scrollable.scrollTo(200, 1000);

Unfortunately it don't work. Could someone help me?


Post by mats »


Post by Animal »

There's also

    // Start life looking at this today
    date : new Date(),

    // An object which is used to set common configs in all modes.
    // Modes which understand this setting are DayViews (WeekView is a 7 day DayView).
    // They will scroll to the specified time of day on first show
    modeDefaults : {
        visibleStartTime : DateHelper.format(new Date(), 'HH:MM')
    },

Of course if you move the main calendar away from today before showing a DayView, the DayView will still initialize itself to scroll to that time of day even if it's not on today's date. That's what that config does.

https://www.bryntum.com/docs/calendar/api/Calendar/widget/DayView#config-visibleStartTime


Post by klaus »

It worked perfectly:

this.calendar.calendarInstance.modes.day.scrollTo(new Date())

Thanks :)


Post Reply