How to set application wide timezone in angularjs using momentjs - javascript

I have a server storing timestamps in one timezone and users living in a another timezone. I had the impression that momentjs timezone acted as a kind of decorator, and if I defined a timezone
moment.tz.setDefault("Europe/Copenhagen");
then subsequently usage of moment functions will use timezone defined
var date = moment(timestamp_from_server).calendar()
In my case adding one hour to all timestamps. But obviously does that not work.
Is it possible to set a "global" or app-wide timezone, so I not have to convert each and every timestamp in code, and just can rely on momentjs methods? Any suggestion, also alternatives is highly appreciated.
Note: I am using AngularJS, setting timezone in
app.run(function(...) {
...
moment.tz.setDefault("Europe/Copenhagen")
})
but I don't think that have any importance.

You can achieve this using angular moment
If you don't want to use this module
You can create a factory or service for momentjs and use dependency injection to use everywhere in the application
Create a decorator that will set the default timezone, this will help for a consistent timezone in entire application.
Update based on comments:
If you start a new project from scratch it may be easier to use angular moment
othrewise the decorator or app.run or setting in service itself is very eassy. but when applying a timezone in an existing project make sure that the change in timezone is not affecting the existing date functions using momentjs
A simple implementation of setting default timezone with factory
Since factory is singleton it will be created only one
https://embed.plnkr.co/wmv11KEuJt6XJvgs5eY8/

Related

How to set given time zone as default instead of system time zone in Flatpickr?

Flatpickr is using the Date object internally and that always uses the local time of the computer as the default time.
I m using Flatpickr version 4.6.6
Is there any way to set given time zone for flatpickr?
According to their issue tracker on the matter, it is not currently possible to set timezone with flatpickr. So you stepped into one of the component's limitations
I suggest you join the people voting for this to be built, or try using another gadget as a replacement.

