Fullcalendar 6.1.0 : StartTime and EndTime are changing when date is changed - datetime

if i change the eventDate from a certain date, the startTime and end endTime is changing by one our!
{
"allDay" : false,
"end" : "2023-03-25T10:30:00.000Z",
"focus" : "2023-03-22T23:00:00.000Z",
"id" : "F290E99B-B8C4-49FE-AED5-36078EB60C34",
"start" : "2023-03-25T09:30:00.000Z"
}
{
"allDay" : false,
"end" : "2023-03-26T09:30:00.000Z",
"focus" : "2023-03-22T23:00:00.000Z",
"id" : "F290E99B-B8C4-49FE-AED5-36078EB60C34",
"start" : "2023-03-26T08:30:00.000Z"
}
This only occurs when i change the date from 2023-03-26 on or later.
If the date is earlier, the time is correct.
Thank you for the help
Juergen
Occurs on any events.

The time shouldn't change on the display, because the calendar is set to display in the local timezone, and your event is defined as being in UTC.
So when you move it to a date which is in a different timezone (due to daylight savings), you are setting it to the local time of the event, and so in the background fullCalendar changes the UTC time of the event accordingly.
If you were to use the timeGrid view to drag the event (even to a different time of day on the new date) you can see the effect more clearly.

Related

Moment.js, FullCalendar.js datetime comparisons with timezone offsets

