[483] | 1 | define([ |
---|
| 2 | "dojo/_base/declare", |
---|
| 3 | "./_CalendarView", |
---|
| 4 | "dijit/_TemplatedMixin", |
---|
| 5 | "dojo/query", |
---|
| 6 | "dojo/dom-class", |
---|
| 7 | "dojo/_base/event", |
---|
| 8 | "dojo/date", |
---|
| 9 | "dojo/date/locale", |
---|
| 10 | "dojo/text!./Calendar/CalendarDay.html", |
---|
| 11 | "dojo/cldr/supplemental", |
---|
| 12 | "dojo/NodeList-dom" |
---|
| 13 | ], function(declare, _CalendarView, _TemplatedMixin, query, domClass, event, date, locale, template, supplemental){ |
---|
| 14 | return declare("dojox.widget._CalendarDayView", [_CalendarView, _TemplatedMixin], { |
---|
| 15 | // summary: |
---|
| 16 | // View class for the dojox/widget/Calendar. |
---|
| 17 | // Adds a view showing every day of a single month to the calendar. |
---|
| 18 | // This should not be mixed in directly with dojox/widget._CalendarBase. |
---|
| 19 | // Instead, use dojox/widget._CalendarDay |
---|
| 20 | |
---|
| 21 | // templateString: String |
---|
| 22 | // The template to be used to construct the widget. |
---|
| 23 | templateString: template, |
---|
| 24 | |
---|
| 25 | // datePart: String |
---|
| 26 | // Specifies how much to increment the displayed date when the user |
---|
| 27 | // clicks the array button to increment of decrement the view. |
---|
| 28 | datePart: "month", |
---|
| 29 | |
---|
| 30 | // dayWidth: String |
---|
| 31 | // Specifies the type of day name to display. "narrow" causes just one letter to be shown. |
---|
| 32 | dayWidth: "narrow", |
---|
| 33 | |
---|
| 34 | postCreate: function(){ |
---|
| 35 | // summary: |
---|
| 36 | // Constructs the calendar view. |
---|
| 37 | this.cloneClass(".dijitCalendarDayLabelTemplate", 6); |
---|
| 38 | this.cloneClass(".dijitCalendarDateTemplate", 6); |
---|
| 39 | |
---|
| 40 | // now make 6 week rows |
---|
| 41 | this.cloneClass(".dijitCalendarWeekTemplate", 5); |
---|
| 42 | |
---|
| 43 | // insert localized day names in the header |
---|
| 44 | var dayNames = locale.getNames('days', this.dayWidth, 'standAlone', this.getLang()); |
---|
| 45 | var dayOffset = supplemental.getFirstDayOfWeek(this.getLang()); |
---|
| 46 | |
---|
| 47 | // Set the text of the day labels. |
---|
| 48 | query(".dijitCalendarDayLabel", this.domNode).forEach(function(label, i){ |
---|
| 49 | this._setText(label, dayNames[(i + dayOffset) % 7]); |
---|
| 50 | }, this); |
---|
| 51 | }, |
---|
| 52 | |
---|
| 53 | onDisplay: function(){ |
---|
| 54 | if(!this._addedFx){ |
---|
| 55 | // Add visual effects to the view, if any has been specified. |
---|
| 56 | this._addedFx = true; |
---|
| 57 | this.addFx(".dijitCalendarDateTemplate div", this.domNode); |
---|
| 58 | } |
---|
| 59 | }, |
---|
| 60 | |
---|
| 61 | // TODO: This method needs serious work |
---|
| 62 | _onDayClick: function(/*Event*/ e){ |
---|
| 63 | // summary: |
---|
| 64 | // Executed when a day value is clicked. |
---|
| 65 | |
---|
| 66 | // If the user somehow clicked the TR, rather than a |
---|
| 67 | // cell, ignore it. |
---|
| 68 | if(typeof(e.target._date) == "undefined"){return;} |
---|
| 69 | |
---|
| 70 | var displayMonth = new Date(this.get("displayMonth")); |
---|
| 71 | |
---|
| 72 | var p = e.target.parentNode; |
---|
| 73 | var c = "dijitCalendar"; |
---|
| 74 | var d = domClass.contains(p, c + "PreviousMonth") ? -1 : |
---|
| 75 | (domClass.contains(p, c + "NextMonth") ? 1 : 0); |
---|
| 76 | if(d){displayMonth = date.add(displayMonth, "month", d);} |
---|
| 77 | displayMonth.setDate(e.target._date); |
---|
| 78 | |
---|
| 79 | // If the day is disabled, ignore it |
---|
| 80 | if(this.isDisabledDate(displayMonth)){ |
---|
| 81 | event.stop(e); |
---|
| 82 | return; |
---|
| 83 | } |
---|
| 84 | this.parent._onDateSelected(displayMonth); |
---|
| 85 | }, |
---|
| 86 | |
---|
| 87 | _setValueAttr: function(value){ |
---|
| 88 | //Change the day values |
---|
| 89 | this._populateDays(); |
---|
| 90 | }, |
---|
| 91 | |
---|
| 92 | _populateDays: function(){ |
---|
| 93 | // summary: |
---|
| 94 | // Fills the days of the current month. |
---|
| 95 | |
---|
| 96 | var currentDate = new Date(this.get("displayMonth")); |
---|
| 97 | currentDate.setDate(1); |
---|
| 98 | var firstDay = currentDate.getDay(); |
---|
| 99 | var daysInMonth = date.getDaysInMonth(currentDate); |
---|
| 100 | var daysInPreviousMonth = date.getDaysInMonth(date.add(currentDate, "month", -1)); |
---|
| 101 | var today = new Date(); |
---|
| 102 | var selected = this.get('value'); |
---|
| 103 | |
---|
| 104 | var dayOffset = supplemental.getFirstDayOfWeek(this.getLang()); |
---|
| 105 | if(dayOffset > firstDay){ dayOffset -= 7; } |
---|
| 106 | |
---|
| 107 | var compareDate = date.compare; |
---|
| 108 | var templateCls = ".dijitCalendarDateTemplate"; |
---|
| 109 | var selectedCls = "dijitCalendarSelectedDate"; |
---|
| 110 | |
---|
| 111 | var oldDate = this._lastDate; |
---|
| 112 | var redrawRequired = oldDate == null |
---|
| 113 | || oldDate.getMonth() != currentDate.getMonth() |
---|
| 114 | || oldDate.getFullYear() != currentDate.getFullYear(); |
---|
| 115 | this._lastDate = currentDate; |
---|
| 116 | |
---|
| 117 | // If still showing the same month, it's much faster to not redraw, |
---|
| 118 | // and just change the selected date. |
---|
| 119 | if(!redrawRequired){ |
---|
| 120 | query(templateCls, this.domNode) |
---|
| 121 | .removeClass(selectedCls) |
---|
| 122 | .filter(function(node){ |
---|
| 123 | return node.className.indexOf("dijitCalendarCurrent") > -1 |
---|
| 124 | && node._date == selected.getDate(); |
---|
| 125 | }) |
---|
| 126 | .addClass(selectedCls); |
---|
| 127 | return; |
---|
| 128 | } |
---|
| 129 | |
---|
| 130 | // Iterate through dates in the calendar and fill in date numbers and style info |
---|
| 131 | query(templateCls, this.domNode).forEach(function(template, i){ |
---|
| 132 | i += dayOffset; |
---|
| 133 | var eachDate = new Date(currentDate); |
---|
| 134 | var number, clazz = "dijitCalendar", adj = 0; |
---|
| 135 | |
---|
| 136 | if(i < firstDay){ |
---|
| 137 | number = daysInPreviousMonth - firstDay + i + 1; |
---|
| 138 | adj = -1; |
---|
| 139 | clazz += "Previous"; |
---|
| 140 | }else if(i >= (firstDay + daysInMonth)){ |
---|
| 141 | number = i - firstDay - daysInMonth + 1; |
---|
| 142 | adj = 1; |
---|
| 143 | clazz += "Next"; |
---|
| 144 | }else{ |
---|
| 145 | number = i - firstDay + 1; |
---|
| 146 | clazz += "Current"; |
---|
| 147 | } |
---|
| 148 | |
---|
| 149 | if(adj){ |
---|
| 150 | eachDate = date.add(eachDate, "month", adj); |
---|
| 151 | } |
---|
| 152 | eachDate.setDate(number); |
---|
| 153 | |
---|
| 154 | if(!compareDate(eachDate, today, "date")){ |
---|
| 155 | clazz = "dijitCalendarCurrentDate " + clazz; |
---|
| 156 | } |
---|
| 157 | |
---|
| 158 | if(!compareDate(eachDate, selected, "date") |
---|
| 159 | && !compareDate(eachDate, selected, "month") |
---|
| 160 | && !compareDate(eachDate, selected, "year") ){ |
---|
| 161 | clazz = selectedCls + " " + clazz; |
---|
| 162 | } |
---|
| 163 | |
---|
| 164 | if(this.isDisabledDate(eachDate, this.getLang())){ |
---|
| 165 | clazz = " dijitCalendarDisabledDate " + clazz; |
---|
| 166 | } |
---|
| 167 | |
---|
| 168 | var clazz2 = this.getClassForDate(eachDate, this.getLang()); |
---|
| 169 | if(clazz2){ |
---|
| 170 | clazz = clazz2 + " " + clazz; |
---|
| 171 | } |
---|
| 172 | |
---|
| 173 | template.className = clazz + "Month dijitCalendarDateTemplate"; |
---|
| 174 | template.dijitDateValue = eachDate.valueOf(); |
---|
| 175 | var label = query(".dijitCalendarDateLabel", template)[0]; |
---|
| 176 | |
---|
| 177 | this._setText(label, eachDate.getDate()); |
---|
| 178 | |
---|
| 179 | label._date = label.parentNode._date = eachDate.getDate(); |
---|
| 180 | }, this); |
---|
| 181 | |
---|
| 182 | // Fill in localized month name |
---|
| 183 | var monthNames = locale.getNames('months', 'wide', 'standAlone', this.getLang()); |
---|
| 184 | this._setText(this.monthLabelNode, monthNames[currentDate.getMonth()]); |
---|
| 185 | this._setText(this.yearLabelNode, currentDate.getFullYear()); |
---|
| 186 | } |
---|
| 187 | }); |
---|
| 188 | }); |
---|