difference between moment js functions and javascript date functions [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
Actually i am thinking about to use moment.js in my new project.because my new project is a employee working sheet application.
I read the moment.js documents.
We can get the current date by using the below code in moment.js
moment().valueOf();
We can get the current date by using javascript
new Date()
The both are giving same result. with same speed (so no performance issue )
also formatting, get methods and set methods are already has javascript. then why i go to moment.js?
Please give me some explanations about the difference's. And let me know which one is best for my new project.
Moment.js
A lightweight JavaScript date library for parsing, validating, manipulating, and formatting dates.
Reason why we use Moment.js - Many web applications today, especially social ones, deal with the concept of time. They are usually employed to sort events or posts, or to mark the moment in which something happens. You can think of your Twitter timeline or your GitHub news feed. JavaScript has a Date object that you can use to manipulate dates, but it often doesn’t have all you need in your web applications
The Moment.js library not only parses dates from strings, but it may also be used to validate, manipulate, and format dates. It supports internationalization, which is so important with dates, as well as human-friendly formatting like "Last Friday at 9:48".
These are all good things for sure, but today's order of the day is date parsing, so let's get into how that works.
Moment.js creates a wrapper for the Date object rather than extend it. To reference the wrapper object, simply call the moment() getter function. The Moment prototype is exposed through the moment.fn property, so you can add your own functions to it if you are so inclined.
Courtesy of
Managing Dates and Times Using Moment.js
A Roundup of Popular JavaScript Date Parsing Libraries: Moment.js
Moment.js is convenient when you want to manipulate Dates.
An Example for moment is given below
moment()
.add(7, 'days')
.subtract(1, 'months')
.year(2009)
.hours(0)
.minutes(0)
.seconds(0);
moment().endOf('day').fromNow();
But if formatting, getting and setting is all you need, you might not need a library for that.
Obviously, I would suggest to go with moment.js. It is one of the most popular Date parsing library.
moment.js has a various inbuilt function's available which is easy to use.
It will save your development time.
Manipulating and parsing dates is very easy.
It comes down to what you're trying to do.
MomentJS provides an API that pretty-much wraps the native Date object, which is why you call .valueOf. new Date is simply giving you the native Date objects (and to manipulate it using moment, you'd need to pass it to its constructor).
I would say general rule of thumb:
If you're creating a date for use on the site or as some kind of UI element, use Moment.
If you're storing a date back to a service layer, use Date.
If you're working in a method that's manipulating the date, use Moment; If that then needs to be passed to another service layer, call .valueOf and save it off.
Moment is great for the UX, but isn't a "standard" (and therefore wouldn't be ideal for serialization/storage).
Moment.js has a good support for adding, subtracting, advanced formatting, finding differences between two days. Also it has internationalization support so you can convert to any language very easily.
just like any library comes with a purpose to aid with something and make it easy to work. momemt.js makes working with dates PAINLESS.
working with dates considering the timezone and formats factors etc is very difficult, but moment.js makes it a breeze to work with dates.
read more here

Get UTC time given TZID and local time

I am trying to parse the .ics file in my application. My application has server side java layer and client side javascript part to it. I am using ical4j library to parse it.
Problem is DTSTART of the event is not in UTC format sometimes. And whenever it is not in UTC .ics file has VTIMEZONE component which I am parsing and getting TZID property from it.
Java layer finally send JSON to client. In the above mentioned case DTSTART, DTEND and TZID are being sent in JSON.
Client has to convert DTSTART and DTEND to UTC using TZID. I tried with moment.js since i could not find any other api which can do this.
moment.tz("2014-02-06 05:30", "NorthAmerica/Eastern").format()
With moment.js below is the error I get,
TypeError: Cannot call method 'rule' of undefined
But below code works fine,
moment.tz("2014-02-06 17:30", "America/Toronto").format()
Is it not possible to use TZID as is (i.e NorthAmerica/Eastern) from .ics file?
Also Is there any other way or JS library which can give me UTC with all timezones and also considering Observance?
you should be aware that the icalendar specification RFC5545 clearly states in the TZID, that:
This document does not define a naming convention for
time zone identifiers. Implementers may want to use the naming
conventions defined in existing time zone specifications such
as the public-domain TZ database [TZDB]. The specification of
globally unique time zone identifiers is not addressed by this
document and is left for future study.
so clearly while America/Toronto is listed in Olsson database (see here), America/Eastern is not which explains why your JS library cannot recognize it.
For a robust design you would need to either convert on server side to UTC or to have an actual JS class capable to parse ICS VTIMEZONE component.

Set global time zone

I am using Moment.js to handle dates in my web application. The server returns all the dates in milliseconds UTC. Now, I have to display the dates applying a specific timezone (based on the user settings).
Is there any way to set the timezone globally instead of changing all the calls to momentjs to handle it?
You can set the default timezone in Moment by using:
moment.tz.setDefault(String);
For example
moment.tz.setDefault("America/New_York");
npm install moment-timezone
var moment = require('moment-timezone'); and use this object
instead of usual moment.
moment.tz.setDefault(String); where String is a time zone
identifier.
For example:
var moment = require('moment-timezone');
moment.tz.setDefault("America/New_York");
Docs: https://momentjs.com/timezone/docs/
Use the moment-timezone library found on the same website: http://momentjs.com/timezone/
It let's you do things like:
moment(utcDateTime).tz(settings.timezone).format(settings.dateFormat);
I recommend implementing a user class/object that has a service function for translating UTC to the user's timezone. Have a look at this fiddle:
http://jsfiddle.net/guidosch/ofd4unhu/4/
The dates are served as UTC, but the view uses the date formatting method of the user class to adjust and format the UTC date according to the user's preferences.
Having run into this problem in the past, my solution was to create a moment factory that provisioned moment objects rom a base configuration. You can make it as transparent as requiring moment - referencing your package and using the class just like moment - but in reality you are calling a moment wrapper object that provisions the moment implementations with the selected timeZone.
I've not done extensive testing, but it looks right on cursory tests. I was able to do this with Moment Timezone 0.0.1:
var serverTimezoneOffset = <?php echo timezone_offset_get(new DateTimeZone(date_default_timezone_get()), new DateTime('now')) / -60; ?>;
moment.updateOffset(new Date().getTimezoneOffset()-serverTimezoneOffset);

Change timezone in Arshaw FullCalendar

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

Categories

Resources