How to display Current time of Dallas and australia - javascript

I'm trying to display current time of Dallas and Australia and I have come up with the Code,but it's not working . I'm completely new to Java script and Java here is my code , please help me out in achieving this
<script>
var now = new Date();
var now_utc = now.getUTCHours()-6+":"+ now.getUTCMinutes()+":"+ now.getUTCSeconds()
document.getElementById("inner1").innerHTML+=now_utc;
var aus= new Date();
var aus_time= aus.getUTCHours()+11
document.getElementById("inner2").innerHTML+=aus_time;
</script>
I want to display Current time of Dallas,London,Australia.
Thanks you all.

As once was pointed out by an Apple Engineer: never ever do calendar calculations by yourself. There are tons of small and large pitfalls that most people are unaware of and thus are not taking into account.
If you need an accurate depiction of the (current) time in another Timezone there is no other way then use a library that has all the information regarding Timezones and its peculiarities.
If you do not care about being exact every day of the year then this might be overkill but you have to decide for yourself.
For Javascript there exists the https://github.com/mde/timezone-js library, which itself uses the Olsen Database (https://en.wikipedia.org/wiki/Tz_database).
You have to download the Timezone-Infos and provide them along your source code. Then you can do all that TZ-related calculations/
// 'now' in the Timezone of Chicago (Central Time, should be equal to that of Dallas)
var dt_chicago = new timezoneJS.Date('America/Chicago');
// 'now' in London
var dt_london = new timezoneJS.Date('Europe/London');
// 'now' in Brisbane - you should look up which timezones
// there are in Australia and which you want to display
var dt_brisbane = new timezoneJS.Date('Australia/Brisbane');
I just found out that there is another library http://momentjs.com/timezone/ but I have not used it yet so I may not recommend or advise against using it.

The below piece of code will calculate the current time of any specific time zone. Just pass the time zone of any specific country it will show the current time.
function calcTime(city, offset) {
var d = new Date();
var utc = d.getTime() - (d.getTimezoneOffset() * 60000);
var nd = new Date(utc + (3600000*offset));
return "The local time for city"+ city +" is "+ nd.toLocaleString();
}
console.log(calcTime('Dhaka', '+6.0')));
console.log(calcTime('Australia', '+11.0')));

You use now variable break your script.On live var aus_time you forget semicolon at this line.
As #Traktor53 said in comment AU have multiple timezone.
Your code is OS dependent you will check after change your system time.you will get wrong time. Its better way to use google time API.
function gettz(){
var dnow = new Date();
var dnow_utc = dnow.getUTCHours()-6+":"+ dnow.getUTCMinutes()+":"+ dnow.getUTCSeconds()
document.getElementById("inner1").innerHTML+=dnow_utc;
var aus= new Date();
var aus_time= aus.getUTCHours()+11;
document.getElementById("inner2").innerHTML+=(aus_time);
return;
}
</script>

Related

How to convert any timezone to local timezone in javascript?

The below code converts the date to local timezone:
function convertDateToServerDate(incomingDate) {
var serverOffset = new Date();
serverOffset = serverOffset.getTimezoneOffset();
var outgoingServerDate = new Date((incomingDate.getTime() + Math.abs(serverOffset * 60 * 1000)));
return outgoingServerDate;
}
I have a date in the IST timezone. I'm also in the IST timezone the above function changes the time whereas it should just return it. I also tried converting to UTC then back to the local but the same result. How to get a local timezone and do nothing if the date is already in local time zone?
You can't do this with vanilla Javascript without a library, because the Date class only comprehends two timezones: GMT, and local. (Source]
Libraries like momentjs and date-fns do not merely provide convenient functions, they very importantly also include hard-coded datasets that specify current real-world facts about time zone adjustments, including things like the dates where DST switches. This is vital, because if you look at the map of timezones, you'll see that the boundaries of the different zones are not straight lines. That's because they are determined by humans who made interesting compromises which are then enshrined in custom and law.
Many of those compromises are there so that people who share a jurisdiction can also share a clock. It would be enormously inconvenient for them otherwise, and many people would be adversely impacted every single day.
There is a proposal for a successor to Date, called Temporal, that would remedy this.
Best to use moment library. https://momentjs.com/timezone/docs/
moment().tz(String)
var a = moment.utc("2013-11-18 11:55").tz("Asia/Taipei");
var b = moment.utc("2013-11-18 11:55").tz("America/Toronto");
a.format(); // 2013-11-18T19:55:00+08:00
b.format(); // 2013-11-18T06:55:00-05:00
a.utc().format(); // 2013-11-18T11:55Z
b.utc().format(); // 2013-11-18T11:55Z
The server offset has to be set using INTL, hardcoded or come from the server
So something like this
const serverOffset = -240; // this is static
function convertDateToServerDate(incomingDate) {
const incomingOffset = incomingDate.getTimezoneOffset();
if (serverOffset === incomingOffset) return incomingDate;
console.log(serverOffset-incomingOffset,"difference")
const outGoingDate = new Date(incomingDate.getTime())
outGoingDate.setTime(incomingDate.getTime() + ((serverOffset-incomingOffset) * 60 * 1000));
return outGoingDate;
}
console.log(convertDateToServerDate(new Date()))

