Hello site
[auf_framonde.git] / eggs / Django-1.4.5-py2.7.egg / django / contrib / admin / static / admin / js / admin / DateTimeShortcuts.js
CommitLineData
01b54c21
MN
1// Inserts shortcut buttons after all of the following:
2// <input type="text" class="vDateField">
3// <input type="text" class="vTimeField">
4
5var DateTimeShortcuts = {
6 calendars: [],
7 calendarInputs: [],
8 clockInputs: [],
9 calendarDivName1: 'calendarbox', // name of calendar <div> that gets toggled
10 calendarDivName2: 'calendarin', // name of <div> that contains calendar
11 calendarLinkName: 'calendarlink',// name of the link that is used to toggle
12 clockDivName: 'clockbox', // name of clock <div> that gets toggled
13 clockLinkName: 'clocklink', // name of the link that is used to toggle
14 shortCutsClass: 'datetimeshortcuts', // class of the clock and cal shortcuts
15 admin_media_prefix: '',
16 init: function() {
17 // Get admin_media_prefix by grabbing it off the window object. It's
18 // set in the admin/base.html template, so if it's not there, someone's
19 // overridden the template. In that case, we'll set a clearly-invalid
20 // value in the hopes that someone will examine HTTP requests and see it.
21 if (window.__admin_media_prefix__ != undefined) {
22 DateTimeShortcuts.admin_media_prefix = window.__admin_media_prefix__;
23 } else {
24 DateTimeShortcuts.admin_media_prefix = '/missing-admin-media-prefix/';
25 }
26
27 var inputs = document.getElementsByTagName('input');
28 for (i=0; i<inputs.length; i++) {
29 var inp = inputs[i];
30 if (inp.getAttribute('type') == 'text' && inp.className.match(/vTimeField/)) {
31 DateTimeShortcuts.addClock(inp);
32 }
33 else if (inp.getAttribute('type') == 'text' && inp.className.match(/vDateField/)) {
34 DateTimeShortcuts.addCalendar(inp);
35 }
36 }
37 },
38 // Add clock widget to a given field
39 addClock: function(inp) {
40 var num = DateTimeShortcuts.clockInputs.length;
41 DateTimeShortcuts.clockInputs[num] = inp;
42
43 // Shortcut links (clock icon and "Now" link)
44 var shortcuts_span = document.createElement('span');
45 shortcuts_span.className = DateTimeShortcuts.shortCutsClass;
46 inp.parentNode.insertBefore(shortcuts_span, inp.nextSibling);
47 var now_link = document.createElement('a');
48 now_link.setAttribute('href', "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date().strftime('" + get_format('TIME_INPUT_FORMATS')[0] + "'));");
49 now_link.appendChild(document.createTextNode(gettext('Now')));
50 var clock_link = document.createElement('a');
51 clock_link.setAttribute('href', 'javascript:DateTimeShortcuts.openClock(' + num + ');');
52 clock_link.id = DateTimeShortcuts.clockLinkName + num;
53 quickElement('img', clock_link, '', 'src', DateTimeShortcuts.admin_media_prefix + 'img/icon_clock.gif', 'alt', gettext('Clock'));
54 shortcuts_span.appendChild(document.createTextNode('\240'));
55 shortcuts_span.appendChild(now_link);
56 shortcuts_span.appendChild(document.createTextNode('\240|\240'));
57 shortcuts_span.appendChild(clock_link);
58
59 // Create clock link div
60 //
61 // Markup looks like:
62 // <div id="clockbox1" class="clockbox module">
63 // <h2>Choose a time</h2>
64 // <ul class="timelist">
65 // <li><a href="#">Now</a></li>
66 // <li><a href="#">Midnight</a></li>
67 // <li><a href="#">6 a.m.</a></li>
68 // <li><a href="#">Noon</a></li>
69 // </ul>
70 // <p class="calendar-cancel"><a href="#">Cancel</a></p>
71 // </div>
72
73 var clock_box = document.createElement('div');
74 clock_box.style.display = 'none';
75 clock_box.style.position = 'absolute';
76 clock_box.className = 'clockbox module';
77 clock_box.setAttribute('id', DateTimeShortcuts.clockDivName + num);
78 document.body.appendChild(clock_box);
79 addEvent(clock_box, 'click', DateTimeShortcuts.cancelEventPropagation);
80
81 quickElement('h2', clock_box, gettext('Choose a time'));
82 var time_list = quickElement('ul', clock_box, '');
83 time_list.className = 'timelist';
84 var time_format = get_format('TIME_INPUT_FORMATS')[0];
85 quickElement("a", quickElement("li", time_list, ""), gettext("Now"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date().strftime('" + time_format + "'));");
86 quickElement("a", quickElement("li", time_list, ""), gettext("Midnight"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,0,0,0,0).strftime('" + time_format + "'));");
87 quickElement("a", quickElement("li", time_list, ""), gettext("6 a.m."), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,6,0,0,0).strftime('" + time_format + "'));");
88 quickElement("a", quickElement("li", time_list, ""), gettext("Noon"), "href", "javascript:DateTimeShortcuts.handleClockQuicklink(" + num + ", new Date(1970,1,1,12,0,0,0).strftime('" + time_format + "'));");
89
90 var cancel_p = quickElement('p', clock_box, '');
91 cancel_p.className = 'calendar-cancel';
92 quickElement('a', cancel_p, gettext('Cancel'), 'href', 'javascript:DateTimeShortcuts.dismissClock(' + num + ');');
93 django.jQuery(document).bind('keyup', function(event) {
94 if (event.which == 27) {
95 // ESC key closes popup
96 DateTimeShortcuts.dismissClock(num);
97 event.preventDefault();
98 }
99 });
100 },
101 openClock: function(num) {
102 var clock_box = document.getElementById(DateTimeShortcuts.clockDivName+num)
103 var clock_link = document.getElementById(DateTimeShortcuts.clockLinkName+num)
104
105 // Recalculate the clockbox position
106 // is it left-to-right or right-to-left layout ?
107 if (getStyle(document.body,'direction')!='rtl') {
108 clock_box.style.left = findPosX(clock_link) + 17 + 'px';
109 }
110 else {
111 // since style's width is in em, it'd be tough to calculate
112 // px value of it. let's use an estimated px for now
113 // TODO: IE returns wrong value for findPosX when in rtl mode
114 // (it returns as it was left aligned), needs to be fixed.
115 clock_box.style.left = findPosX(clock_link) - 110 + 'px';
116 }
117 clock_box.style.top = Math.max(0, findPosY(clock_link) - 30) + 'px';
118
119 // Show the clock box
120 clock_box.style.display = 'block';
121 addEvent(window.document, 'click', function() { DateTimeShortcuts.dismissClock(num); return true; });
122 },
123 dismissClock: function(num) {
124 document.getElementById(DateTimeShortcuts.clockDivName + num).style.display = 'none';
125 window.document.onclick = null;
126 },
127 handleClockQuicklink: function(num, val) {
128 DateTimeShortcuts.clockInputs[num].value = val;
129 DateTimeShortcuts.clockInputs[num].focus();
130 DateTimeShortcuts.dismissClock(num);
131 },
132 // Add calendar widget to a given field.
133 addCalendar: function(inp) {
134 var num = DateTimeShortcuts.calendars.length;
135
136 DateTimeShortcuts.calendarInputs[num] = inp;
137
138 // Shortcut links (calendar icon and "Today" link)
139 var shortcuts_span = document.createElement('span');
140 shortcuts_span.className = DateTimeShortcuts.shortCutsClass;
141 inp.parentNode.insertBefore(shortcuts_span, inp.nextSibling);
142 var today_link = document.createElement('a');
143 today_link.setAttribute('href', 'javascript:DateTimeShortcuts.handleCalendarQuickLink(' + num + ', 0);');
144 today_link.appendChild(document.createTextNode(gettext('Today')));
145 var cal_link = document.createElement('a');
146 cal_link.setAttribute('href', 'javascript:DateTimeShortcuts.openCalendar(' + num + ');');
147 cal_link.id = DateTimeShortcuts.calendarLinkName + num;
148 quickElement('img', cal_link, '', 'src', DateTimeShortcuts.admin_media_prefix + 'img/icon_calendar.gif', 'alt', gettext('Calendar'));
149 shortcuts_span.appendChild(document.createTextNode('\240'));
150 shortcuts_span.appendChild(today_link);
151 shortcuts_span.appendChild(document.createTextNode('\240|\240'));
152 shortcuts_span.appendChild(cal_link);
153
154 // Create calendarbox div.
155 //
156 // Markup looks like:
157 //
158 // <div id="calendarbox3" class="calendarbox module">
159 // <h2>
160 // <a href="#" class="link-previous">&lsaquo;</a>
161 // <a href="#" class="link-next">&rsaquo;</a> February 2003
162 // </h2>
163 // <div class="calendar" id="calendarin3">
164 // <!-- (cal) -->
165 // </div>
166 // <div class="calendar-shortcuts">
167 // <a href="#">Yesterday</a> | <a href="#">Today</a> | <a href="#">Tomorrow</a>
168 // </div>
169 // <p class="calendar-cancel"><a href="#">Cancel</a></p>
170 // </div>
171 var cal_box = document.createElement('div');
172 cal_box.style.display = 'none';
173 cal_box.style.position = 'absolute';
174 cal_box.className = 'calendarbox module';
175 cal_box.setAttribute('id', DateTimeShortcuts.calendarDivName1 + num);
176 document.body.appendChild(cal_box);
177 addEvent(cal_box, 'click', DateTimeShortcuts.cancelEventPropagation);
178
179 // next-prev links
180 var cal_nav = quickElement('div', cal_box, '');
181 var cal_nav_prev = quickElement('a', cal_nav, '<', 'href', 'javascript:DateTimeShortcuts.drawPrev('+num+');');
182 cal_nav_prev.className = 'calendarnav-previous';
183 var cal_nav_next = quickElement('a', cal_nav, '>', 'href', 'javascript:DateTimeShortcuts.drawNext('+num+');');
184 cal_nav_next.className = 'calendarnav-next';
185
186 // main box
187 var cal_main = quickElement('div', cal_box, '', 'id', DateTimeShortcuts.calendarDivName2 + num);
188 cal_main.className = 'calendar';
189 DateTimeShortcuts.calendars[num] = new Calendar(DateTimeShortcuts.calendarDivName2 + num, DateTimeShortcuts.handleCalendarCallback(num));
190 DateTimeShortcuts.calendars[num].drawCurrent();
191
192 // calendar shortcuts
193 var shortcuts = quickElement('div', cal_box, '');
194 shortcuts.className = 'calendar-shortcuts';
195 quickElement('a', shortcuts, gettext('Yesterday'), 'href', 'javascript:DateTimeShortcuts.handleCalendarQuickLink(' + num + ', -1);');
196 shortcuts.appendChild(document.createTextNode('\240|\240'));
197 quickElement('a', shortcuts, gettext('Today'), 'href', 'javascript:DateTimeShortcuts.handleCalendarQuickLink(' + num + ', 0);');
198 shortcuts.appendChild(document.createTextNode('\240|\240'));
199 quickElement('a', shortcuts, gettext('Tomorrow'), 'href', 'javascript:DateTimeShortcuts.handleCalendarQuickLink(' + num + ', +1);');
200
201 // cancel bar
202 var cancel_p = quickElement('p', cal_box, '');
203 cancel_p.className = 'calendar-cancel';
204 quickElement('a', cancel_p, gettext('Cancel'), 'href', 'javascript:DateTimeShortcuts.dismissCalendar(' + num + ');');
205 django.jQuery(document).bind('keyup', function(event) {
206 if (event.which == 27) {
207 // ESC key closes popup
208 DateTimeShortcuts.dismissCalendar(num);
209 event.preventDefault();
210 }
211 });
212 },
213 openCalendar: function(num) {
214 var cal_box = document.getElementById(DateTimeShortcuts.calendarDivName1+num)
215 var cal_link = document.getElementById(DateTimeShortcuts.calendarLinkName+num)
216 var inp = DateTimeShortcuts.calendarInputs[num];
217
218 // Determine if the current value in the input has a valid date.
219 // If so, draw the calendar with that date's year and month.
220 if (inp.value) {
221 var date_parts = inp.value.split('-');
222 var year = date_parts[0];
223 var month = parseFloat(date_parts[1]);
224 if (year.match(/\d\d\d\d/) && month >= 1 && month <= 12) {
225 DateTimeShortcuts.calendars[num].drawDate(month, year);
226 }
227 }
228
229 // Recalculate the clockbox position
230 // is it left-to-right or right-to-left layout ?
231 if (getStyle(document.body,'direction')!='rtl') {
232 cal_box.style.left = findPosX(cal_link) + 17 + 'px';
233 }
234 else {
235 // since style's width is in em, it'd be tough to calculate
236 // px value of it. let's use an estimated px for now
237 // TODO: IE returns wrong value for findPosX when in rtl mode
238 // (it returns as it was left aligned), needs to be fixed.
239 cal_box.style.left = findPosX(cal_link) - 180 + 'px';
240 }
241 cal_box.style.top = Math.max(0, findPosY(cal_link) - 75) + 'px';
242
243 cal_box.style.display = 'block';
244 addEvent(window.document, 'click', function() { DateTimeShortcuts.dismissCalendar(num); return true; });
245 },
246 dismissCalendar: function(num) {
247 document.getElementById(DateTimeShortcuts.calendarDivName1+num).style.display = 'none';
248 window.document.onclick = null;
249 },
250 drawPrev: function(num) {
251 DateTimeShortcuts.calendars[num].drawPreviousMonth();
252 },
253 drawNext: function(num) {
254 DateTimeShortcuts.calendars[num].drawNextMonth();
255 },
256 handleCalendarCallback: function(num) {
257 format = get_format('DATE_INPUT_FORMATS')[0];
258 // the format needs to be escaped a little
259 format = format.replace('\\', '\\\\');
260 format = format.replace('\r', '\\r');
261 format = format.replace('\n', '\\n');
262 format = format.replace('\t', '\\t');
263 format = format.replace("'", "\\'");
264 return ["function(y, m, d) { DateTimeShortcuts.calendarInputs[",
265 num,
266 "].value = new Date(y, m-1, d).strftime('",
267 format,
268 "');DateTimeShortcuts.calendarInputs[",
269 num,
270 "].focus();document.getElementById(DateTimeShortcuts.calendarDivName1+",
271 num,
272 ").style.display='none';}"].join('');
273 },
274 handleCalendarQuickLink: function(num, offset) {
275 var d = new Date();
276 d.setDate(d.getDate() + offset)
277 DateTimeShortcuts.calendarInputs[num].value = d.strftime(get_format('DATE_INPUT_FORMATS')[0]);
278 DateTimeShortcuts.calendarInputs[num].focus();
279 DateTimeShortcuts.dismissCalendar(num);
280 },
281 cancelEventPropagation: function(e) {
282 if (!e) e = window.event;
283 e.cancelBubble = true;
284 if (e.stopPropagation) e.stopPropagation();
285 }
286}
287
288addEvent(window, 'load', DateTimeShortcuts.init);