Changing viewPreset hourAndDay view not displayed correctly

[dude]

Hello,

I am changing from the view preset from 'dayAndWeek' to 'hourAndDay' and fixing the startDate to 'Fri Jul 12 2019 00:00:00' and endDate to 'Fri Jul 12 2019 23:59:59' to display only 24 hour.

When i change the view from 'dayAndWeek' to 'hourAndDay' the scheduler displays two days jul 12 and jul 13 even when i am setting the startDate to 'Fri Jul 12 2019 00:00:00' and the endDate to 'Fri Jul 12 2019 23:59:59'.

This is how i am changing the view:

  switch (this.dashboardRequest.dateIntervals) {
    case '1DAY': {
      this.viewPreset = 'hourAndDay';
      break;
    case '1MONTH': {
      this.viewPreset = 'dayAndWeek';
      break;
    }
  }

<bry-scheduler #scheduler
[columns]="columns"
[events]= "events"
[resources]= "resources"
[startDate]= "startDate"
[endDate]= "endDate"
[viewPreset]="viewPreset">
</bry-scheduler>

Ps: when i do load the component the first time with the 'hourAndDay' view it works perfect, but when i change the view to 'dayAndWeek' and go back to 'hourAndDay' it will show two days.

I am using Angular wrapper.

[pmiklashevich]

Please see scheduler.autoAdjustTimeAxis config. Set it to `false` to disable adjustments. About 23:59:59. 1 day (24 hours) is from midnight to midnight! In your case for example it's from 'Fri Jul 12 2019 00:00:00' to 'Sat Jul 13 2019 00:00:00'.

[dude]

Hello Pavel,

I am trying to set this option to false but i don't find it in the angular wrapper,

@ViewChild(SchedulerComponent) scheduler: SchedulerComponent;

this.scheduler.schedulerEngine.autoAdjustTimeAxis = false; // IDE: Property 'autoAdjustTimeAxis' does not exist on type 'scheduler' . ts(2339).

How can i access to all the functions and properties ?

Thanks.

[pmiklashevich]

Hello,

I'll update Angular guide with the following context:

Adding properties which are not supported by default

Scheduler wrapper has a lot of properties which are supported by default. But sometimes you need to add those which are not supported. For examples autoAdjustTimeAxis.

First you need to update the wrapper examples/angular/_shared/projects/bryntum-angular-shared/src/lib/scheduler.component.ts:

private configs : string[] = [
    'autoAdjustTimeAxis',
    ...
]

@Input() autoAdjustTimeAxis: boolean;

After that need to rebuild bryntum-angular-shared package. For that need to go to examples/angular/_shared and run

npm run build

Now when the wrapper has been updated and built, need to apply new config to your application. Lets say you want to add it to Basic demo (examples/angular/basic).

For that need to edit examples/angular/basic/src/app/schedulerConfig.js and specify value:

export default {
    autoAdjustTimeAxis : false, // lets say you want to disable auto adjusting
    ...
};

And also apply the config to the template in examples/angular/basic/src/app/app.component.html:

<bry-scheduler
    #scheduler
    [autoAdjustTimeAxis] = "schedulerConfig.autoAdjustTimeAxis"
    ...
></bry-scheduler>

Now it's left to build the demo and check the result. Go to examples/angular/basic and run

npm run build

Best,
Pavel