Re: How to set timezone in scheduler.js
Hi! We'll start investigating immediately and get back to you as soon as we can.
Hi! We'll start investigating immediately and get back to you as soon as we can.
Hi.
Your issue is reproduced. We need to do the initial time zone conversion earlier.
I've created a ticket: https://github.com/bryntum/support/issues/6691
Thank you for reporting this to us. The time zone support is very new and is bound to have some issues with different configurations.
Hi Joakim,
Thank you for taking your time and creating the ticket: https://github.com/bryntum/support/issues/6691
I can see that the angular demo I have uploaded recently works as expected. Well done !
Unfortunately, I still can not launch our product to work with time zones.
We have discovered one problem but I believe the another one exists.
The demo, I have recently uploaded, operates on the events and resources, that are passed to the Bryntum scheduler component in the simple array form (I did that for the simplicity).
In our app, we work with Resource and Event stores.
As I mentioned earlier, we work with large data set. Our servers return with e.g.: 10k records (events).
The start and end date returned from back-end are iso strings e.g.: 2023-05-26T12:00:00.000Z
We would like to configure the bryntum scheduler to display that event in the given time zone iana (e.g.: if 'Europe/Sofia' (UTC+3) - the scheduler should display the event at 15:00 for 2023-05-26T12:00:00.000Z start date).
Prerequisites:
My notebook is now in UTC+2
The bryntum scheduler gets 'Europe/Sofia' time zone configuration (UTC+3)
Server return 10k events. One of the event starts at 2023-05-26T12:00:00.000Z
What is happening:
The timeline's headers are in line with Europe/Sofia
The current time line is inline with Europe/Sofia
The event is displayed at 14:00 for 2023-05-26T12:00:00.000Z for Europe/Sofia
What I expect:
The event should be displayed at 15:00 for 2023-05-26T12:00:00.000Z for Europe/Sofia (UTC+3)
In the attached demo, I posted the question/note, what is preferred way of entering the events into the event store.
Based on the documentation, the event store has add method exposed:
add(records: SchedulerResourceModel|SchedulerResourceModel[]|Partial<ResourceModelConfig>|Partial<ResourceModelConfig>[], silent?: boolean): SchedulerResourceModel[];
Should I work on Partial<ResourceModelConfig> or SchedulerResourceModel ?
I can see that SchedulerResourceModel has timeZone property, but I have tried to create the instances of
SchedulerResourceModel and then I can see the errors in the console (see demo, just comment 101 line and uncomment 105)
Best regards,
Kornel
Hi
Thank you for your detailed report. I will investigate and get back to you as soon as I can.
Hi,
any update regarding time zones and event store (last demo I attached) ?
Best regards,
Kornel
It seems that I lost track of this issue, I am sorry about that.
I will investigate and get back to you some time tomorrow...
...CEST
Hello again.
I have tried your sample code and I think I understand your problem and issue.
If you use add
or insert
the project will interpret the data as being in the currently configured time zone. That means there will be no time zone conversion on those record's dates. When loading a new data set, you should always set the data
property of the store. Like so:
this.data$.subscribe((data) => {
// Set new resources and events that the server responds with
this.resourceStore.data = data.resources;
this.eventStore.data = data.events;
});
I updated your example with this code and it works for me. Please let me know how it works for you and if there is anything else that stops you from going forward?
I will also update the time zone guides to be more detailed regarding data loading.
Thank you Joakim,
Thank you for the explanation !
I just didn't know that I should rather be setting the data property of the store instead adding/inserting records ! Really, appreciate it !
I would like to ask more about the following scenario:
We have implemented real time data communication with the server. So when the user entered the app, we load all events, then every X seconds, server is sending us record updates e.g.: event with id X changes start time to Y or event with id X changes resource id to Y.
With this is mind, I would like to avoid setting all data every time record changes. I would prefer to implement mechanism to:
do you have any recommendation, can you think of other store methods that perform time conversion ? or in that case I should rather manually perform time conversion (e.g.: use TimeZoneHelper.toTimeZone) and use add/insert methods ?
Best regards,
Kornel
Hi
In your case I think you would have to convert the events manually before adding them to the store.
There is a setting on Store: https://www.bryntum.com/products/scheduler/docs/api/Core/data/mixin/StoreSync#config-syncDataOnLoad which I guess would help you a bit. But I can see in the code that using syncDataOnLoad will break time zone functionality.
I have created a ticket in which we will fix syncDataOnLoad support in time zone functionality and also provide a solution for adding or updating events with local dates to a time zone converted store.
Hi Joakim,
do you have any update on https://github.com/bryntum/support/issues/7012 ?
Is this ticket going to be progressed in the coming month ?
I'm asking because I don't know if I should start developing the solution with manually transformed times (by us) while adding/inserting records into store (real time data service).
Best regards,
KD