Set the date () at midnight to the time zone of users using the moment. Js

I use moment.js to display the UTC date in the users local time zone:

var date = new Date(Date.UTC(2016,03,30,0,0,0)); var now = new Date(); var diff = (date.getTime()/1000) - (now.getTime()/1000); var textnode = document.createTextNode(moment(date).format('dddd, DD.MM.YYYY') + ' a las ' + moment(date).format('HH:mm A')); document.getElementsByClassName("date")[0].appendChild(textnode.cloneNode(true)); 

Then I use a variable diff , to show a countdown timer.

I would like to show a different countdown timer for each in their local time zone. (Using the difference before midnight in your time zone, not in UTC)

But I try my best to make it work. Instead of using var date = new Date(Date.UTC(2016,03,30,0,0,0)); I probably need to use some moment.js function that gives me until midnight in users timezone.

The best example would be the new year. If I use UTC, everyone will have the same counter (9 hours left), but in different parts of the world this does not make sense. For someone in Australia, this should be 2 hours, and for someone in the US, 14 hours.

+5
source share
2 answers

I'm not sure I fully understand your question, but I will give you general advice and advice.

  • When using the moment.js function, there is very little need to use a Date object. Use it only to interact with other APIs that expect a Date object.

  • To get the moment in UTC, just use moment.utc(...) , passing the appropriate arguments like moment.utc([2016,3,30]) or moment.utc('2016-04-30') at midnight April 30, UTC.

  • If you want to convert this back to local user time, use the .local() function. For example, moment.utc('2016-04-30').local() will create a moment with equivalent local time for the provided UTC time.

  • If you need time in the user's local time, it will be moment(...) , for example moment([2016,3,30]) or moment('2016-04-30') at midnight on April 30 local time.

  • You can separate two moments using the diff function, which can give an answer in specific units, for example m1.diff(m2, 'seconds') , where m1 and m2 are objects of the moment.

  • You do not need to call twice format . Just encapsulate any text you want to display with square brackets. .format('dddd, DD.MM.YYYY [a las] HH:mm A')

  • You can take a look at local moment support. If I'm not mistaken, “las” indicates Spanish, however it is not always “las”, but sometimes “a la” if it is 1 o’clock. In addition, the moment uses only these words in its .calendar() function, for example, when creating phrases like "mañana a las 13:17" . A typical date formatted in .format('LLLL') in Spanish would look something like this: "sábado, 19 de marzo de 2016 13:17" . So, you can check that "las" is exactly what you want in each case.

  • The title of this question was how to set the date before midnight. For this, I recommend using the startOf moment startOf . m.startOf('day') sets the moment m at the beginning of the day, which is usually midnight. Keep in mind that not every local day starts at midnight in every time zone. Due to anomalies such as daylight saving time , some days may start at 1:00. For example, this happens in Brazil on October 16 this year.

    In addition, if you created a moment in UTC, you can first convert it to local mode before setting it at the beginning of the day. If you do not want to change the original moment object, be sure to first clone it.

    Putting it all together:

     var m1 = moment.utc([2016,3,30]); var m2 = m1.clone().local().startOf('day'); var now = moment(); var diff = m1.diff(now, 'seconds'); 
+19
source

So the answer is quite simple (sorry, not trying to make you feel stupid;))

 var date = new Date(Date.UTC(2016,03,30,0,0,0)); var localDate = new Date(2016,03,30,0,0); var now = new Date(); var diff = (localDate.getTime()/1000) - (now.getTime()/1000); var textnode = document.createTextNode(moment(date).format('dddd, DD.MM.YYYY') + ' a las ' + moment(date).format('HH:mm A')); document.getElementsByClassName("date")[0].appendChild(textnode.cloneNode(true)); 

Using the default constructor for a Date object gives you a local date / time object in JavaScript.

0
source

Source: https://habr.com/ru/post/1245365/


All Articles