-
Notifications
You must be signed in to change notification settings - Fork 35
/
CalendarBody.js
124 lines (107 loc) · 4.66 KB
/
CalendarBody.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
;
(function(root, factory) {
if(typeof define === 'function' && define.amd) {
define(['jquery', './DateFormat', './DateLocale', './DateRange', './DateTime'], factory)
} else {
root.CalendarBody = factory(root.jQuery, root.DateFormat, root.DateLocale, root.DateRange, root.DateTime)
}
})(this, function($, DateFormat, DateLocale, DateRange, DateTime) {
return function(calendarContainer, calendarRange, locale, customScroll, disableWeekends, disabledDatesObject) {
var dateCellMap = {}
var dateCellDates = []
var headerTable = $('<table class="calendarHeader">').append(headerRow())
var bodyTable = $('<table class="calendarBody">').append(calendarBody())
var scrollContent = $('<div class="calendarScrollContent">').append(bodyTable)
calendarContainer.append(headerTable)
if(customScroll) {
bodyTable.addClass('overview')
scrollContent.addClass('viewport')
calendarContainer.append(
$('<div class="tinyscrollbar"></div>')
.append('<div class="scrollbar"> <div class="track"> <div class="thumb"> <div class="end"></div> </div> </div> </div>')
.append(scrollContent))
} else {
calendarContainer.append(scrollContent)
}
var dateCells = $('td.date', calendarContainer).get()
highlightToday(dateCellMap)
var yearTitle = $('th.month', headerTable)
return {
bodyTable : bodyTable,
scrollContent: scrollContent,
dateCells : dateCells,
yearTitle : yearTitle,
dateCellMap : dateCellMap,
dateCellDates: dateCellDates,
dateStyles : dateStyles,
getDateCell : getDateCell
}
function headerRow() {
var tr = $('<tr><th class="month"></th><th class="week"> </th>')
$(locale.dayNames).each(function(index) {
//TODO move to DateLocale
var weekDay = $('<th>').append(locale.shortDayNames[(index + locale.firstWeekday) % 7]).addClass('weekDay')
tr.append(weekDay)
})
return $('<thead>').append(tr)
}
function highlightToday(dateCellMap) {
var todayKey = DateFormat.format(DateTime.now(), 'Ymd', locale)
if(todayKey in dateCellMap) {
getDateCell(dateCellMap[todayKey]).addClass('today').wrapInner('<div>')
}
}
function calendarBody() {
var firstWeekDay = calendarRange.start.getFirstDateOfWeek(locale)
var isFirst = true;
var rows = []
while(firstWeekDay.compareTo(calendarRange.end) <= 0) {
calendarRow(rows, firstWeekDay.clone(), isFirst)
isFirst = false
firstWeekDay = firstWeekDay.plusDays(7)
}
return '<tbody>' + rows.join('') + '</tbody>'
function calendarRow(rows, firstDayOfWeek, isFirst) {
rows.push('<tr>')
rows.push(monthCell(firstDayOfWeek, isFirst))
rows.push(weekCell(firstDayOfWeek))
for(var i = 0; i < 7; i++) {
var date = firstDayOfWeek.plusDays(i)
rows.push(dateCell(date))
}
rows.push('</tr>')
}
function dateCell(date) {
var dateCell = '<td class="' + dateStyles(date) + '" date-cell-index="' + dateCellDates.length + '">' + date.getDate() + '</td>'
dateCellMap[DateFormat.format(date, 'Ymd', locale)] = dateCellDates.length
dateCellDates.push(date)
return dateCell
}
function monthCell(firstDayOfWeek, isFirst) {
var th = '<th class="month ' + backgroundBy(firstDayOfWeek)
if(isFirst || firstDayOfWeek.getDate() <= 7) {
th += ' monthName">'
th += locale.monthNames[firstDayOfWeek.getMonth()]
} else {
th += '">'
if(firstDayOfWeek.getDate() <= 7 * 2 && firstDayOfWeek.getMonth() == 0) {
th += firstDayOfWeek.getFullYear()
}
}
return th + '</th>'
}
function weekCell(firstDayOfWeek) { return '<th class="week ' + backgroundBy(firstDayOfWeek) + '">' + firstDayOfWeek.getWeekInYear('ISO') + '</th>' }
}
function dateStyles(date) { return $.trim(['date', backgroundBy(date), disabledOrNot(date), todayStyle(date), holidayStyle(date)].sort().join(' ')) }
function backgroundBy(date) { return date.isOddMonth() ? 'odd' : '' }
function disabledOrNot(date) {
var disabledWeekendDay = disableWeekends && date.isWeekend()
var disabledDay = disabledDatesObject[date.getOnlyDate().date]
var outOfBounds = !calendarRange.hasDate(date)
return outOfBounds || disabledWeekendDay || disabledDay ? 'disabled' : ''
}
function todayStyle(date) { return date.isToday() ? 'today' : '' }
function holidayStyle(date) { return date.getDay() == 0 ? 'holiday' : '' }
function getDateCell(index) { return $(dateCells[index]) }
}
})