Repeated opening hours-CodePudding

This code works fine except for one bug: every day that the code is active, it prints a constant out-of-hours text (we are closed; Most zárva) from 16:00 to 16:10 CES time zone. What could be the reason for this. I only noticed this problem in this time.

<script>
 var a = document.getElementById("online");
var d = new Date();
var n = d.getDay();
var now = d.getHours()   "."   d.getMinutes();
var onlineweekdays = {
    0: null, //Vasárnap
    1: [6.30, 16.30], //hétfő
    2: [6.30, 16.30], //kedd
    3: [6.30, 16.30], //szerda
    4: [6.30, 16.30], //csütörtök
    5: [6.30, 15.30], //péntek
    6: null //Szombat
};
var onlinedayWorkingHours = onlineweekdays[n]; //Today working hours. if null we are close

if (onlinedayWorkingHours && (now > onlinedayWorkingHours[0] && now < onlinedayWorkingHours[1])) {
  // check if current time is during or beyond 15 minutes before closing time
if (isFifteenMinBeforeOut2(now, onlinedayWorkingHours[1])) {
    a.innerHTML = "rövidesen zárunk."; 
       a.style.backgroundColor = '#fee599'; 
       a.style.color = '#7f6000';
       a.style.textTransform = 'uppercase';
       a.style.fontWeight = 'bold';
       a.style.padding = '0 4px';
       a.style.borderRadius = '3px';
       a.style.marginLeft ='5px';
  } 
  else {
    a.innerHTML = "most elérhető."; 
       a.style.backgroundColor = '#e2efd9'; 
       a.style.color = '#538135';
       a.style.textTransform = 'uppercase';
       a.style.fontWeight = 'bold';
       a.style.padding = '0 4px';
       a.style.borderRadius = '3px';
       a.style.marginLeft ='5px';
  } 
  } else {
     a.innerHTML = "most nem érhető el.";
       a.style.backgroundColor = '#efd9df'; 
       a.style.color = '#c91f41';
       a.style.textTransform = 'uppercase';
       a.style.fontWeight = 'bold';
       a.style.padding = '0 4px';
       a.style.borderRadius = '3px';
       a.style.marginLeft ='5px';
}

function isFifteenMinBeforeOut2(current, clockout) {
    return current >= clockout - 0.10;
}
</script>

CodePudding user response：

The problem is in this expression:

d.getHours()   "."   d.getMinutes();

At 16:05 this will not produce "16.05", but "16.5".

Solve this by not creating a string expression, but a numeric value -- so it has the same type as the values you will compare it with.

Change to:

d.getHours()   d.getMinutes() / 100;

CodePudding user response：

getMinutes() doesn't return leading zeroes. So when it's 16:04, you'll set now = '16.4', not now = '16.04'. The comparison with 16.30 will be wrong then.

It would be better to create your times with correct fractions rather than trying to treat minutes as decimal fractions. So use .50 for half hours rather than .30. And calculate d.getMinutes()/60 to get the fraction from the current time.

var a = document.getElementById("online");
var d = new Date();
var n = d.getDay();
var now = d.getHours()   d.getMinutes()/60;
var onlineweekdays = {
  0: null, //Vasárnap
  1: [6.30, 16.50], //hétfő
  2: [6.30, 16.50], //kedd
  3: [6.30, 16.50], //szerda
  4: [6.30, 16.50], //csütörtök
  5: [6.30, 15.50], //péntek
  6: null //Szombat
};
var onlinedayWorkingHours = onlineweekdays[n]; //Today working hours. if null we are close

if (onlinedayWorkingHours && (now > onlinedayWorkingHours[0] && now < onlinedayWorkingHours[1])) {
  // check if current time is during or beyond 15 minutes before closing time
  if (isFifteenMinBeforeOut2(now, onlinedayWorkingHours[1])) {
    a.innerHTML = "rövidesen zárunk.";
    a.style.backgroundColor = '#fee599';
    a.style.color = '#7f6000';
    a.style.textTransform = 'uppercase';
    a.style.fontWeight = 'bold';
    a.style.padding = '0 4px';
    a.style.borderRadius = '3px';
    a.style.marginLeft = '5px';
  } else {
    a.innerHTML = "most elérhető.";
    a.style.backgroundColor = '#e2efd9';
    a.style.color = '#538135';
    a.style.textTransform = 'uppercase';
    a.style.fontWeight = 'bold';
    a.style.padding = '0 4px';
    a.style.borderRadius = '3px';
    a.style.marginLeft = '5px';
  }
} else {
  a.innerHTML = "most nem érhető el.";
  a.style.backgroundColor = '#efd9df';
  a.style.color = '#c91f41';
  a.style.textTransform = 'uppercase';
  a.style.fontWeight = 'bold';
  a.style.padding = '0 4px';
  a.style.borderRadius = '3px';
  a.style.marginLeft = '5px';
}

function isFifteenMinBeforeOut2(current, clockout) {
  return current >= clockout - 0.10;
}

CodePudding user response：

every day that the code is active, it prints a constant out-of-hours text (we are closed; Most zárva) from 16:00 to 16:10 CES time zone.

I suspect this is only a problem between 16:02 and 16:10.

6.30

This isn't the time 06:30. This is the number 63/10: mathematically, it doesn't behave the same as hours and minutes should.

Instead, store the number of hours (06:30 -> 6.5) or minutes (06:30 -> 390). Your now code should look something like:

var now = d.getHours()   d.getMinutes() / 60;

and onlineweekdays like:

var onlineweekdays = {
    0: null, //Vasárnap
    1: [6.5, 16.5], //hétfő
    2: [6.5, 16.5], //kedd
    3: [6.5, 16.5], //szerda
    4: [6.5, 16.5], //csütörtök
    5: [6.5, 15.5], //péntek
    6: null //Szombat
};

and isFifteenMinBeforeOut2 like:

function isFifteenMinBeforeOut2(current, clockout) {
    return current >= clockout - 0.25;
}

(Note: this version actually uses 15 minutes as its threshold.)

trincot's answer would also solve this issue – but only as long as your closing hours remain at least 15 minutes after the hour. If your closing hours changed to 16.05, then the original check would check whether the current time was after 15.95 – which isn't a real time! In practice, this'd only give five minutes of warning.