show/hide div during business hours, mix with UTC? - javascript

UPDATE
I have added a current working fiddle, I feel like it should be correct, but it doesn't seem to work.
https://jsfiddle.net/bill9000/yadk6sja/2/
original question:
what I have is some code to show/hide div (basically show div during certain business hours) - is there an easy way to make this use a calculate from UTC... so that the show/hide time is fixed on a certain timezone. eg. 6pm EST instead of 6pm users time... here's my current code:
var d = new Date();
var dayOfWeek = d.getDay();
var hour = d.getHours();
var mins = d.getMinutes();
var status = 'open';
if (dayOfWeek !== 6 && dayOfWeek !== 0 && hour >= 03 && hour < 15){
//if (hour=='10' && mins < '30'){
// status = 'closed';
// }else{
status = 'open';
// }
}else{
status = 'closed';
if (status=='open') {
$b('.orderby').show();
}else{
$b('.orderby').hide();
}
also, I have some other JavaScript that's getting the UTC diff:
function ShowTime() {
var now = new Date();
var diff = now.getTimezoneOffset() / 60; //the difference between local PC and UTC
diff = diff - 4; //the difference between UTC and EST
var hrs = 18-(now.getHours()+diff); //18 is the target hour
any way of making the show/hide work for the specific time?

Date() objects are already UTC, when you use d.getDay() or d.getHours(), the local timezone is applied on the fly.
You just have to use d.getUTCDay(), d.getUTCHours(), etc. to prevent this

Related

How to compare two times in javascript

I'm struggling to compare two times.
I need to print Current class going based on the current time.
Example: current time based class going on the college/school
var now = new Date();
var TwentyFourHour = now.getHours();
var hour = now.getHours();
var min = now.getMinutes();
var mid = 'PM';
if (min < 10) {
min = "0" + min;
}
if (hour > 12) {
hour = hour - 12;
}
if (hour == 0) {
hour = 12;
}
if (TwentyFourHour < 12) {
mid = 'AM';
}
Current_time = hour + ':' + min + ':' + mid;
start_time = "09:00:PM";
end_time = "10:00:PM";
if (parseInt(start_time) <= parseInt(Current_time) || parseInt(end_time) >= parseInt(Current_time)) {
console.log("C programming class is going");
} else {
console.log("No class are avalible");
}
OUTPUT:
C programming class is going....
It seems you are looking for the shortest path to have your homework done.
Please check the references for Date function:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date
Some tips:
Make sure you understand how the Date object is created. You can use strings!
If you want to define date manually using each day, month , value, you can!
Check your strings.. are you sure "09:00:PM" is a valid string for date?
Are you sure you can use parseInt for parsing dates?
Anyway, you need to do more research.
The easiest way to check if a time is between a start and an end time is to store the time using unix time(https://en.wikipedia.org/wiki/Unix_time). It represents the time in seconds after 00:00:00 UTC on 1 January 1970. so you can do the following:
const startTime = 1624802400 // 27.6.21 16:00
const endTime = 1624809600 //27.6.21 18:00
const currentTime = Date.now()/1000
if(currentTime < endTime && currentTime > startTime){
console.log('Class is going')
}
if(currentTime > endTime){
console.log('Class ended')
}
if(currentTime < startTime){
console.log('Class has not started')
}
Date.now() returns the current time in milliseconds so you need to divide it by 1000

Script to open URL only on first Friday of the month and between 8am-10am

I'm working in Virtual Tour Software with Javascript and want to make an action, which will open an URL (with photo panorama) ONLY in particular part of time (in that case it's first Friday of month and only between 8am and 10am). Any ideas? Thanks Michal
For now I got somethink like this:
var startDate = new Date('Jun 5, 2020 8:00:00').getTime();
var endDate = new Date('Jun 5, 2020 10:00:00').getTime();
setInterval(function() {
var now = new Date().getTime();
var visible = now > startDate && now < endDate;
var hotspot = this.getPanoramaOverlayByName(this.getMediaByName('Panorama'), 'Hotspot');
if(hotspot && hotspot.get('enabled') != visible)
hotspot.set('enabled', visible);
}.bind(this), 1000);`
The problem is that I need to change "var start" and "var end" every time. I want to make it visible on every First Friday of month.
you can use getday() and getdate() function in js to find the day which is friday and date which is less or equal to 7 whatever the month and year is.
you can add following in your code like this:
var d = new Date();
var startDate = d.getDate(); // this will gives you only date
var isFriday = d.getDay(); // this will gives index of the day
var n = d.getHours(); // add this new line gethours
if((startDate <= 7 && isFriday == 5) && (n >= 8 && n <= 10)) // as indexing 5 for friday
{
setInterval(function() {
var hotspot = this.getPanoramaOverlayByName(this.getMediaByName('Panorama'), 'Hotspot');
if(hotspot && hotspot.get('enabled') != true)
hotspot.set('enabled', true);
}.bind(this), 1000);
}
try this.

If startTime is lesser than currenttime how to calculate proper time in this case?

I have got restaurants business startTime and endTime for the todays date .
I have a requirement as such when clicked on Order now button depending on the Restaurants startTime and endTime i need to display a alert meesage
saying services will resume with in next XX Minutes
This is my code
var startTime = '04:00 PM';
var endTime = '5:30 PM';
var now = new Date();
var startDate = dateObj(startTime);
var endDate = dateObj(endTime);
var openorclosed = now < endDate && now > startDate ? 'open' : 'closed';
if(openorclosed=='open')
{
alert('Restaurant is Open');
// do nothing
}
else if(openorclosed=='closed')
{
var diffinMinutes = getMinutesBetweenDates(startDate,now);
var minutes = Math.floor(diffinMinutes);
alert('service not available for the next '+minutes+' min');
}
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;
}
function getMinutesBetweenDates(startDate, now) {
var diff = startDate.getTime() - now.getTime();
return (diff / 60000);
}
If the startTime is bigger than the Current time then its working perfectly (Displaying correclty)
However if the startTime is lesser than the Current time then its displaying values in negative values
Could anybody please let me know how to display correclty within minutes incase startTime is lesser ??
This is my jsfiddle
http://jsfiddle.net/wajzvqqx/1/
Thank you very much .
Simple solution:
If your value is negative, add a whole day:
var diffinMinutes = getMinutesBetweenDates(startDate,now);
if (diffinMinutes < 0) diffinMinutes = diffinMinutes + 1440;
var minutes = Math.floor(diffinMinutes);
User this code when the shop is closed:
startDate.setDate(startDate.getDate()+1);
You were calculating start and end date objects from current date.
So if shop is closed for the day, add one more day to the start date.
Fiddle
Try modifying the getMinutesBetweenDate function to get the difference like this:
function getMinutesBetweenDates(startDate, now) {
var diff;
if (startDate > now) {
diff = startDate.getTime() - now.getTime();
} else {
diff = now.getTime() - startDate.getTime();
}
return (diff / 60000);
}

If statement not running inside a setInterval

Here is the code I'm working with
var d = new Date(), // New Date object
M = d.getMonth(), // Month
D = d.getDate(), // Day of the month
h = d.getUTCHours(), // Hours in 24 hour time
m = d.getUTCMinutes(); // Minutes
console.log(M+'/'+D+' '+h+':'+m);
var href = location.href;
if(M == 1 && D == 13 && h >= 21 && m >= 17){
// It is time so lets just go there
window.location = href+'live';
}else{
// It isn't already time so lets check every 30 seconds
setInterval(checkTime, 1000)
}
function checkTime() {
if(M == 1 && D == 13 && h >= 21 && m >= 17){
// It is time so lets just go there
window.location = href+'live';
}
console.log('checked time');
}
I'm trying to check the date and time and if it's the correct date and time, forward to a different page, if it's not, then check every few seconds (every 1 second for now but I'll probably bump this up to 15 or 30) and check again and if it is now the correct date and time then forward to the new page.
The first if statement works but it doesn't seem to be running the if statement inside of the set interval function.
Maybe I just don't understand how setInterval works totally but I can't see a problem with me code.
Because you are NOT updating the variables, the values never change.
You need to do the date object check every time. They do not update.
The following
d = new Date(), // New Date object
M = d.getMonth(), // Month
D = d.getDate(), // Day of the month
h = d.getUTCHours(), // Hours in 24 hour time
m = d.getUTCMinutes(); // Minutes
needs to be in your checkTime method.

How do I change a picture during the weekends with javascript?

I want to show on our site when the chat is available. The problem is that it won't be open in the weekends. How do I exclude them? Can it be done?
<html>
<body>
<script type="text/javascript">
function chatonoff(){
var now = new Date();
var hour = now.getHours();
if (hour >=9 && hour <=18)
{
document.getElementById("chat").src = "/bilder/butik/chat-open.png";
}
}
</script>
<img id="chat" src="/bilder/butik/chat.png" onload="chatonoff()">
</body>
</html>
You could do like this
function chatonoff(){
var now = new Date();
var hour = now.getHours();
var day = now.getDay();
//Check if weekend : in this case, I assume that saturday == 6 and Sunday = 0
//It depends on your location / timezone
if(day != 6 && day != 0)
{
if (hour >=9 && hour <=18)
{
document.getElementById("chat").src = "/bilder/butik/chat-open.png";
}
}
}
EDIT
About excluding hollidays :
You should create an array with all the off dates. Then, check if the curent day is present in the array
var offDaysListArray = ['2013-01-01','2013-01-02'];
var now = new Date();
var y = now .getFullYear();
var d = (now .getDate() < 10) ? '0'+now .getDate() : now .getDate();
var m = ((now .getMonth()+1) < 10) ? '0'+(now .getMonth()+1) : (now .getMonth()+1);
//Check if it is a closed day
if(offDaysListArray.indexOf(y + '-' + m + '-' + d) != -1)
return false; //It is a close day
Be carefull with indexOf, old browser like IE8 doesn't implement this function. Check Why doesn't indexOf work on an array IE8?
This is a very simple answer, although it won't exactly work as you want it to as JavaScript is run on the client side.
This means that someone on the other side of the world will be able to see your chat on HIS FRIDAY even though it is a SATURDAY for YOU (A Sunday/Monday example also works here). Ideally you would solve this by using some server side language such as Java / .NET / PHP or whatever you are using.
Here is your quick JavaScript fix:
<html>
<body>
<script type="text/javascript">
function chatonoff(){
var now = new Date();
var hour = now.getHours();
var day = now.getDay();
if (hour >=9 && hour <=18 && day >= 1 && day <= 5)
{
document.getElementById("chat").src = "/bilder/butik/chat-open.png";
}
}
</script>
<img id="chat" src="/bilder/butik/chat.png" onload="chatonoff()">
</body>
</html>

Categories

Resources