Using Javascript to Display Business Hours

Tuesday, July 8, 2014

I am in the process of developing a new website for a University Library. It will include a feature to display the hours open on any given day. A lot of libraries do this using some combination of PHP and a back-end database or Google Calendar Integration. For a variety of reasons we cannot do that so I've opted to use Javascript as it is known to work with our CMS (WordPress) without me having to bother the campus webmaster.


My initial approach was to use several different files, each with a switch statement to display hours based on the day of the week. We have 3 types of hours (regular, exam week, and intercession) and only one location. Nevertheless having to swap files introduces a degree of human error.


Thus I decided to use one file. The approach which makes most sense is to get the date, format it like month/number of week in the month (first second, third, etc)/date and use a series of if ... else statements to compare the current date to that and then run a switch statement to pick out the correct hours for the current day of the week.


Problem is the conditional in the first if statement keeps evaluating as true even when its not. Can anybody tell me what I've done wrong? Or is there a better approach to this task?


Here is my code:




var current = new Date(); //creates new date object
var date = current.getDate(); //gets date of month
var weekDay = current.getDay(); //gets day of week
var week_num = Math.floor((date - 1) / 7) + 1; //determines the week in the month
var month = current.getMonth() + 1; //gets month number
var date_formatted = month + '/' + week_num + '/' + weekDay;
//puts date into month/week number/date format
var date_month = month + '/' + date;

var date_test = new Date (2014, 11, 24); //for troubleshooting

if (date_formatted >= '12/3/1') { //begin winter intercession
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM" + date_test;
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '12/2/1') { //begin fall exam week
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Today's Hours: 2:00PM to 12:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 12:00AM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '11/4/1') { //begin Thanksgiving intercession
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '10/4/1') { //resume regular hours after fall break
switch (weekDay) {
case 0:
document.getElementByID("hours").innerHTML="Today's Hours: 2:00PM to 10:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 10:00PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted > '10/3/3') { //Fall break
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted == '10/3/3' ) { //begin fall break
document.getElementByID("hours").innerHTML="Today's Hours: 7:30 AM - 5:00PM";
} else if (date_formatted >= '8/3/1') { //begin fall semester
switch (weekDay) {
case 0:
document.getElementByID("hours").innerHTML="Today's Hours: 2:00PM to 10:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 10:00PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_month >= '8/1') { //begin August intercession
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '6/1/1') { //begin regular hours for summer
switch (weekDay) {
case 0:
document.getElementByID("hours").innerHTML="Today's Hours: 2:00PM to 10:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 10:00PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '5/2/1') { //begin May intercession
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '5/1/1') { //begin Spring exam week
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Today's Hours: 2:00PM to 12:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 12:00AM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '3/3/1') { //resume regular hours after Spring Break
switch (weekDay) {
case 0:
document.getElementByID("hours").innerHTML="Today's Hours: 2:00PM to 10:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 10:00PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '3/2/1') { //begin Spring Break
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '1/2/1') { //begin Spring semester
switch (weekDay) {
case 0:
document.getElementByID("hours").innerHTML="Today's Hours: 2:00PM to 10:00PM";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 10:00PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 7:30AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else if (date_formatted >= '1/1/4') { //Winter intercession
switch (weekDay) {
case 0:
document.getElementById("hours").innerHTML="Closed Today";
break;
case 1:
case 2:
case 3:
case 4:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:30PM";
break;
case 5:
document.getElementById("hours").innerHTML="Today's Hours: 8:00AM to 4:00PM";
break;
case 6:
document.getElementById("hours").innerHTML="Closed Today";
break;
}
} else {
document.getElementByID("hours").innerHTML="Click here for Library hours";
}






http://ift.tt/1n4Ng2S