We Keep Coding

JavaScript Date object in another time zone, how to render office hours? [duplicate]

This question already has an answer here:
new Date() for a specific timezone in JavaScript
(1 answer)
Closed 5 years ago.
This seemed fairly trivial but I might be over-thinking it.
I would like to render my chat widget between 9AM(PST) and 5PM(PST) mon-fri
Using new Date() always puts time into the browsers time zone. Basically i need to instantiate a date in PST and check if between days and hours.
var d = new Date();
var day = d.getDay();
var hour = d.getHours();
if (day > 0 && day < 6 && hour > 9 && hour < 17) {
renderChatWidget($('#chat-widget')):
}
I think this is incorrect because it uses the browser time, so if its 9:30AM in London then PST time would be like 2am and it would still render the chat widget...

function calcTime(city, offset) {
// create Date object for current location
var d = new Date();
// convert to msec
// subtract local time zone offset
// get UTC time in msec
var utc = d.getTime() + (d.getTimezoneOffset() * 60000);
// create new Date object for different city
// using supplied offset
var nd = new Date(utc + (3600000*offset));
// return time as a string
return "The local time for "+ city +" is "+ nd.toLocaleString();
}
document.getElementById('title').innerHTML=(calcTime('California', '-7'));
<h1 id="title">Time Zone Example</h1>
This is from this post and I just turned it into a snippet to see it work. You can then use the modified (correct) date through your tests using the correct time zone.

You can use UTC time.
var current_time = new Date;
var utc_time = Date.UTC(
current_time.getUTCFullYear(),
current_time.getUTCMonth(),
current_time.getUTCDate() ,
current_time.getUTCHours(),
current_time.getUTCMinutes(),
current_time.getUTCSeconds(),
current_time.getUTCMilliseconds());

Comparing start time and end time

I know there are many questions asked about this topic here but no one is about the problem I have.
This script is for reservations where the user selects the date and the start and end time and makes a reservation.
I have a form with a date selector input field and two time selector input fields, one for the start time and one for the end time.
The problem is that the store which I'm writing the reservation script for is opened from 17:00 evening to 01:00 morning. So if someone is reserving from 23:00 to 01:00 the start time is always shown as bigger, which results in that the form is not validated.
Does anyone know if there is a solution to this or if there is a validator out there which can do this.
NOTE: I only want to compare the times and I don't want to add another date field.
var timeto=$('#timeto').val();
var timefrom=$('#timefrom').val();
if(timefrom>timeto){
alert('start time should be smaller')
}
So if time from is 23:00 and time to is 00:00 than the alert is shown,but in reality 00:00 is a greater time than 23:00

Just subtract one hour while creating object of date.
var timefrom = new Date();
temp = $('#timefrom').val().split(":");
timefrom.setHours((parseInt(temp[0]) - 1 + 24) % 24);
timefrom.setMinutes(parseInt(temp[1]));
var timeto = new Date();
temp = $('#timeto').val().split(":");
timeto.setHours((parseInt(temp[0]) - 1 + 24) % 24);
timeto.setMinutes(parseInt(temp[1]));
if (timeto < timefrom){
alert('start time should be smaller than end time!');
}