I'm confused.
I have a textbox that is populated with a date and time (string) such as '09/07/2021 10:30'.
I convert this string to a moment like so:
var suggestedDateObj = moment(suggestedDate, 'DD/MM/YYYY HH:mm');
I then want to check if this date and time is in between time slots in a fullcalendar.js event object. I do this like so:
var startDateObj = moment(value.start);
var endDateObj = moment(value.end);
if (suggestedDateObj.isBetween(startDateObj, endDateObj)) {}
However...it isn't working. And it's due to timezone offset (i think).
suggestedDateObj returns a value with a UTC offset of +0100 (British Summer Time)
However my calendar event objects return a date with a UTC offset of +0000. So when i check if '09/07/2021 10:30 +0100' is in between '09/07/2021 10:30 +0000' and '09/07/2021 11:30 +0000' it doesn't work!
I guess my question is really either:
How can I create my suggestedDateObj moment with a timezone offset of zero? OR
How can i tell fullcallendar events that the time it is displaying is actually BST (+0100)? At the moment I don't specify the 'Timezone' parameter.
Thanks.
UPDATE
Hmm....this might work....although it feels a bit clunky:
var tmoment1 = moment(suggestedDate, 'DD/MM/YYYY HH:mm');
//create default date with specific timezone offset of zero
var suggestedDateObj = moment().utcOffset(0);
//set the date and time
suggestedDateObj.set({
day: tmoment1.day(),
month: tmoment1.month(),
year: tmoment1.year(),
hour: tmoment1.hour(),
minute: tmoment1.minute(),
second: 0
});
You can generate suggestedDateObj in utc like that:
var suggestedDateObj = moment.utc(suggestedDate, 'DD/MM/YYYY HH:mm');`
For the .isBetween() I suggest you to use the square bracket like forth parameter, like documentation says.
if (suggestedDateObj.isBetween(startDateObj, endDateObj, undefined, '[]'))
The square brackets indicate that the check must include the dates of the limiter

Set height of event with no end

In my agendaDay view I some times need to display events that do not have an end time:
$(".agenda").fullCalendar({
events: [
{
title: "Start day",
start: '2017-04-19T09:00:00'
},
{
title: "Do some work",
start: '2017-04-19T09:05:00',
end: '2017-04-19T17:00:00'
}
]
});
Such events get rendered as if they lasted two hours:
Is there a way to control that or an alternative feature I should be using?
Docs for v1 mention the exact property I need:
defaultEventMinutes 1.4
Determines the length (in minutes) an event appears to be when it has
an unspecified end date.
Integer, default: 120
By default, if an Event Object as no end, it will appear to be 2
hours.
... but the property is apparently not available on 3.3.1 :-?
In the v2 & 3 API it's been split in two properties, so you can set different values to all day events and timed ones:
defaultAllDayEventDuration
defaultTimedEventDuration
Also, the new properties expect a string with a time ("00:45:00") rather than seconds (2700).

Design a custom year view with 12 month slots

Sample View:
I would like to create a custom year view to show the timeline in every month slots. I can use fullcalendar-scheduler with a custom view and define like this:
views: {
timelineCustom: {
type: 'timeline',
buttonText: 'Year View',
duration: {year:1},
slotDuration: {month:1}
}
}
However, there is no way to set up a fiscal year view with month start at April 1st and end at March 31st next year. And also, a timeline bar will cover a whole month slot even though an event only starts from the second half of that month.
Your first problem - starting the view in April and ending in March of the following year, can be solved using the new "visibleRange" option. This lets you supply start/end dates for the view, relative to the "currentDate" (i.e. the date fullCalendar curently regards as being selected). You also have to set the "dateIncrement" option, to ensure that Next/Previous increment the current date by 1 year.
N.B. This requires fullCalendar 3.3.0 and Scheduler 1.6.0, or later.
timelineCustom: {
type: 'timeline',
buttonText: 'Year View',
dateIncrement: { years: 1 },
slotDuration: { months: 1 },
visibleRange: function(currentDate) {
return {
start: currentDate.clone().startOf('year').add({ months: 3}),
end: currentDate.clone().endOf("year").add({ months: 4})
};
}
}
See https://fullcalendar.io/docs/current_date/visibleRange/ and https://fullcalendar.io/docs/current_date/dateIncrement/ for more details
However, your issue where the timeline bar covers a whole month slot even though an event only starts in the second half of a month, is not really solvable in the way you want. The whole point of "slots" is to be the minimum time that an event can be displayed for in that particular view. If you want it to be more subtle than that, you would have to define shorter slots. The same thing happens in fullCalendar's default "Month" (non-timeline) view - all events cover a whole day even if they're timed, but you can see the times in the description. I see in your example you have already got the dates of those events displayed in the description, so it should be reasonably clear for your users.
I suggest your users click on the Month View to get a more detailed breakdown with the slot durations more accurately displayed. Either that or you have to compromise and set slotDuration to something smaller.

plone.app.event- Using IEventBasic as a behavior, how can I properly set the end field programatically in an event?

I have a dexterity content type (my.product.myobject) that uses the IEventBasic behavior (implemented in the xml file with other behaviors) and I'm trying to make the end field be set within the same week of the start field. I attempt to correct the end date in an IObjectAddedEvent (zope.lifecycleevent.interfaces.IObjectAddedEvent).
I first get the week range from the start field:
def getWeekRangeFromDate(a_date,offset=1):
start = (a_date - timedelta(days=(a_date.weekday() + offset) % 7)).replace(hour=0,minute=0)
end = (start + timedelta(days=6)).replace(hour=23,minute=59)
return {'start':start,
'end':end,
}
def myObjectAdded(myObject, event):
week_range = getWeekRangeFromDate(myObject.start)
if myObject.end > week_range['end']:
myObject.end = week_range['end']
I have the end field printed in the browserview and I use IEventAccessor to extract the end date from the myObject:
class View(BrowserView):
def __init__(self,context,request):
...
self.context = self.context
def getFormattedEnd(self):
if self.context.whole_day == False:
return IEventAccessor(self.context).end.strftime('%m/%d %I:%M %p')
...
When it doesn't need to be programmatically corrected, the end field displays correctly, but when it does, it appears 5 hours off.
In my myObjectAdded event, I tried:
if myObject.end > week_range['end']:
myObject.end = week_range['end'] - timedelta(hours = IEventAccessor(myObject).end.offset().total_seconds()/3600)
This does appear right actually, but when I go to the edit form and change the start field, the end field ends up changing itself seemingly random. Changing the starting hour field to 16 changed the end's month about two weeks ahead.
How can I set it without it acting up? Am I misundertanding how to use IEventBasic?
Edit: I'm coming across something really interesting. In the edit form, the Start End Validator is failing.
Event Starts - 25/November/2016 9:00
Event Ends - 25/Novermber/2016 20:00
I click submit and the status message says End date must be after the start date.
Edit: The version of Plone I am using is 4.3.

Link to add Google Calendar event loads incorrect time

So I'm trying to create an "Add Event to Calendar" link with this format:
https://www.google.com/calendar/render?action=TEMPLATE&text=My+Big+Party&dates=20160320T140000Z/20160320T180000Z&details=It+will+be+crazy&location=123+Granville+St+Vancouver+BC&sf=true&output=xml
And it mostly works, but the time is wrong. I'm in Vancouver (same time zone as the event) and it wants to save the event from 7am to 11am (it should be 2pm to 6pm).
What am I doing wrong?
EDIT:
I'm trying to convert my times to UTC but I'm getting "Call to a member function setTimeZone() on a non-object":
function ls_convert_time($dt, $tz1, $df1, $tz2, $df2) {
// create DateTime object
$d = DateTime::createFromFormat($df1, $dt, new DateTimeZone($tz1));
// convert timezone
$d->setTimeZone(new DateTimeZone($tz2));
// convert dateformat
return $d->format($df2);
}
$new_start_time = ls_convert_time($start_time, $time_zone, 'HHmmss', 'UTC', 'HHmmss');
$new_end_time = ls_convert_time($end_time, $time_zone, 'HHmmss', 'UTC', 'HHmmss');
Take the Z out of the time and don´t use ctz. That´ll work for you and it[ll show the right time for the right zones

Resources