CODEWITHSUNDEEP
javascript
O. Aafir
O. Aafir

Reputation: 3

Trying to check on hours AND minutes specific in JS

I'm trying to check on weekday, hour and minutes so I can make a small open closed thing. So far I tried this 

      var todayMins = new Date().getMinutes();
  var today = new Date().getHours();
  var weekday = new Date().getDay();
  if (weekday >= 1 && weekday <= 3) {
      if (today >= 7 && today <= 19 || todayMins >= 30) {
        if (todayMins >= 0 && todayMins <= 30){
         $("#changer").addClass('groen');
         document.getElementById("changer").innerHTML = "Open";
        }
        else {
        $("#changer").addClass('red');
        document.getElementById("changer").innerHTML = "Gesloten";
      }
      }

  }

so for example if its a wednesday and its past 19:30 it should be "gesloten". How can I do this?

Upvotes: 0

Views: 642

Answers (2)

Conan
Conan

Reputation: 2709

As mentioned in the comments above, MomentJS is recommended if you're doing a lot of date / time handling. But if this is a one-off, you can use vanilla JS to do the check:

$(function() {

  var now = new Date(),
    day = now.getDay(),
    hours = now.getHours(),
    mins = now.getMinutes(),
    isOpen = false,
    startTimes = [
      null,                 // Sunday
      { hour: 7, min: 30},  // Monday
      { hour: 7, min: 30},  // Tuesday
      { hour: 7, min: 30},  // Wednesday
      { hour: 7, min: 30},  // Thursday
      { hour: 7, min: 30},  // Friday
      null                  // Saturday
      ],
    endTimes = [
      null,                 // Sunday
      { hour: 19, min: 30}, // Monday
      { hour: 19, min: 30}, // Tuesday
      { hour: 19, min: 30}, // Wednesday
      { hour: 19, min: 30}, // Thursday
      { hour: 19, min: 30}, // Friday
      null                  // Saturday
      ];
      
      // check we have opening times for the given day
      if (startTimes[day] !== null &&
          endTimes[day] !== null) {
          
        // check it's not too early
        if (hours > startTimes[day].hour || 
           (hours === startTimes[day].hour && mins >= startTimes[day].min)) {
          
          // check it's not too late
          if (hours < endTimes[day].hour || 
              (hours === endTimes[day].hour && mins < endTimes[day].min)) {
              isOpen = true;
          }
          
        }
          
      }
      
  // update open / closed status
  if (isOpen) {
    $("#changer").addClass('groen');
    document.getElementById("changer").innerHTML = "Open";
  } else {
    $("#changer").addClass('red');
    document.getElementById("changer").innerHTML = "Gesloten";
  }

});
.groen {
  color: green;
}

.red {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="changer"></div>

EDIT:

When I initially read your question, it sounded as though you only wanted this to apply on Wednesdays, so the 'day of week' check discounts anything other than that day. If you actually meant to perform the check on different days, you'll need to edit the day == 3 section.

For instance, if you want to apply the check between Monday and Wednesday inclusive, use (day >= 1 && day <=3) (although note, this will mean the result will show "Open" for any time during Thursday to Sunday, which probably isn't what you want).

EDIT 2: Code updated to check start / end times on weekdays.

EDIT 3: Code updated again to handle multiple start / end times during the week.

Upvotes: 0

Tonmoy Saha
Tonmoy Saha

Reputation: 702

Weekdays start from 0 . Means Sunday= 0 to Saturday=6 . According to your code it will check only from Monday to Wednesday. 

if (today <= 7 && today >= 19 ) {
      if (todayMins > 30){
        $("#changer").addClass('red');
        document.getElementById("changer").innerHTML = "Gesloten";
     }    
    else{
     $("#changer").addClass('groen');
     document.getElementById("changer").innerHTML = "Open";
  }
}

You can write like this also so for a particular day if the time cross 19.30 then it will change to 'gesloten'

Upvotes: 1

Related Questions