Laravel Carbon - Reloading Current Time

I could not find any document in relation to what I am trying to solve, hence I am asking it here.
My controller pulls a Carbon Date using this:
$utctime = Carbon::now()->toTimeString();
That code allows me to display the UTC time on my page. The problem comes in the fact that Carbon only loads the time once (on page load) and it stays at that time. What I want is to Carbon to display the real-time and not require the page to reload.
I am guessing it might not be possible the update the time, as Carbon is not front-end? If so, how would you go about making the time update every second instead of it not updating at all? - Maybe there is something for the front-end that I can use?
Adding a basic ticking clock in Javascript is fairly straightforward:
<div id="time"></div>
<script type="text/javascript">
function showTime() {
var date = new Date(),
utc = new Date(Date.UTC(
date.getFullYear(),
date.getMonth(),
date.getDate(),
date.getHours(),
date.getMinutes(),
date.getSeconds()
));
document.getElementById('time').innerHTML = utc.toLocaleTimeString();
}
setInterval(showTime, 1000);
</script>
This would be entirely front-end based, and ensure there isn't a "jump" between the initially rendered server-time and the user's local time.
You can use moment.js, you can also define the timezone or display UTC time
moment.utc().format();
https://momentjs.com/docs/
https://momentjs.com/timezone/docs/

Create date object that is same for everyone from same timestamp