// get the times as strings
start_string = $('#timefrom').val();
end_string = $('#timeto').val();
// define an arbitrary start time since you are only comparing hours
start_time = new Date("May 26, 2016 " + start_string);
// define the end time as the same date + end time
end_time = new Date("May 26, 2016 " + end_string);
// now we need to check if your end time is beyond midnight, if so, we need to add one day to end_time
var stay_length = end_time.getTime() - start_time.getTime();
if (stay_length < 0 {
// end time is beyond midnight, re-calculate end_time with adding one to the day
end_time = new Date("May 27, 2016 " + end_string);
stay_length = end_time.getTime() - start_time.getTime();
} elseif (stay_length > 24 {
// The user probably reversed the times, so show an alert
alert("The start time must be before the end time")
} else {
// The user most likely put in correct times
}

As your times are stored as a string, you can try parsing them to a Date and compare them;
var timeto=$('#timeto').val();
var timefrom=$('#timefrom').val();
if(Date.parse(timefrom) > Date.parse(timeto) > true){
alert('start time should be smaller')
}

I think you should make the time as DateTime to compare easier. Please try this:
var end_time=$('#timeto').val();
var start_time =$('#timefrom').val();
var stt = new Date("May 26, 2016 " + start_time);
stt = stt.getTime();
var endt= new Date("May 26, 2016 " + end_time);
endt = endt.getTime();
if(stt >endt){
//do something
}

How can i make something happen in a time range?

I want a box to popup at 14:00. Later i want it to disappear at 16:00. How can i do this? I am using Android Studio. I want it to be something like this:
if (Calendar.HOUR_OF_DAY > 14) {
Log.d("TIME", "Time Works!");
}

I'm unsure about Android Studio, but for JavaScript alone, you can use the setTimeout() function to invoke some task every X amount of time. Set this up to check the current time every once in a while, and if it's more than 14:00 and less than 16:00, make sure your popup is shown, otherwise close it...
setTimeout(handlePopupVisibility, 60000);
function handlePopupVisibility() {
var now = new Date();
var startTime = dateObj('2:00 PM');
var endTime = dateObj('4:00 PM');
if (now < dateEnd && now > startTime) {
// inside the range, show your element
// (assumes jQuery)
$("#popupID").show();
} else {
// outside the range, hide your element
// (assumes jQuery)
$("#popupID").hide();
}
}
function dateObj(d) {
var parts = d.split(/:|\s/),
date = new Date();
if (parts.pop().toLowerCase() == 'pm') parts[0] = (+parts[0]) + 12;
date.setHours(+parts.shift());
date.setMinutes(+parts.shift());
return date;
}
(stolen from answer here: How to check if current time falls within a specific range considering also minutes )

Trying to get countdown with current time versus the days closing time javascript

http://jsbin.com/ocuceb/6/edit
The above link is where the full code is, I am trying to get a count down timer of how many hours and minutes are left till a business closes.
function countDown() {
var d = new Date();
var hour = d.getHours();
if(hour<10){hour="0"+hour;}
else if(hour>12){hour=hour - 12;}
var minutes = d.getMinutes();
if(minutes<10){minutes="0"+minutes;}
var seconds = d.getSeconds();
if(seconds<10){seconds="0"+seconds;}
var open = weekday[day.getDay()].open.replace(/am/g,'');
var close = weekday[day.getDay()].close.replace(/pm/g,'');
open = parseInt(open,10);
close = parseInt(close,10);
//confused here!
var timeClose = close;
var timeRemaining = Math.floor(d.getHours() - timeClose);
document.write('<br><br>Close At: '+timeClose+"pm<br>Time Remaining:"+timeRemaining);
}
And that is where I am having the trouble, I can get the time of being opened and the time of being closed. Originally I tried this
var timeClose = parseInt(close+':00:00',10);
var difference = Math.floor(d.getDay() - timeClose);
And of course this didn't work, it either said Undefined or NaN I'm not sure how to go about this, the timing is all new to me never needed this though a client asked for this. Where it states the Actual Time, What time they close, and show an image if the time is within the open to close time (basically an Open Neon Sign) and when past closed (a closed Neon Sign)... I figured it would be very simple, though I am having so tricky corners to pass.

JavaScript time does not think in 12-hour format. It thinks in 24-hour format. Change your array of objects to reflect (22 being 10pm):
hours[0]= {open:"8:00:00",close:"22:00:00"};
hours[1]={open:"8:00:00",close:"22:00:00"};
hours[2]={open:"8:00:00",close:"22:00:00"};
hours[3]={open:"8:00:00",close:"22:00:00"};
hours[4]={open:"8:00:00",close:"22:00:00"};
hours[5]={open:"8:00:00",close:"22:00:00"};
hours[6]={open:"8:00:00",close:"22:00:00"};
Also, parsing an int like this could lead to issues:
var timeClose = parseInt(close+':00:00',10);
You should substring everything between the colons to get your desired hours or minutes.
var timeClose = parseInt(open.substring(0,open.indexOf(":")),10);
Also with the way you have it set up, during business hours (or before 10pm), you will always have a negative number because you subtract the current hours from the close time. If it's 8pm and the close time is 10pm, we will have -2 hours remaining? Switch the operands to subtract getHours from time instead:
var timeRemaining = Math.floor(timeClose - d.getHours());
After that, you can probably check timeRemaining for a negative value. If it is negative, that means the business is closed, and you can modify your output message to reflect as such, i.e.
var timeRemaining = Math.floor(timeClose - d.getHours());
if (timeRemaining < 0) {
output = "Sorry we are closed already";
} else {
output = "You have " + timeRemaining + " to come in and shop till you drop";
}

I think a simpler way to do this would be something like this
var now=new Date();
var closing=new Date(now.getFullYear(),now.getMonth(),now.getDate(),21);//Set this to 10:00pm on the present day
var diff=closing-now;//Time difference in milliseconds
if(now.getHours<7){
//It's before opening time
}
else if(diff<0){
//It's after closing time
}
else{
var hours=Math.floor(diff/(1000*60*60));
diff=diff%(1000*60*60);
var mins=Math.floor(diff/(1000*60));
diff=diff%(1000*60);
var secs=Math.floor(diff/(1000));
}
Here is a reference on the time object https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

How do I trigger a function when the time reaches a specific time

I want to trigger a javascript function when the time reaches, say, 3:00 PM.
The time will be assigned dynamically. So is there any javascript function to achieve that??

You just need to calculate the difference between the current time and the target time and use setTimeout() with that value.
For example, depending on how your target browsers parse dates, you could do the following:
function alert3pm() {
alert("It's 3PM!");
}
var timeAt3pm = new Date("1/31/2011 03:00:00 PM").getTime()
, timeNow = new Date().getTime()
, offsetMillis = timeAt3pm - timeNow;
setTimeout(alert3pm, offsetMillis);
Or rather, instead of parsing a date (since that's really inconsistent between browsers) you could do something like this:
function getTimeAtHour(hour) {
var t = new Date();
t.setHours(hour);
t.setMinutes(0);
t.setSeconds(0);
t.setMilliseconds(0);
return t;
}