Display time in the local time around the world by JavaScript

thumbnail

I tried updating blog every day for the past week, I will pace back from next time and update it only for the weekend. OTL In each case, if I have what to write, I will update. But I will just seriously write for the weekend.

If I update every day, there’s no time to research details. It’s not “A Nitpicking Man” already. I feel like I’m wasting themes.

As the schedule is changed, I changed “Update almost every day” into “Update on every Sunday”.

Actually this blog is designed to be switched between English and Japanese. It’s for the whole world. (-д☆)キラッ So I need to consider about timezone.

For example, when it’s Sunday in Japan, it’s Saturday in America.

Coordinated Universal Time

In the past, we decided the world standard time based on the Greenwich astronomical observatory in England. It’s is called GMT.

However, now more precise cesium atomic clocks are used. This is the time called UTC. Japan is UTC + 9.

Expression

In Japan, we usually also use military time. But it’s confusing in many country. If you wanna express time for world, you need to consider about this too.

Flow

First of all, decide what time you update. I set it as “11:55”.

And you can convert it to Coordinated World Time on this site. It was 2:55 AM.

Set this time as the Coordinated Universal Time in the Date object, and get the date and time as local time.

Calculation

I prepared a calendar for this month.

Today is 16th, so Sunday is 19th after 3 days. So, create a Date object and let it go forward for three days.

A Date object expresses days numerically.

Sunday Monday Tuesday Wednesday Thursday Friday Saturday
0 1 2 3 4 5 6

For example, from Monday to Wednesday, 3 - 1 = 2 So it takes two days.

However, from Thursday to Sunday, 0 - 4 = - 4 It became negative.

When calculating Sunday after one week as (0 + 7) (0 + 7) - 4 = 3 It is 3 days properly.

However, if you calculate Monday through Wednesday in the same way, (3 + 7) - 1 = 9 After nine days, it will be Wednesday two weeks later, not the next Wednesday.

Let’s get the remainder divided by seven.

Thursday to Sunday: { ( 0 + 7 ) - 4 } mod 7 = 3

Monday to Wednesday: { ( 3 + 7 ) - 1 } mod 7 = 2

When it’s generalized, { ( Next x day of the week + 7 ) - today’s day } mod 7 = y days

Program

So I made it like this below.

var days = [
  "Sunday",
  "Monday",
  "Tuesday",
  "Wednesday",
  "Thursday",
  "Friday",
  "Saturday"
];

var today = new Date();
var tdy = today.getUTCDay(); // day of the week based on Coordinated Universal Time
var tdt = today.getUTCDate(); // date based on Coordinated Universal Time

var release_date = new Date();
release_date.setUTCHours(2); // release hour converted
release_date.setUTCMinutes(55); // release minute converted
release_date.setUTCDate( ( 0 + 7 ) - tdy ) % 7 + tdt ); // even if an argument exceeds 31, it is adjusted

alert( release_date.getFullYear() + ' ' + ( release_date.getMonth() + 1 ) + '/' + release_date.getDate() + '(' + days[release_date.getDay()] + ') ' + release_date.getHours() + ':' + release_date.getMinutes() ); 

Confirmation

Because I am in the Philippines, it was 10:55. Let’s change it to America next. If you change the Mac’s time setting, the browser will also apply it.

Click the time in the upper bar to open the time setting.

Click to change and enter the password.

Uncheck it.

Click on the appropriate place! The time setting has changed with this.

It is Saturday!