On my site I am getting the current time via ajax function that returns the servers current timestamp and then creating a date object.
$.post(flipCountdownObj.ajax_url, data, function(response) {
var currentTime = new Date(parseInt(response) * 1000);
alert("Server says the time is " + currentTime.toLocaleTimeString());
// code to create my countdown here...
}
My logic then goes on to compare that date to various other dates to provide countdowns and event status.
My problem is though that everyone is getting different times.
I am in GMT. The server is in EST. For me it says the correct time but people in EST are saying that it is 4 hours out.
I don't understand why this is happening as the timestamp should be the same for everyone.
I saw a post saying about setting UTC time but not sure exactly what I am meant to do. Can anyone shed some light on what I am doing wrong?
This seems to work:
var serverOffset = -300*60000; // -5 hrs is 300 minutes
var usersDate = new Date();
var userOffset = usersDate.getTimezoneOffset()* 60000;
var currentTime = new Date((parseInt(response) * 1000) + userOffset + serverOffset);

Recurring function to reset variable/counter at midnight (moment.js, node.js)

I want to reset a variable during midnight. Every night.
I'm trying to build this function with Moment.js for Node but I can't seem to get the recurring part to work properly.
This is what I got so far.
// Calculate time to midnight
function timeToMidnight(){
var midnight = new Date();
midnight.setHours(0,0,0,0);
var now = new Date();
var msToMidnight = midnight - now;
console.log(' it is ' + msToMidnight + 'ms until midnight');
return msToMidnight;
};
// Reset counter at midnight
setTimeout(function(){
console.log("midnight, do something");
}, timeToMidnight());
How can I best make it recurring at midnight, every night?
Thanks in advance.
If you're using moment, consider instead this implementation
var moment = require('moment');
function timeToMidnight() {
var now = new Date();
var end = moment().endOf("day");
return end - now + 1000;
}
Like your function, this takes now milliseconds and calculates the number of milliseconds until midnight, but this is supported directly when using moment, which is nice. Add 1 extra second (1000 milliseconds) to get to the next day.
A typical pattern is for a function to call itself after a timeout.
function roundMidnight() {
console.log('at midnight');
setTimeout(roundMidnight,timeToMidnight());
}
setTimeout(roundMidnight,timeToMidnight());
Pretty generic, in fact depending on the value returned, you could schedule anything anytime, pretty useful, seem like someone must have thought of that.
node-schedule
A cron-like and not-cron-like job scheduler for Node.
And they did. Maybe what you really want is node-schedule. It looks like it's not really actively developed now, though.

javascript - time counter since start date and time

I have a new business, where I just hired someone to work for me, I am trying to make it easy for her to track her time, so I created a clock in button, that creates a record in a database, I have it pop up a small window, that she can click to clockout when she is done working.
I want it to show her on that popup window a counter that will show how long she has been working, so I want to create a javascript or jQuery that will start at a certain time and count from there. She is on the East Coast, our company is in the Central Timezone, so 1 hour behind her.
How can I get a javascript to start from a certain time and keep updating the timer, so she can see something like this:
[You've been working for: 01:01:01 HH::MM::SS] - and it is actively updating, climbing up.
All the timers I've found are not about time itself, but about starting at a time and counting down, or starting at 0 and counting up.
Is there a way to tell it a start time, so that way if she reloads the page, it does not start from 0, but will start at the time she clocked in, then add the time since and start from there?
I know it can be done, but I'm more of a Perl guy than a Javascript guy. I'm doing this on Wordpress, so I could use PHP and just tell her to refresh the page to see the current amount of time and then have it on page load show the current amount of time, but I think having a counter would be better and make it easier for her.
is there some code already done that I could modify myself to make it work? I cannot find any, anywhere. I'm willing to do all the work, I'm not asking for someone to do it for me.
I found this example someone did:
function get_uptime() {
var t1 = new Date()
var t2 = new Date()
var dif = t1.getTime() - t2.getTime()
seconds = dif / 1000;
Seconds_Between_Dates = Math.abs(seconds);
document.getElementById("seconds").innerHTML = Seconds_Between_Dates;
setTimeout(get_uptime, 1000);
}
get_uptime();
That is sort of it, but I don't now how to put the first time in t1, what format do I put it in?
I can have PHP put it in any format, but not sure the one it needs.
Plus this appears to only put the seconds, not hours, minutes and seconds.
Is there away to do that?
Thanks,
Richard
From your question I understand you store the date and time on start?
So then you can use PHP to echo this information in a starting Date object and let a setInterval-function do the current timegetting and calculation of the time working.
See working example here: http://jsfiddle.net/c0rxkhyz/1/
This is the code:
var startDateTime = new Date(2014,0,1,23,59,59,0); // YYYY (M-1) D H m s ms (start time and date from DB)
var startStamp = startDateTime.getTime();
var newDate = new Date();
var newStamp = newDate.getTime();
var timer; // for storing the interval (to stop or pause later if needed)
function updateClock() {
newDate = new Date();
newStamp = newDate.getTime();
var diff = Math.round((newStamp-startStamp)/1000);
var d = Math.floor(diff/(24*60*60)); /* though I hope she won't be working for consecutive days :) */
diff = diff-(d*24*60*60);
var h = Math.floor(diff/(60*60));
diff = diff-(h*60*60);
var m = Math.floor(diff/(60));
diff = diff-(m*60);
var s = diff;
document.getElementById("time-elapsed").innerHTML = d+" day(s), "+h+" hour(s), "+m+" minute(s), "+s+" second(s) working";
}
timer = setInterval(updateClock, 1000);
<div id="time-elapsed"></div>
Attention! The month number in the new Date() declaration is minus one (so January is 0, Feb 1, etc)!
I would use momentJS fromNow function.
You can get the time started as variable on page load then call fromNow on that and current time to get time between the two every time the clock is clicked:
var StartedWorkDateTime = GetStartedTime();
moment(StartedWorkDateTime).fromNow(true);
Non momentJS:
var date1 = new Date("7/11/2010 15:00");
var date2 = new Date("7/11/2010 18:00");
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffHours = Math.ceil(timeDiff / (1000 * 3600));
alert(diffHours);
reference
Get the difference between two dates by subtracting them:
var duration = end - start;
This will give you the number of milliseconds between the dates. You can use the milliseconds to figure out hours, minutes, and seconds. Then it's just a matter of string manipulation and writing the value to the page. To update the timer once per second, use setInterval():
setInterval(writeDuration, 1000);

Categories

Resources