eventcalendarjs v0.0.1
getMonth(date, startingDay) function returns a calendar object for the month of date object passed in, and startingDay is the day of the week you want your calendar to start on (0 = Sunday, 1 = Monday, 2 = Tuesday,3 = Wednesday,4 = Thursday,5 = Friday,6 = Saturday).
Calendar object includes details of first day of the month, number of days in month, and number of weeks required to display month on calendar with a break down off all weeks and days of the week. If the first and/or last week of the month include dates from previous/next month details of those days are also included.
each day has an "isToday". "Yes" signals that the day is todays date.
Sample month returned:
{
"firstDay": "Friday",
"monthLenght": 30,
"calendarWeeks": 5,
"week1": {
"day1": {
"day": 28,
"month": 2,
"year": 2016,
"date": "2016-03-27T23:00:00.000Z",
"isToday": "No"
},
"day2": {
"day": 29,
"month": 2,
"year": 2016,
"date": "2016-03-28T23:00:00.000Z",
"isToday": "No"
},
"day3": {
"day": 30,
"month": 2,
"year": 2016,
"date": "2016-03-29T23:00:00.000Z",
"isToday": "No"
},
"day4": {
"day": 31,
"month": 2,
"year": 2016,
"date": "2016-03-30T23:00:00.000Z",
"isToday": "No"
},
"day5": {
"day": 1,
"month": 3,
"year": 2016,
"date": "2016-03-31T23:00:00.000Z",
"isToday": "No"
},
"day6": {
"day": 2,
"month": 3,
"year": 2016,
"date": "2016-04-01T23:00:00.000Z",
"isToday": "Yes"
},
"day7": {
"day": 3,
"month": 3,
"year": 2016,
"date": "2016-04-02T23:00:00.000Z",
"isToday": "No"
}
},
"week2": {
... etc.Sample code to loop through and print out calendar
//variable to hold table body
var tableBody = "";
//jQuery AJAX call for JSON
$.getJSON('month/1/' + month + '/' + year, function (data) {
//loop through weeks (based on how many weeks are needed to print full month)
for (var weekNo = 1; weekNo <= data['calendarWeeks']; weekNo++) {
//Print out details for each day of week
tableBody += '<tr>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day1']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day2']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day3']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day4']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day5']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day6']['day'] + '</div></td>';
tableBody += '<td><div class="dateNumber">' + data['week' + weekNo]['day7']['day'] + '</div></td>';
tableBody += '</tr>';
}
//print out calendar
document.getElementById('tableBody').innerHTML = tableBody;
});Similarily the getWeek(date, startingDay) function returns a week object, starting on a chosen day, with a break down of each day based on date passed in
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago