Our pure JavaScript Scheduler component


[REACT] Snap config doesn't work if we have a different timeResolution

Post Reply

Post by larissa.maia »

Hello!

I'm using the latest version of the scheduler pro trial and I have 4 zoom levels (30 minutes, 10 minutes, 5 minutes and 1 minute) and I created the view presets like this:

const zoomOptions = [30, 10, 5, 1]
zoomOptions.forEach((zoomLevel) => {
    PresetManager.registerPreset(`level${zoomLevel.toString()}`, {
      name: `level${zoomLevel}`,
      tickWidth: 71,
      rowHeight: 46,
      displayDateFormat: 'HH:mm',
      timeResolution: {
        unit: 'minute',
        increment: zoomLevel,
      },
      headers: [
        {
          unit: 'minute',
          increment: zoomLevel,
          dateFormat: 'HH:mm',
      ],
    })
  })

When using the drag and drop feature even though the snaps config is set to false, the drag and drop snaps to closest tick. I want the drag and drop to leave the event exactly where it was dropped and still keep those zoom levels.

https://bryntum.com/products/schedulerpro/examples-scheduler/dragselection/ in this example, it lets you drag to the middle of a time cell but if you replace viewPreset to a custom viewPreset like the one above, it doesn't anymore.

I did tried to remove the timeResolution and also tried to set timeResolution.unit to 'seconds' but both cases throw errors in the console.

Thanks in advance!

Post by marcio »

Hey larissa.maia,

Thanks for reaching out!

How did you add the viewPreset to the example that you mentioned?

Also, what error messages are you seeing when trying to remove the timeResolution?

Best regards,
Márcio

Post by larissa.maia »

Hello,

in the example I just replaced 'hourAndDay' for

{
      id: 'level5',
      name: 'level5',
      tickWidth: 71,
      rowHeight: 52,
      displayDateFormat: 'HH:mm',
      timeResolution: {
        unit: 'minutes',
        increment: 5,
      },
      headers: [
        {
          unit: 'minute',
          increment: 5,
          dateFormat: 'HH:mm',

}      ],
    }

if you do that it snaps the event to the closest tick.

If I remove timeResolution I get:

Cannot read properties of undefined (reading 'unit')

Post by tasnim »

Hi,

if you do that it snaps the event to the closest tick.

It's happening because you have header increment of 5 minutes and your time resolution increment is 5 minute
If you set the time resolution increment to let's say 1 minute you'll see it's going to snap by 1 minute.

And the error is showing because the viewpreset is a custom viewpreset which doesn't have timeResolution defined. So you'd need to have timeresoution with the increment value and the increment unit value

Post Reply