Heyo! We got a small issue in bryntum where the dateTime provided in the tooltipTemplate function (Which we print in a tooltip) and the dateTime in eventDrop is not the same. I suspect this is a problem with the rounding up/down of the dateTimes when timeResolution is set in the preset. We have recreated it below with a timeUnit of minute, and locally with seconds aswell.
We set the following presets and use it as viewPreset:
presets: [{ id: 'myHours',
base: 'hourAndDay',
timeResolution: {
unit: 'minute',
increment: 1,
},
shiftUnit: 'day',
}, ],
viewPreset : 'myHours'
The tooltip looks like this:
features: {
eventDrag: {
tooltipTemplate: ({ eventRecord,
startDate,
endDate,
}) => {return '<div></div>' + startDate}
} } });
and the eventDrop looks like this:
beforeEventDropFinalize(sourceEvent) { console.log(sourceEvent.context.startDate);
},
},
when comparing the dateTime in the tooltip with the dateTime logged in the console, we find that some times they differentiate by the minute e.g. tooltip shows 10:48 and the drop fires 10:49
WE recreated this in the basic example (https://bryntum.com/examples/scheduler/basic/), full config below:
import { Scheduler } from '../../build/scheduler.module.js?455074'; import shared from '../_shared/shared.module.js?455074'; //region Data 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' } ], events = [ { id : 1, resourceId : 'r1', startDate : new Date(2017, 0, 1, 10), endDate : new Date(2017, 0, 1, 12), name : 'Click me', iconCls : 'b-fa b-fa-mouse-pointer' }, { id : 2, resourceId : 'r2', startDate : new Date(2017, 0, 1, 12), endDate : new Date(2017, 0, 1, 13, 30), name : 'Drag me', iconCls : 'b-fa b-fa-arrows-alt' }, { id : 3, resourceId : 'r3', startDate : new Date(2017, 0, 1, 14), duration : 2, durationUnit : 'h', name : 'Double click me', eventColor : 'purple', iconCls : 'b-fa b-fa-mouse-pointer' }, { id : 4, resourceId : 'r4', startDate : new Date(2017, 0, 1, 8), endDate : new Date(2017, 0, 1, 11), name : 'Right click me', iconCls : 'b-fa b-fa-mouse-pointer' }, { id : 5, resourceId : 'r5', startDate : new Date(2017, 0, 1, 15), endDate : new Date(2017, 0, 1, 17), name : 'Resize me', iconCls : 'b-fa b-fa-arrows-alt-h' }, { id : 6, resourceId : 'r6', startDate : new Date(2017, 0, 1, 16), endDate : new Date(2017, 0, 1, 19), name : 'Important meeting', iconCls : 'b-fa b-fa-exclamation-triangle', eventColor : 'red' }, { id : 7, resourceId : 'r6', startDate : new Date(2017, 0, 1, 6), endDate : new Date(2017, 0, 1, 8), name : 'Sports event', iconCls : 'b-fa b-fa-basketball-ball' }, { id : 8, resourceId : 'r7', startDate : new Date(2017, 0, 1, 9), endDate : new Date(2017, 0, 1, 11, 30), 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', resources : resources, events : events,
presets: [{ id: 'myHours',
base: 'hourAndDay',
timeResolution: {
unit: 'minute',
increment: 1,
},
shiftUnit: 'day',
}, ], startDate : new Date(2017, 0, 1, 6), endDate : new Date(2017, 0, 1, 20), viewPreset : 'myHours', rowHeight : 50, barMargin : 5, multiEventSelect : true, columns : [ { text : 'Name', field : 'name', width : 130 } ],
listeners : {
beforeEventDropFinalize(sourceEvent) { console.log(sourceEvent.context.startDate);
},
},
features: {
eventDrag: {
tooltipTemplate: ({ eventRecord,
startDate,
endDate,
}) => {return '<div></div>' + startDate}
} } });