Reputation: 2462
I have opening times to show in website.
Mon, Tue, Wed, Fri 10:00 to 18:00
thursday 10:00 to 20:00
saturday: 9:00 to 14:00
Now I need to show up a message on a homepage compare with current time
When it's in this time range. Show message "we were here for you". when it is out of time range eg:monday 18:15 it should say:
"we are here for you again tuesday from 10:00"
How can I do this. Could you please help me?
Code
<script>
$(function(){
$.get('date.json', function(data){
initialize(data);
});
});
function initialize(data) {
$.each(data,function(pos) {
alert(this.day);
});
}
</script>
json
[
{
"day": "monday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "tuesday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "wednesday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "thursday",
"starttime": "10.00",
"endtime": "20.00"
},
{
"day": "friday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "saturday",
"starttime": "9.00",
"endtime": "14.00"
},
{
"day": "sunday",
"starttime": "10.00",
"endtime": "18.00"
}
]
Upvotes: 0
Views: 228
Reputation: 1067
Copy and paste the following to console. I have used exactly the same data provided by you. Feel free to ask any questions or report any issues.
var dataJSON = [
{
"day": "monday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "tuesday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "wednesday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "thursday",
"starttime": "10.00",
"endtime": "20.00"
},
{
"day": "friday",
"starttime": "10.00",
"endtime": "18.00"
},
{
"day": "saturday",
"starttime": "9.00",
"endtime": "14.00"
},
{
"day": "sunday",
"starttime": "10.00",
"endtime": "18.00"
}
];
var d = new Date();
var day = d.toString().split(' ')[0].toLowerCase();
var currHR = d.getHours();
for(i = 0; i<7; i++) {
if(((dataJSON[i].day)).indexOf(day) > -1) {
console.log(day);
console.log(dataJSON[i].starttime + " "+dataJSON[i].endtime)
if(currHR >= dataJSON[i].starttime && currHR < dataJSON[i].endtime) {
console.log("We are here");
} else {
if(i==6) {
i = 0;
} else {
i = i+1;
}
console.log("we are here for you again "+ dataJSON[i].day + " from " + dataJSON[i].starttime +" to " +dataJSON[i].endtime);
}
}
}
Upvotes: 1
Reputation: 2592
<!DOCTYPE html>
<html lang="en">
<head>
<title>Demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
$(function () {
$.get('date.json', function (data) {
initialize(data);
});
});
function checkTime(h, m, a, b, c, d) {
if (a > c || ((a == c) && (b > d))) {
} else {
if (h > a && h < c) {
return true;
} else if (h == a && m >= b) {
return true;
} else if (h == c && m <= d) {
return true;
} else {
return false;
}
}
}
function initialize(data) {
var d = new Date();
var weekday = new Array(7);
weekday[0] = "sunday";
weekday[1] = "monday";
weekday[2] = "tuesday";
weekday[3] = "wednesday";
weekday[4] = "thursday";
weekday[5] = "friday";
weekday[6] = "saturday";
$.each(data, function (pos) {
if (this.day == weekday[d.getDay()]) {
if (checkTime(d.getHours().toString(), d.getMinutes().toString(), this.starttime.split(".")[0], this.starttime.split(".")[1], this.endtime.split(".")[0], this.endtime.split(".")[1]) == true) {
alert("we were here for you");
}
else {
}
}
});
}
</script>
</head>
<body>
</body>
</html>
Upvotes: 1