Sarath TS
Sarath TS

Reputation: 2462

Compare time and show message in jquery

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

Answers (2)

abhiagNitk
abhiagNitk

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

baj9032
baj9032

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

Related Questions