Project

General

Profile

1 562 Ruebenwurz
/***********************************************
2
 Fool-Proof Date Input Script with DHTML Calendar
3
 by Jason Moon - calendar@moonscript.com
4
 ************************************************/
5
6
// Customizable variables
7
var DefaultDateFormat = 'MM/DD/YYYY'; // If no date format is supplied, this will be used instead
8
var HideWait = 3; // Number of seconds before the calendar will disappear
9
var Y2kPivotPoint = 76; // 2-digit years before this point will be created in the 21st century
10
var UnselectedMonthText = ''; // Text to display in the 1st month list item when the date isn't required
11
var FontSize = 11; // In pixels
12
var FontFamily = 'Tahoma';
13
var CellWidth = 18;
14
var CellHeight = 16;
15
var ImageURL = 'calendar/calendar.jpg';
16
var NextURL = 'calendar/next.gif';
17
var PrevURL = 'calendar/prev.gif';
18
var CalBGColor = 'white';
19
var TopRowBGColor = 'buttonface';
20
var DayBGColor = 'lightgrey';
21
22
// Global variables
23
var ZCounter = 100;
24
var Today = new Date();
25
var WeekDays = new Array('S','M','T','W','T','F','S');
26
var MonthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
27
var MonthNames = new Array('January','February','March','April','May','June','July','August','September','October','November','December');
28
29
// Write out the stylesheet definition for the calendar
30
with (document) {
31
   writeln('<style>');
32
   writeln('td.calendarDateInput {letter-spacing:normal;line-height:normal;font-family:' + FontFamily + ',Sans-Serif;font-size:' + FontSize + 'px;}');
33
   writeln('select.calendarDateInput {letter-spacing:.06em;font-family:Verdana,Sans-Serif;font-size:11px;}');
34
   writeln('input.calendarDateInput {letter-spacing:.06em;font-family:Verdana,Sans-Serif;font-size:11px;}');
35
   writeln('</style>');
36
}
37
38
// Only allows certain keys to be used in the date field
39
function YearDigitsOnly(e) {
40
   var KeyCode = (e.keyCode) ? e.keyCode : e.which;
41
   return ((KeyCode == 8) // backspace
42
        || (KeyCode == 9) // tab
43
        || (KeyCode == 37) // left arrow
44
        || (KeyCode == 39) // right arrow
45
        || (KeyCode == 46) // delete
46
        || ((KeyCode > 47) && (KeyCode < 58)) // 0 - 9
47
   );
48
}
49
50
// Gets the absolute pixel position of the supplied element
51
function GetTagPixels(StartTag, Direction) {
52
   var PixelAmt = (Direction == 'LEFT') ? StartTag.offsetLeft : StartTag.offsetTop;
53
   while ((StartTag.tagName != 'BODY') && (StartTag.tagName != 'HTML')) {
54
      StartTag = StartTag.offsetParent;
55
      PixelAmt += (Direction == 'LEFT') ? StartTag.offsetLeft : StartTag.offsetTop;
56
   }
57
   return PixelAmt;
58
}
59
60
// Is the specified select-list behind the calendar?
61
function BehindCal(SelectList, CalLeftX, CalRightX, CalTopY, CalBottomY, ListTopY) {
62
   var ListLeftX = GetTagPixels(SelectList, 'LEFT');
63
   var ListRightX = ListLeftX + SelectList.offsetWidth;
64
   var ListBottomY = ListTopY + SelectList.offsetHeight;
65
   return (((ListTopY < CalBottomY) && (ListBottomY > CalTopY)) && ((ListLeftX < CalRightX) && (ListRightX > CalLeftX)));
66
}
67
68
// For IE, hides any select-lists that are behind the calendar
69
function FixSelectLists(Over) {
70
   if (navigator.appName == 'Microsoft Internet Explorer') {
71
      var CalDiv = this.getCalendar();
72
      var CalLeftX = CalDiv.offsetLeft;
73
      var CalRightX = CalLeftX + CalDiv.offsetWidth;
74
      var CalTopY = CalDiv.offsetTop;
75
      var CalBottomY = CalTopY + (CellHeight * 9);
76
      var FoundCalInput = false;
77
      formLoop :
78
      for (var j=this.formNumber;j<document.forms.length;j++) {
79
         for (var i=0;i<document.forms[j].elements.length;i++) {
80
            if (typeof document.forms[j].elements[i].type == 'string') {
81
               if ((document.forms[j].elements[i].type == 'hidden') && (document.forms[j].elements[i].name == this.hiddenFieldName)) {
82
                  FoundCalInput = true;
83
                  i += 3; // 3 elements between the 1st hidden field and the last year input field
84
               }
85
               if (FoundCalInput) {
86
                  if (document.forms[j].elements[i].type.substr(0,6) == 'select') {
87
                     ListTopY = GetTagPixels(document.forms[j].elements[i], 'TOP');
88
                     if (ListTopY < CalBottomY) {
89
                        if (BehindCal(document.forms[j].elements[i], CalLeftX, CalRightX, CalTopY, CalBottomY, ListTopY)) {
90
                           document.forms[j].elements[i].style.visibility = (Over) ? 'hidden' : 'visible';
91
                        }
92
                     }
93
                     else break formLoop;
94
                  }
95
               }
96
            }
97
         }
98
      }
99
   }
100
}
101
102
// Displays a message in the status bar when hovering over the calendar days
103
function DayCellHover(Cell, Over, Color, HoveredDay) {
104
   Cell.style.backgroundColor = (Over) ? DayBGColor : Color;
105
   if (Over) {
106
      if ((this.yearValue == Today.getFullYear()) && (this.monthIndex == Today.getMonth()) && (HoveredDay == Today.getDate())) self.status = 'Click to select today';
107
      else {
108
         var Suffix = HoveredDay.toString();
109
         switch (Suffix.substr(Suffix.length - 1, 1)) {
110
            case '1' : Suffix += (HoveredDay == 11) ? 'th' : 'st'; break;
111
            case '2' : Suffix += (HoveredDay == 12) ? 'th' : 'nd'; break;
112
            case '3' : Suffix += (HoveredDay == 13) ? 'th' : 'rd'; break;
113
            default : Suffix += 'th'; break;
114
         }
115
         self.status = 'Click to select ' + this.monthName + ' ' + Suffix;
116
      }
117
   }
118
   else self.status = '';
119
   return true;
120
}
121
122
// Sets the form elements after a day has been picked from the calendar
123
function PickDisplayDay(ClickedDay) {
124
   this.show();
125
   var MonthList = this.getMonthList();
126
   var DayList = this.getDayList();
127
   var YearField = this.getYearField();
128
   FixDayList(DayList, GetDayCount(this.displayed.yearValue, this.displayed.monthIndex));
129
   // Select the month and day in the lists
130
   for (var i=0;i<MonthList.length;i++) {
131
      if (MonthList.options[i].value == this.displayed.monthIndex) MonthList.options[i].selected = true;
132
   }
133
   for (var j=1;j<=DayList.length;j++) {
134
      if (j == ClickedDay) DayList.options[j-1].selected = true;
135
   }
136
   this.setPicked(this.displayed.yearValue, this.displayed.monthIndex, ClickedDay);
137
   // Change the year, if necessary
138
   YearField.value = this.picked.yearPad;
139
   YearField.defaultValue = YearField.value;
140
}
141
142
// Builds the HTML for the calendar days
143
function BuildCalendarDays() {
144
   var Rows = 5;
145
   if (((this.displayed.dayCount == 31) && (this.displayed.firstDay > 4)) || ((this.displayed.dayCount == 30) && (this.displayed.firstDay == 6))) Rows = 6;
146
   else if ((this.displayed.dayCount == 28) && (this.displayed.firstDay == 0)) Rows = 4;
147
   var HTML = '<table width="' + (CellWidth * 7) + '" cellspacing="0" cellpadding="1" style="cursor:default">';
148
   for (var j=0;j<Rows;j++) {
149
      HTML += '<tr>';
150
      for (var i=1;i<=7;i++) {
151
         Day = (j * 7) + (i - this.displayed.firstDay);
152
         if ((Day >= 1) && (Day <= this.displayed.dayCount)) {
153
            if ((this.displayed.yearValue == this.picked.yearValue) && (this.displayed.monthIndex == this.picked.monthIndex) && (Day == this.picked.day)) {
154
               TextStyle = 'color:white;font-weight:bold;'
155
               BackColor = DayBGColor;
156
            }
157
            else {
158
               TextStyle = 'color:black;'
159
               BackColor = CalBGColor;
160
            }
161
            if ((this.displayed.yearValue == Today.getFullYear()) && (this.displayed.monthIndex == Today.getMonth()) && (Day == Today.getDate())) TextStyle += 'border:1px solid darkred;padding:0px;';
162
            HTML += '<td align="center" class="calendarDateInput" style="cursor:default;height:' + CellHeight + ';width:' + CellWidth + ';' + TextStyle + ';background-color:' + BackColor + '" onClick="' + this.objName + '.pickDay(' + Day + ')" onMouseOver="return ' + this.objName + '.displayed.dayHover(this,true,\'' + BackColor + '\',' + Day + ')" onMouseOut="return ' + this.objName + '.displayed.dayHover(this,false,\'' + BackColor + '\')">' + Day + '</td>';
163
         }
164
         else HTML += '<td class="calendarDateInput" style="height:' + CellHeight + '">&nbsp;</td>';
165
      }
166
      HTML += '</tr>';
167
   }
168
   return HTML += '</table>';
169
}
170
171
// Determines which century to use (20th or 21st) when dealing with 2-digit years
172
function GetGoodYear(YearDigits) {
173
   if (YearDigits.length == 4) return YearDigits;
174
   else {
175
      var Millennium = (YearDigits < Y2kPivotPoint) ? 2000 : 1900;
176
      return Millennium + parseInt(YearDigits,10);
177
   }
178
}
179
180
// Returns the number of days in a month (handles leap-years)
181
function GetDayCount(SomeYear, SomeMonth) {
182
   return ((SomeMonth == 1) && ((SomeYear % 400 == 0) || ((SomeYear % 4 == 0) && (SomeYear % 100 != 0)))) ? 29 : MonthDays[SomeMonth];
183
}
184
185
// Highlights the buttons
186
function VirtualButton(Cell, ButtonDown) {
187
   if (ButtonDown) {
188
      Cell.style.borderLeft = 'buttonshadow 1px solid';
189
      Cell.style.borderTop = 'buttonshadow 1px solid';
190
      Cell.style.borderBottom = 'buttonhighlight 1px solid';
191
      Cell.style.borderRight = 'buttonhighlight 1px solid';
192
   }
193
   else {
194
      Cell.style.borderLeft = 'buttonhighlight 1px solid';
195
      Cell.style.borderTop = 'buttonhighlight 1px solid';
196
      Cell.style.borderBottom = 'buttonshadow 1px solid';
197
      Cell.style.borderRight = 'buttonshadow 1px solid';
198
   }
199
}
200
201
// Mouse-over for the previous/next month buttons
202
function NeighborHover(Cell, Over, DateObj) {
203
   if (Over) {
204
      VirtualButton(Cell, false);
205
      self.status = 'Click to view ' + DateObj.fullName;
206
   }
207
   else {
208
      Cell.style.border = 'buttonface 1px solid';
209
      self.status = '';
210
   }
211
   return true;
212
}
213
214
// Adds/removes days from the day list, depending on the month/year
215
function FixDayList(DayList, NewDays) {
216
   var DayPick = DayList.selectedIndex + 1;
217
   if (NewDays != DayList.length) {
218
      var OldSize = DayList.length;
219
      for (var k=Math.min(NewDays,OldSize);k<Math.max(NewDays,OldSize);k++) {
220
         (k >= NewDays) ? DayList.options[NewDays] = null : DayList.options[k] = new Option(k+1, k+1);
221
      }
222
      DayPick = Math.min(DayPick, NewDays);
223
      DayList.options[DayPick-1].selected = true;
224
   }
225
   return DayPick;
226
}
227
228
// Resets the year to its previous valid value when something invalid is entered
229
function FixYearInput(YearField) {
230
   var YearRE = new RegExp('\\d{' + YearField.defaultValue.length + '}');
231
   if (!YearRE.test(YearField.value)) YearField.value = YearField.defaultValue;
232
}
233
234
// Displays a message in the status bar when hovering over the calendar icon
235
function CalIconHover(Over) {
236
   var Message = (this.isShowing()) ? 'hide' : 'show';
237
   self.status = (Over) ? 'Click to ' + Message + ' the calendar' : '';
238
   return true;
239
}
240
241
// Starts the timer over from scratch
242
function CalTimerReset() {
243
   eval('clearTimeout(' + this.timerID + ')');
244
   eval(this.timerID + '=setTimeout(\'' + this.objName + '.show()\',' + (HideWait * 1000) + ')');
245
}
246
247
// The timer for the calendar
248
function DoTimer(CancelTimer) {
249
   if (CancelTimer) eval('clearTimeout(' + this.timerID + ')');
250
   else {
251
      eval(this.timerID + '=null');
252
      this.resetTimer();
253
   }
254
}
255
256
// Show or hide the calendar
257
function ShowCalendar() {
258
   if (this.isShowing()) {
259
      var StopTimer = true;
260
      this.getCalendar().style.zIndex = --ZCounter;
261
      this.getCalendar().style.visibility = 'hidden';
262
      this.fixSelects(false);
263
   }
264
   else {
265
      var StopTimer = false;
266
      this.fixSelects(true);
267
      this.getCalendar().style.zIndex = ++ZCounter;
268
      this.getCalendar().style.visibility = 'visible';
269
   }
270
   this.handleTimer(StopTimer);
271
   self.status = '';
272
}
273
274
// Hides the input elements when the "blank" month is selected
275
function SetElementStatus(Hide) {
276
   this.getDayList().style.visibility = (Hide) ? 'hidden' : 'visible';
277
   this.getYearField().style.visibility = (Hide) ? 'hidden' : 'visible';
278
   this.getCalendarLink().style.visibility = (Hide) ? 'hidden' : 'visible';
279
}
280
281
// Sets the date, based on the month selected
282
function CheckMonthChange(MonthList) {
283
   var DayList = this.getDayList();
284
   if (MonthList.options[MonthList.selectedIndex].value == '') {
285
      DayList.selectedIndex = 0;
286
      this.hideElements(true);
287
      this.setHidden('');
288
   }
289
   else {
290
      this.hideElements(false);
291
      if (this.isShowing()) {
292
         this.resetTimer(); // Gives the user more time to view the calendar with the newly-selected month
293
         this.getCalendar().style.zIndex = ++ZCounter; // Make sure this calendar is on top of any other calendars
294
      }
295
      var DayPick = FixDayList(DayList, GetDayCount(this.picked.yearValue, MonthList.options[MonthList.selectedIndex].value));
296
      this.setPicked(this.picked.yearValue, MonthList.options[MonthList.selectedIndex].value, DayPick);
297
   }
298
}
299
300
// Sets the date, based on the day selected
301
function CheckDayChange(DayList) {
302
   if (this.isShowing()) this.show();
303
   this.setPicked(this.picked.yearValue, this.picked.monthIndex, DayList.selectedIndex+1);
304
}
305
306
// Changes the date when a valid year has been entered
307
function CheckYearInput(YearField) {
308
   if ((YearField.value.length == YearField.defaultValue.length) && (YearField.defaultValue != YearField.value)) {
309
      if (this.isShowing()) {
310
         this.resetTimer(); // Gives the user more time to view the calendar with the newly-entered year
311
         this.getCalendar().style.zIndex = ++ZCounter; // Make sure this calendar is on top of any other calendars
312
      }
313
      var NewYear = GetGoodYear(YearField.value);
314
      var MonthList = this.getMonthList();
315
      var NewDay = FixDayList(this.getDayList(), GetDayCount(NewYear, this.picked.monthIndex));
316
      this.setPicked(NewYear, this.picked.monthIndex, NewDay);
317
      YearField.defaultValue = YearField.value;
318
   }
319
}
320
321
// Holds characteristics about a date
322
function dateObject() {
323
   if (Function.call) { // Used when 'call' method of the Function object is supported
324
      var ParentObject = this;
325
      var ArgumentStart = 0;
326
   }
327
   else { // Used with 'call' method of the Function object is NOT supported
328
      var ParentObject = arguments[0];
329
      var ArgumentStart = 1;
330
   }
331
   ParentObject.date = (arguments.length == (ArgumentStart+1)) ? new Date(arguments[ArgumentStart+0]) : new Date(arguments[ArgumentStart+0], arguments[ArgumentStart+1], arguments[ArgumentStart+2]);
332
   ParentObject.yearValue = ParentObject.date.getFullYear();
333
   ParentObject.monthIndex = ParentObject.date.getMonth();
334
   ParentObject.monthName = MonthNames[ParentObject.monthIndex];
335
   ParentObject.fullName = ParentObject.monthName + ' ' + ParentObject.yearValue;
336
   ParentObject.day = ParentObject.date.getDate();
337
   ParentObject.dayCount = GetDayCount(ParentObject.yearValue, ParentObject.monthIndex);
338
   var FirstDate = new Date(ParentObject.yearValue, ParentObject.monthIndex, 1);
339
   ParentObject.firstDay = FirstDate.getDay();
340
}
341
342
// Keeps track of the date that goes into the hidden field
343
function storedMonthObject(DateFormat, DateYear, DateMonth, DateDay) {
344
   (Function.call) ? dateObject.call(this, DateYear, DateMonth, DateDay) : dateObject(this, DateYear, DateMonth, DateDay);
345
   this.yearPad = this.yearValue.toString();
346
   this.monthPad = (this.monthIndex < 9) ? '0' + String(this.monthIndex + 1) : this.monthIndex + 1;
347
   this.dayPad = (this.day < 10) ? '0' + this.day.toString() : this.day;
348
   this.monthShort = this.monthName.substr(0,3).toUpperCase();
349
   // Formats the year with 2 digits instead of 4
350
   if (DateFormat.indexOf('YYYY') == -1) this.yearPad = this.yearPad.substr(2);
351
   // Define the date-part delimiter
352
   if (DateFormat.indexOf('/') >= 0) var Delimiter = '/';
353
   else if (DateFormat.indexOf('-') >= 0) var Delimiter = '-';
354
   else var Delimiter = '';
355
   // Determine the order of the months and days
356
   if (/DD?.?((MON)|(MM?M?))/.test(DateFormat)) {
357
      this.formatted = this.dayPad + Delimiter;
358
      this.formatted += (RegExp.$1.length == 3) ? this.monthShort : this.monthPad;
359
   }
360
   else if (/((MON)|(MM?M?))?.?DD?/.test(DateFormat)) {
361
      this.formatted = (RegExp.$1.length == 3) ? this.monthShort : this.monthPad;
362
      this.formatted += Delimiter + this.dayPad;
363
   }
364
   // Either prepend or append the year to the formatted date
365
   this.formatted = (DateFormat.substr(0,2) == 'YY') ? this.yearPad + Delimiter + this.formatted : this.formatted + Delimiter + this.yearPad;
366
}
367
368
// Object for the current displayed month
369
function displayMonthObject(ParentObject, DateYear, DateMonth, DateDay) {
370
   (Function.call) ? dateObject.call(this, DateYear, DateMonth, DateDay) : dateObject(this, DateYear, DateMonth, DateDay);
371
   this.displayID = ParentObject.hiddenFieldName + '_Current_ID';
372
   this.getDisplay = new Function('return document.getElementById(this.displayID)');
373
   this.dayHover = DayCellHover;
374
   this.goCurrent = new Function(ParentObject.objName + '.getCalendar().style.zIndex=++ZCounter;' + ParentObject.objName + '.setDisplayed(Today.getFullYear(),Today.getMonth());');
375
   if (ParentObject.formNumber >= 0) this.getDisplay().innerHTML = this.fullName;
376
}
377
378
// Object for the previous/next buttons
379
function neighborMonthObject(ParentObject, IDText, DateMS) {
380
   (Function.call) ? dateObject.call(this, DateMS) : dateObject(this, DateMS);
381
   this.buttonID = ParentObject.hiddenFieldName + '_' + IDText + '_ID';
382
   this.hover = new Function('C','O','NeighborHover(C,O,this)');
383
   this.getButton = new Function('return document.getElementById(this.buttonID)');
384
   this.go = new Function(ParentObject.objName + '.getCalendar().style.zIndex=++ZCounter;' + ParentObject.objName + '.setDisplayed(this.yearValue,this.monthIndex);');
385
   if (ParentObject.formNumber >= 0) this.getButton().title = this.monthName;
386
}
387
388
// Sets the currently-displayed month object
389
function SetDisplayedMonth(DispYear, DispMonth) {
390
   this.displayed = new displayMonthObject(this, DispYear, DispMonth, 1);
391
   // Creates the previous and next month objects
392
   this.previous = new neighborMonthObject(this, 'Previous', this.displayed.date.getTime() - 86400000);
393
   this.next = new neighborMonthObject(this, 'Next', this.displayed.date.getTime() + (86400000 * (this.displayed.dayCount + 1)));
394
   // Creates the HTML for the calendar
395
   if (this.formNumber >= 0) this.getDayTable().innerHTML = this.buildCalendar();
396
}
397
398
// Sets the current selected date
399
function SetPickedMonth(PickedYear, PickedMonth, PickedDay) {
400
   this.picked = new storedMonthObject(this.format, PickedYear, PickedMonth, PickedDay);
401
   this.setHidden(this.picked.formatted);
402
   this.setDisplayed(PickedYear, PickedMonth);
403
}
404
405
// The calendar object
406
function calendarObject(DateName, DateFormat, DefaultDate) {
407
408
   /* Properties */
409
   this.hiddenFieldName = DateName;
410
   this.monthListID = DateName + '_Month_ID';
411
   this.dayListID = DateName + '_Day_ID';
412
   this.yearFieldID = DateName + '_Year_ID';
413
   this.monthDisplayID = DateName + '_Current_ID';
414
   this.calendarID = DateName + '_ID';
415
   this.dayTableID = DateName + '_DayTable_ID';
416
   this.calendarLinkID = this.calendarID + '_Link';
417
   this.timerID = this.calendarID + '_Timer';
418
   this.objName = DateName + '_Object';
419
   this.format = DateFormat;
420
   this.formNumber = -1;
421
   this.picked = null;
422
   this.displayed = null;
423
   this.previous = null;
424
   this.next = null;
425
426
   /* Methods */
427
   this.setPicked = SetPickedMonth;
428
   this.setDisplayed = SetDisplayedMonth;
429
   this.checkYear = CheckYearInput;
430
   this.fixYear = FixYearInput;
431
   this.changeMonth = CheckMonthChange;
432
   this.changeDay = CheckDayChange;
433
   this.resetTimer = CalTimerReset;
434
   this.hideElements = SetElementStatus;
435
   this.show = ShowCalendar;
436
   this.handleTimer = DoTimer;
437
   this.iconHover = CalIconHover;
438
   this.buildCalendar = BuildCalendarDays;
439
   this.pickDay = PickDisplayDay;
440
   this.fixSelects = FixSelectLists;
441
   this.setHidden = new Function('D','if (this.formNumber >= 0) this.getHiddenField().value=D');
442
   // Returns a reference to these elements
443
   this.getHiddenField = new Function('return document.forms[this.formNumber].elements[this.hiddenFieldName]');
444
   this.getMonthList = new Function('return document.getElementById(this.monthListID)');
445
   this.getDayList = new Function('return document.getElementById(this.dayListID)');
446
   this.getYearField = new Function('return document.getElementById(this.yearFieldID)');
447
   this.getCalendar = new Function('return document.getElementById(this.calendarID)');
448
   this.getDayTable = new Function('return document.getElementById(this.dayTableID)');
449
   this.getCalendarLink = new Function('return document.getElementById(this.calendarLinkID)');
450
   this.getMonthDisplay = new Function('return document.getElementById(this.monthDisplayID)');
451
   this.isShowing = new Function('return !(this.getCalendar().style.visibility != \'visible\')');
452
453
   /* Constructor */
454
   // Functions used only by the constructor
455
   function getMonthIndex(MonthAbbr) { // Returns the index (0-11) of the supplied month abbreviation
456
      for (var MonPos=0;MonPos<MonthNames.length;MonPos++) {
457
         if (MonthNames[MonPos].substr(0,3).toUpperCase() == MonthAbbr.toUpperCase()) break;
458
      }
459
      return MonPos;
460
   }
461
   function SetGoodDate(CalObj, Notify) { // Notifies the user about their bad default date, and sets the current system date
462
      CalObj.setPicked(Today.getFullYear(), Today.getMonth(), Today.getDate());
463
      if (Notify) alert('WARNING: The supplied date is not in valid \'' + DateFormat + '\' format: ' + DefaultDate + '.\nTherefore, the current system date will be used instead: ' + CalObj.picked.formatted);
464
   }
465
   // Main part of the constructor
466
   if (DefaultDate != '') {
467
      if ((this.format == 'YYYYMMDD') && (/^(\d{4})(\d{2})(\d{2})$/.test(DefaultDate))) this.setPicked(RegExp.$1, parseInt(RegExp.$2,10)-1, RegExp.$3);
468
      else {
469
         // Get the year
470
         if ((this.format.substr(0,2) == 'YY') && (/^(\d{2,4})(-|\/)/.test(DefaultDate))) { // Year is at the beginning
471
            var YearPart = GetGoodYear(RegExp.$1);
472
            // Determine the order of the months and days
473
            if (/(-|\/)(\w{1,3})(-|\/)(\w{1,3})$/.test(DefaultDate)) {
474
               var MidPart = RegExp.$2;
475
               var EndPart = RegExp.$4;
476
               if (/D$/.test(this.format)) { // Ends with days
477
                  var DayPart = EndPart;
478
                  var MonthPart = MidPart;
479
               }
480
               else {
481
                  var DayPart = MidPart;
482
                  var MonthPart = EndPart;
483
               }
484
               MonthPart = (/\d{1,2}/i.test(MonthPart)) ? parseInt(MonthPart,10)-1 : getMonthIndex(MonthPart);
485
               this.setPicked(YearPart, MonthPart, DayPart);
486
            }
487
            else SetGoodDate(this, true);
488
         }
489
         else if (/(-|\/)(\d{2,4})$/.test(DefaultDate)) { // Year is at the end
490
            var YearPart = GetGoodYear(RegExp.$2);
491
            // Determine the order of the months and days
492
            if (/^(\w{1,3})(-|\/)(\w{1,3})(-|\/)/.test(DefaultDate)) {
493
               if (this.format.substr(0,1) == 'D') { // Starts with days
494
                  var DayPart = RegExp.$1;
495
                  var MonthPart = RegExp.$3;
496
               }
497
               else { // Starts with months
498
                  var MonthPart = RegExp.$1;
499
                  var DayPart = RegExp.$3;
500
               }
501
               MonthPart = (/\d{1,2}/i.test(MonthPart)) ? parseInt(MonthPart,10)-1 : getMonthIndex(MonthPart);
502
               this.setPicked(YearPart, MonthPart, DayPart);
503
            }
504
            else SetGoodDate(this, true);
505
         }
506
         else SetGoodDate(this, true);
507
      }
508
   }
509
}
510
511
// Main function that creates the form elements
512
function DateInput(DateName, Required, DateFormat, DefaultDate) {
513
   if (arguments.length == 0) document.writeln('<span style="color:red;font-size:' + FontSize + 'px;font-family:' + FontFamily + ';">ERROR: Missing required parameter in call to \'DateInput\': [name of hidden date field].</span>');
514
   else {
515
      // Handle DateFormat
516
      if (arguments.length < 3) { // The format wasn't passed in, so use default
517
         DateFormat = DefaultDateFormat;
518
         if (arguments.length < 2) Required = false;
519
      }
520
      else if (/^(Y{2,4}(-|\/)?)?((MON)|(MM?M?)|(DD?))(-|\/)?((MON)|(MM?M?)|(DD?))((-|\/)Y{2,4})?$/i.test(DateFormat)) DateFormat = DateFormat.toUpperCase();
521
      else { // Passed-in DateFormat was invalid, use default format instead
522
         var AlertMessage = 'WARNING: The supplied date format for the \'' + DateName + '\' field is not valid: ' + DateFormat + '\nTherefore, the default date format will be used instead: ' + DefaultDateFormat;
523
         DateFormat = DefaultDateFormat;
524
         if (arguments.length == 4) { // DefaultDate was passed in with an invalid date format
525
            var CurrentDate = new storedMonthObject(DateFormat, Today.getFullYear(), Today.getMonth(), Today.getDate());
526
            AlertMessage += '\n\nThe supplied date (' + DefaultDate + ') cannot be interpreted with the invalid format.\nTherefore, the current system date will be used instead: ' + CurrentDate.formatted;
527
            DefaultDate = CurrentDate.formatted;
528
         }
529
         alert(AlertMessage);
530
      }
531
      // Define the current date if it wasn't set already
532
      if (!CurrentDate) var CurrentDate = new storedMonthObject(DateFormat, Today.getFullYear(), Today.getMonth(), Today.getDate());
533
      // Handle DefaultDate
534
      if (arguments.length < 4) { // The date wasn't passed in
535
         DefaultDate = (Required) ? CurrentDate.formatted : ''; // If required, use today's date
536
      }
537
      // Creates the calendar object!
538
      eval(DateName + '_Object=new calendarObject(\'' + DateName + '\',\'' + DateFormat + '\',\'' + DefaultDate + '\')');
539
      // Determine initial viewable state of day, year, and calendar icon
540
      if ((Required) || (arguments.length == 4)) {
541
         var InitialStatus = '';
542
         var InitialDate = eval(DateName + '_Object.picked.formatted');
543
      }
544
      else {
545
         var InitialStatus = ' style="visibility:hidden"';
546
         var InitialDate = '';
547
         eval(DateName + '_Object.setPicked(' + Today.getFullYear() + ',' + Today.getMonth() + ',' + Today.getDate() + ')');
548
      }
549
      // Create the form elements
550
      with (document) {
551
         writeln('<input type="hidden" name="' + DateName + '" value="' + InitialDate + '">');
552
         // Find this form number
553
         for (var f=0;f<forms.length;f++) {
554
            for (var e=0;e<forms[f].elements.length;e++) {
555
               if (typeof forms[f].elements[e].type == 'string') {
556
                  if ((forms[f].elements[e].type == 'hidden') && (forms[f].elements[e].name == DateName)) {
557
                     eval(DateName + '_Object.formNumber='+f);
558
                     break;
559
                  }
560
               }
561
            }
562
         }
563
         writeln('<table cellpadding="0" cellspacing="2"><tr>' + String.fromCharCode(13) + '<td valign="middle">');
564
         writeln('<select' + InitialStatus + ' class="calendarDateInput" id="' + DateName + '_Day_ID" onChange="' + DateName + '_Object.changeDay(this)">');
565
         for (var j=1;j<=eval(DateName + '_Object.picked.dayCount');j++) {
566
            DaySelected = ((DefaultDate != '') && (eval(DateName + '_Object.picked.day') == j)) ? ' selected' : '';
567
            writeln('<option' + DaySelected + '>' + j + '</option>');
568
         }
569
         writeln('</select>' + String.fromCharCode(13) + '</td>' + String.fromCharCode(13) + '<td valign="middle">');
570
         writeln('<select class="calendarDateInput" id="' + DateName + '_Month_ID" onChange="' + DateName + '_Object.changeMonth(this)">');
571
         if (!Required) {
572
            var NoneSelected = (DefaultDate == '') ? ' selected' : '';
573
            writeln('<option value=""' + NoneSelected + '>' + UnselectedMonthText + '</option>');
574
         }
575
         for (var i=0;i<12;i++) {
576
            MonthSelected = ((DefaultDate != '') && (eval(DateName + '_Object.picked.monthIndex') == i)) ? ' selected' : '';
577
            writeln('<option value="' + i + '"' + MonthSelected + '>' + MonthNames[i].substr(0,3) + '</option>');
578
         }
579
         writeln('</select>' + String.fromCharCode(13) + '</td>' + String.fromCharCode(13) + '<td valign="middle">');
580
         writeln('<input' + InitialStatus + ' class="calendarDateInput" type="text" id="' + DateName + '_Year_ID" size="' + eval(DateName + '_Object.picked.yearPad.length') + '" maxlength="' + eval(DateName + '_Object.picked.yearPad.length') + '" title="Year" value="' + eval(DateName + '_Object.picked.yearPad') + '" onKeyPress="return YearDigitsOnly(window.event)" onKeyUp="' + DateName + '_Object.checkYear(this)" onBlur="' + DateName + '_Object.fixYear(this)">');
581
         write('<td valign="middle">' + String.fromCharCode(13) + '<a' + InitialStatus + ' id="' + DateName + '_ID_Link" href="javascript:' + DateName + '_Object.show()" onMouseOver="return ' + DateName + '_Object.iconHover(true)" onMouseOut="return ' + DateName + '_Object.iconHover(false)"><img src="' + ImageURL + '" align="baseline" title="Calendar" border="0"></a>&nbsp;');
582
         writeln('<span id="' + DateName + '_ID" style="position:absolute;visibility:hidden;width:' + (CellWidth * 7) + 'px;background-color:' + CalBGColor + ';border:1px solid dimgray;" onMouseOver="' + DateName + '_Object.handleTimer(true)" onMouseOut="' + DateName + '_Object.handleTimer(false)">');
583
         writeln('<table width="' + (CellWidth * 7) + '" cellspacing="0" cellpadding="1">' + String.fromCharCode(13) + '<tr style="background-color:' + TopRowBGColor + ';">');
584
         writeln('<td id="' + DateName + '_Previous_ID" style="cursor:default" align="center" class="calendarDateInput" style="height:' + CellHeight + '" onClick="' + DateName + '_Object.previous.go()" onMouseDown="VirtualButton(this,true)" onMouseUp="VirtualButton(this,false)" onMouseOver="return ' + DateName + '_Object.previous.hover(this,true)" onMouseOut="return ' + DateName + '_Object.previous.hover(this,false)" title="' + eval(DateName + '_Object.previous.monthName') + '"><img src="' + PrevURL + '"></td>');
585
         writeln('<td id="' + DateName + '_Current_ID" style="cursor:pointer" align="center" class="calendarDateInput" style="height:' + CellHeight + '" colspan="5" onClick="' + DateName + '_Object.displayed.goCurrent()" onMouseOver="self.status=\'Click to view ' + CurrentDate.fullName + '\';return true;" onMouseOut="self.status=\'\';return true;" title="Show Current Month">' + eval(DateName + '_Object.displayed.fullName') + '</td>');
586
         writeln('<td id="' + DateName + '_Next_ID" style="cursor:default" align="center" class="calendarDateInput" style="height:' + CellHeight + '" onClick="' + DateName + '_Object.next.go()" onMouseDown="VirtualButton(this,true)" onMouseUp="VirtualButton(this,false)" onMouseOver="return ' + DateName + '_Object.next.hover(this,true)" onMouseOut="return ' + DateName + '_Object.next.hover(this,false)" title="' + eval(DateName + '_Object.next.monthName') + '"><img src="' + NextURL + '"></td></tr>' + String.fromCharCode(13) + '<tr>');
587
         for (var w=0;w<7;w++) writeln('<td width="' + CellWidth + '" align="center" class="calendarDateInput" style="height:' + CellHeight + ';width:' + CellWidth + ';font-weight:bold;border-top:1px solid dimgray;border-bottom:1px solid dimgray;">' + WeekDays[w] + '</td>');
588
         writeln('</tr>' + String.fromCharCode(13) + '</table>' + String.fromCharCode(13) + '<span id="' + DateName + '_DayTable_ID">' + eval(DateName + '_Object.buildCalendar()') + '</span>' + String.fromCharCode(13) + '</span>' + String.fromCharCode(13) + '</td>' + String.fromCharCode(13) + '</tr>' + String.fromCharCode(13) + '</table>');
589
      }
590
   }
591
}