Change timezone in Arshaw FullCalendar - javascript

From my understanding, Arshaw FullCalendar displays events according to the timezone of the local computer's operating system. I assume this is done by the javascript Date() object, which also is based on the local computer's operating system. I have an application that has group calendars and a group timezone, I want to be able to force every local Arshaw Calendar to display according to that group's time-zone, no matter what timezone that computer is. How do you do this?
Note: I've looked through the documentation fairly thoroughly, and found no such option. I'm hoping that javascript has something equivalent to php's date_default_timezone_set(), which seems to me the way this could be solved.
*Edit 1/31/2013 12:23pm CST:
I am sending everything to the calendar as unix timestamps, so I assume the option ignoreTimezone would not apply here, as described in this stackoverflow thread:
jQuery FullCalendar timezone synchronization

You should probably try to set the option "ignoreTimezone" to "false" and give to Arshaw FullCalendar date in ISO8601.
You can get more information about that here: http://arshaw.com/fullcalendar/docs/event_data/ignoreTimezone/
To convert unix timestamps to ISO8601, you can use this in javascript:
var d = new Date(1360412434000).toISOString();
This is ECMAScript 5.
See here for compatibility and fallback code: https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Date/toISOString

Related

Dealing with time in different timezones react/javascript (PST/PDT)

So I have this use case where a user should be able to enter data into a react site having an order_fulfilment_datetime_str which is supposed to be a RFC 3339 datetime string according to the specs of the api this would be posted to.
So essentially a user(in any timezone) selects a (future) date and time (using a plugin such as react-datepicker) assuming that the date time is going to be in PST/PDT.
But the plugin and javascript date object returns the selected date time in the browser's timezone. So I have two things to solve:
How do I make sure that selected date/time is in PST/PDT
How to deal with DST?
Currently what I am trying to do is to simply get individual date, hours, minutes using getHours(), getMinutes(), getDate() to form the string. But again then how will I find out if this selected datetime has offset of -8 or -7(i.e. PST/PDT)?
I checked date-fns and date-fns-tz library but was not sure how to solve this issue using these.
You can use luxon library for setting a global timezone that you want, and then whenever a user selects a date-time using a date-time picker you can simply convert that into the timezone you want.
import { Settings } from "luxon"
Settings.defaultZone = <time-zone>
The above code snippet will set a default zone for the app
Now when a user selects a date-time convert it to the timezone you want using the below code
DateTime.fromISO(dateTimeValue, { setZone: true})

Date Picker get Date in given timezone instead of local time

In my react application, when i creating a new date object for date-picker using moment-timezone package(with different timezone), the time is automatically converting to the local system time + the chosen timezone time.
Is there any way to create a new date object with set a timezone on client side?
i am using moment-timezone for globalization and Meteor Js for back-end
If I understand correctly, your issue is that you want to provide a Date Picker UI that automatically generates a Date object from the selected date and user time zone setting (retrieved from your database), but what you get is a date in user's local time (hence may already have some timezone offset) + the user time zone offset setting.
You have mainly 3 possible solutions:
Have the Date Picker UI always provide a date in UTC (typically at midnight UTC), then add your user's timezone offset setting.
Have the Date Picker UI take your user's timezone setting as a configuration, so that when it automatically generates a Date, it uses that timezone offset configuration.
Have the Date Picker UI provide a Date in the browser local time, then shift it to UTC, then add your user's timezone offset setting.
Option 1 DatePicker in UTC: I have not seen any library that provides such option, but it does not sound too weird, so you may find one that does. Or you may fiddle with the component code... which is probably overkill compared to option 3.
Option 2 DatePicker with timezone configuration: from your comment, this sounds like what you expect. Unfortunately, I have not seen any library that offers such feature either. As this sounds even more specific than option 1, it is unlikely you can find such a library.
Option 3 local time shift to UTC then add user timezone: this is the standard practice to achieve the objective of generating a Date in a given timezone, starting from a Date in local time, due to all DatePicker UI working just with local time to simplify things. As to shift local time to UTC, you should have plenty questions and answers on SO already.
In case you have to provide an initial value to your Date Picker UI (typically a previous value from database), then make sure to perform the reverse operation, i.e. subtract your user's timezone offset setting to get a date in UTC, then shift to browser locale time. I have seen applications that neglect this part and have incorrect date when the local time has a negative offset to UTC.

Using moment.js, can my date or my date timezone change if I use a VPN?

I'm new with javascript and I am using moment.js.
My code is const date = moment().
Let's supposed one of my website's user (A) is using a VPN, locating him to an area using a different timezone. The other user (B) is using the website in the same country but with no VPN.
Will the value of date be different for the two users, and will it's timezone be the same?
Thanks in advance!
Not necessarily, although it has nothing to do with the IP address/VPN usage.
The date, time and timezone that new Date() will give is entirely dependant on the host OS configuration. There's even no way you can guarantee that 2 machines on the same network have the same/different time or date.

JavaScript : Convert TimeZone Offset to TimeZone String (Eg: "-5.00" to "CST")

I am getting a timezone offset as "-5.00" from a service response and I need to format it in the UI as CST. How do I convert this in JavaScript? I searched and am not sure there is any direct method in JavaScript.
I would look at using Moment. It provides a full timezone library. You may be able to make use of it still depending on your requirements and situation.
http://momentjs.com/timezone/

Date format on client browser

I am getting a date from the server as a javascript string(GMT) or unix timestamp(GMT).
I can convert it to a javascript date object with
var date = new Date(string) or var date = new Date(string)
This gives me the date variable with proper system time-zone's time.
Currently I am displaying this- date.toLocaleString()
Which gives me a nicely formatted date/time according to my system locale and time zone.
I am using this to automatically accomodate for DST if the client browser follows it.
Previously I was required to display this date only in EST, but when the US time started following EDT, I was told to display it in EST. I think this approach would simplify displaying the time/date acoording to user's system time setting.
Is there any disadvantage or possible bug accociated with this approach?
If yes, what would be the best way to display this date in the browser, so that it displays correctly according to the timezone(accomodating DST if any) in which the user(cient browser) is?
As pointed out in the comments, the output may be different depending on the users settings. A more reliable and flexibe solution is moment.js, which is a great library.
moment("2013-04-04", "YYYY-MM-DD").format("MMM Do YY"); //"Apr 4th 13"

Categories

Resources