Bryntum Support Forums

Posted: **Thu Sep 08, 2022 9:46 am**

The default calendar is initially set to go from 6 AM to 6AM.

Relevant calendar config:

{
    week: null,
    day: null,
    month: null,
    year: null,
    agenda: null,
    weekResources: {
      type: 'resource',
      title: 'Week',
      view: {
        type: CalendarViewMode.WEEK,
        weekStartDay: null, // dynamically set
        dayStartShift: 6,
        dayStartTime: 6,
        dayEndTime: 6,
        visibleStartTime: 6,
        showAllDayHeader: false,
        eventRenderer: eventRenderer.bind(null, CalendarViewMode.WEEK),
        dayHeaderRenderer
      }
    } as Partial<WeekViewConfig>

Screenshot:

: calendar-screenshot.png (42.92 KiB) Viewed 499 times

That works fine.

However, when I want to change the timerange, it only seems to work partially.
As you can see in the gif, the grid itself seem to adjust tot the correct height, but the timelabels on the vertical axis does NOT update along:

: calendar-bug.gif (297.96 KiB) Viewed 499 times

Am I doing something wrong?

Kind regards,
Thomas Opdebeeck

Posted: **Thu Sep 08, 2022 11:47 am**

FYI: the script in the gif is: test.current.instance.modes.weekResources.view.dayStartTime = 0;
'test' is obviously the calendarRef.

Posted: **Thu Sep 08, 2022 12:39 pm**

I tried here
https://bryntum.com/examples/calendar/basic/
in console

calendar.modes.week.dayStartTime = 1
// alternate way
calendar.activeView.dayStartTime = 1

All works as expected.
We need a test case to reproduce this. Please try to reproduce in our examples or zip and attach your app.

Posted: **Tue Sep 13, 2022 10:33 am**

Hey Alex, thanks for the response.

I got it working, but I think I stumbled upon a small bug on your side now.

To reproduce: go https://bryntum.com/examples/calendar/basic/
and replace the code in the code-editor by this setup:

import { Calendar } from '../../build/calendar.module.js?461864';
import shared from '../_shared/shared.module.js?461864';

const calendar = new Calendar({
    // Start life looking at this date
    date : new Date(2020, 9, 12),

// CrudManager arranges loading and syncing of data in JSON form from/to a web service
crudManager : {
    transport : {
        load : {
            url : 'data/data.json'
        }
    },
    autoLoad : true
},

appendTo : 'container',

// Features named by the properties are included.
// An object is used to configure the feature.
features : {
    eventTooltip : {
        // Configuration options are passed on to the tooltip instance
        // We want the tooltip's left edge aligned to the right edge of the event if possible.
        align : 'l-r'
    }
},
modes: {
  week: null,
  day: null,
  month: null,
  year: null,
  agenda: null,
  weekResources: {
    type: 'resource',
    title: 'Week',
    view: {
      type: 'week',
      weekStartDay: null,
      dayStartShift: 0,
      dayStartTime: 6,
      dayEndTime: 6,
      visibleStartTime: 0,
      showAllDayHeader: false,
      //eventRenderer: eventRenderer.bind(null, CalendarViewMode.WEEK),
      //dayHeaderRenderer
    }
  },
  dayResources: {
    type: 'resource',
    title: 'Day',
    view: {
      type: 'day',
      dayStartShift: 6,
      dayStartTime: 6,
      dayEndTime: 6,
      visibleStartTime: 6,
      showAllDayHeader: false,
      //eventRenderer: eventRenderer.bind(null, CalendarViewMode.DAY),
      //dayHeaderRenderer
    } 
  }
}

});

That is how we have set it up: with ResourceView-mode (https://www.bryntum.com/docs/calendar/api/Calendar/widget/ResourceView).

With this set up we can have following scripts working just fine:

calendar.modes.weekResources.view.dayStartTime = '11:00';calendar.modes.weekResources.view.dayEndTime = '19:00';

However, when I try to have some more specific time (with minutes instead of spot on the hour)
EG:

calendar.modes.weekResources.view.dayStartTime = '06:10';calendar.modes.weekResources.view.dayEndTime = null;

It gets a bit buggy.
It seems to be displayed as [05:50,*] instead of [06:10, *].

: calendar-minutes-bug.gif (1.01 MiB) Viewed 464 times

Thank you for having a look,
Thomas

Posted: **Tue Sep 13, 2022 2:23 pm**

Hi Thomas,

Thanks for the report. Reproduced and created a ticket. Link to track the status: https://github.com/bryntum/support/issues/5225

Bryntum Support Forums

[REACT] Dynamically changing [dayStartTime, dayEndTime]

[REACT] Dynamically changing [dayStartTime, dayEndTime]

Re: [REACT] Dynamically changing [dayStartTime, dayEndTime]

Re: [REACT] Dynamically changing [dayStartTime, dayEndTime]

Re: [REACT] Dynamically changing [dayStartTime, dayEndTime]

Re: [REACT] Dynamically changing [dayStartTime, dayEndTime]