Premium support for our pure JavaScript UI components


Post by jk@datapult.dk »

Howdy

I hope that you are well.

Please see this video:
https://www.dropbox.com/s/g88ayzmhdaqubzn/Screen%20Recording%202023-02-09%20at%2012.02.47.mov?dl=0

Expected behavior for me would be that the event is still one day NOT two days.

Code to reproduce:

import { Scheduler, PresetManager, ViewPreset } from '../../build/scheduler.module.js?465296';
import shared from '../_shared/shared.module.js?465296';

const myViewPreset = new ViewPreset({
    id: 'myPreset',
    name: 'myPreset',
    defaultSpan: 7 * 4,
    shiftIncrement: 1,
    timeResolution: {
        unit: 'day',
        increment: 1
    },
    headers: [
        { unit: "week", dateFormat: "W", },
        { unit: "month", dateFormat: "MMMM", },
        { unit: "day", dateFormat: "D", },
        { unit: "day", dateFormat: "ddd", },
    ],
});

PresetManager.add(myViewPreset)

const resources = [
        { id: 'r1', name: 'Mike' },
        { id: 'r2', name: 'Linda' },
        { id: 'r3', name: 'Don' },
        { id: 'r4', name: 'Karen' },
        { id: 'r5', name: 'Doug' },
        { id: 'r6', name: 'Peter' },
        { id: 'r7', name: 'Sam' },
        { id: 'r8', name: 'Melissa' },
        { id: 'r9', name: 'John' },
        { id: 'r10', name: 'Ellen' }
    ];
const events = [
        {
            id: 1,
            resourceId: 'r1',
            startDate: new Date(2017, 0, 1, 0, 0,),
            endDate: new Date(2017, 0, 1, 23, 59,),
            name: 'Click me',
            iconCls: 'b-fa b-fa-mouse-pointer'
        },
        {
            id: 2,
            resourceId: 'r2',
            startDate: new Date(2017, 0, 2, 0, 0,),
            endDate: new Date(2017, 0, 2, 23, 59,),
            name: 'Drag me',
            iconCls: 'b-fa b-fa-arrows-alt'
        },
        {
            id: 3,
            resourceId: 'r3',
            startDate: new Date(2017, 0, 3, 0, 0,),
            endDate: new Date(2017, 0, 3, 23, 59,),
            name: 'Double click me',
            eventColor: 'purple',
            iconCls: 'b-fa b-fa-mouse-pointer'
        },
        {
            id: 4,
            resourceId: 'r4',
            startDate: new Date(2017, 0, 4, 0, 0,),
            endDate: new Date(2017, 0, 4, 23, 59,),
            name: 'Right click me',
            iconCls: 'b-fa b-fa-mouse-pointer'
        },
        {
            id: 5,
            resourceId: 'r5',
            startDate: new Date(2017, 0, 5, 0, 0,),
            endDate: new Date(2017, 0, 5, 23, 59,),
            name: 'Resize me',
            iconCls: 'b-fa b-fa-arrows-alt-h'
        },
        {
            id: 6,
            resourceId: 'r6',
            startDate: new Date(2017, 0, 6, 0, 0,),
            endDate: new Date(2017, 0, 6, 23, 59,),
            name: 'Important meeting (read-only)',
            iconCls: 'b-fa b-fa-exclamation-triangle',
            eventColor: 'red',
            readOnly: true
        },
        {
            id: 7,
            resourceId: 'r6',
            startDate: new Date(2017, 0, 7, 0, 0,),
            endDate: new Date(2017, 0, 7, 23, 59,),
            name: 'Sports event',
            iconCls: 'b-fa b-fa-basketball-ball'
        },
        {
            id: 8,
            resourceId: 'r7',
            startDate: new Date(2017, 0, 8, 0, 0,),
            endDate: new Date(2017, 0, 8, 23, 59,),
            name: 'Dad\'s birthday!',
            iconCls: 'b-fa b-fa-birthday-cake',
            // Custom styling from data
            style: 'background-color : teal; font-size: 18px',
            // Prevent default styling
            eventStyle: 'none'
        }
    ];

//endregion

const scheduler = new Scheduler({
    appendTo: 'container',
    viewPreset: 'myPreset',
    resources: resources,
    events: events,
    startDate: new Date(2017, 0, 1),
    snapRelativeToEventStartDate: true,
    fillTicks: true,
    endDate: new Date(2017, 0, 30),
    rowHeight: 50,
    barMargin: 5,
    multiEventSelect: true,
    columns: [
        { text: 'Name', field: 'name', width: 130 }
    ]
});

Post by marcio »

Hey jk,

Thanks for the detailed report with the example and video. I created a ticket to investigate/fix that behavior https://github.com/bryntum/support/issues/6139

Best regards,
Márcio


Post by joakim.l »

Hi.

We have found the issue and it will be completed soon.

The reason for it hitting a buggy code path is that each tick was one day, and event duration was a bit less than one day (23h59m). If it works for you, you can set the endDate to end at 00:00 the day after. The Scheduler will interpret that correctly. But if it doesn't work for you, the fix will be released soon.

Regards
Joakim


Post Reply