Our pure JavaScript Scheduler component


Post by lajoj »

After upgrade from 2.2.5 to 2.3.1 my registered view presets doesn't look as before.
The middle header shows every hour despite I have configured each 4 hour to be displayed.
Here is the preset:
      tickWidth: 60,
      tickHeight: 30,
      displayDateFormat: 'HH:mm',
      shiftIncrement: 1,
      shiftUnit: 'week',
      defaultSpan: 12,
      timeResolution: {
        unit: 'minute',
        increment: 30
      },
      headerConfig: {
        middle : {
          unit: 'hour',
          increment: 4,
          dateFormat: 'HH:mm'
        },
        top: {
          unit: 'day',
          dateFormat: 'ddd DD/MM'
        }
      },
      columnLinesFor: 'middle'
    });

Post by pmiklashevich »

I've applied your config to Basic demo, please see:
PresetManager.registerPreset('test', {
    tickWidth         : 60,
    tickHeight        : 30,
    displayDateFormat : 'HH:mm',
    shiftIncrement    : 1,
    shiftUnit         : 'week',
    defaultSpan       : 12,
    timeResolution    : {
        unit      : 'minute',
        increment : 30
    },
    headerConfig : {
        middle : {
            unit       : 'hour',
            increment  : 4,
            dateFormat : 'HH:mm'
        },
        top : {
            unit       : 'day',
            dateFormat : 'ddd DD/MM'
        }
    },
    columnLinesFor : 'middle'
});

let scheduler = new Scheduler({
    adopt            : 'container',
    minHeight        : '20em',
    resources        : resources,
    events           : events,
    startDate        : new Date(2017, 0, 1),
    endDate          : new Date(2017, 0, 2),
    viewPreset       : 'test',
    rowHeight        : 50,
    barMargin        : 5,
    multiEventSelect : true,

    columns : [
        { text : 'Name', field : 'name', width : 130 }
    ]
});
Снимок экрана 2019-11-28 в 19.53.25.png
Снимок экрана 2019-11-28 в 19.53.25.png (93.58 KiB) Viewed 1221 times
So the config should work. Please make sure you're using correct view preset.
If it still doesn't work, please submit a runnable testcase that we can check.
Thanks!

Pavlo Miklashevych
Sr. Frontend Developer


Post by lajoj »

Hello!
Before I posted the issue, I tried my code in the examples/angular-8 sample. It didn't work there either.

To reproduce:
In app.component.ts
import { DateField, DateHelper, PresetManager } from 'bryntum-scheduler/scheduler.umd.js';
Add the following code at the end in the ngAfterViewInit method:
        PresetManager.registerPreset('myWeek', {
          tickWidth: 60,
          tickHeight: 30,
          displayDateFormat: 'HH:mm',
          shiftIncrement: 1,
          shiftUnit: 'week',
          defaultSpan: 12,
          timeResolution: {
            unit: 'minute',
            increment: 30
          },
          headerConfig: {
            middle : { 
              unit: 'hour',
              increment: 4,
              dateFormat: 'HH:mm'
            },
            top: {
              unit: 'day',
              dateFormat: 'ddd DD/MM'
            }
          },
          columnLinesFor: 'middle'
        });
        this.scheduler.viewPreset = 'myWeek';
        console.log('preset = ' + this.scheduler.viewPreset);
The console prints myWeek but the schedule shows every hour.

Post by pmiklashevich »

Please log
console.log('preset = ' + this.scheduler.schedulerEngine.viewPreset.id);
To make it work please set to scheduler instance (schedulerEngine).
this.scheduler.schedulerEngine.viewPreset = 'myWeek';

Pavlo Miklashevych
Sr. Frontend Developer


Post by lajoj »

Yes, that was the magic trick, now it is working!
Thanks a lot!
(just a pity that it worked before in 2.2.5)

Post Reply