/***********************************************
 Fool-Proof Date Input Script with DHTML Calendar
 by Jason Moon - webmaster@moonfam.net
 Original script featured on and available at http://www.dynamicdrive.com
 * Keep this notice intact for use.
 Translation into Dutch Language and adjustment extensions 
 by Ben Boukes, (c) 2005
 ************************************************/

// Zaken die je kunt aanpassen voor eigen gebruik
var DefaultDateFormat = 'DD/MM/YYYY';     // Default-instelling voor het datum formaat
var HideWait = 3;                         // Wachttijd totdat de kalender verdwijnt, seconden
var Y2kPivotPoint = 76;                   // 2-cijferige jaaraanduidingen voor dit punt worden gemaakt in de 21e eeuw
// Opmaak van de popup-kalender
var FontSize = 13;                        // In pixels
var FontFamily = 'Tahoma';                // Aanduiding 'sans serif' zit hard in de code; hier niet noemen!
var CellWidth = 20;                       // Breedte van de kolommen in de kalender, pixels
var CellHeight = 18;                      // Hoogte van de rijen in de kalender, pixels 
var ImageURL = '../images/calendar.jpg';  // Icon naast de drie invoervelden
var NextURL = '../images/next.gif';       // Pijltje rechts in de bovenbalk
var PrevURL = '../images/prev.gif';       // Pijltje links in de bovenbalk
var CalBGColor = '#FFFFD8';               // Achtergrondkleur van de kalender
var TopRowBGColor = '#0099CC';            // Kleur van de bovenbalk
var TopTextColor = 'white';               // Tekstkleur in de bovenbalk
var DayBGColor = '#C0C0C0';               // Highlighted kleur van de gekozen dag
var DaysTextColor = 'green';              // Tekstkleur van Z M D W D V Z
var DaysRowColor = 'yellow';              // Streep onder Z M D W D V Z
var TableBorderColor = 'lime';            // Rand rond de popup
var TextNormalColor = 'navy';             // Tekstkleur van de kalender
var TextHighlightColor = 'red';           // Highlighted tekstkleur
var TodayMarkColor = 'blue';              // Marker van 'vandaag'
// Opmaak van het formulier op de bladzijde
var FormFontFamily = 'Verdana';            // Font van de invoervelden
var FormFontSize = 13;                     // In pixels

/**************************** Hieronder niets wijzigen *********************************************/

// Schrijf het style-sheet voor de kalender uit
with (document) {
   writeln('<style>');
   writeln('td.calendarDateInput {letter-spacing:normal;line-height:normal;font-family:' + FontFamily + ',Sans-Serif;font-size:' + FontSize + 'px;}');
   writeln('select.calendarDateInput {letter-spacing:.06em;font-family:' + FormFontFamily + ',Sans-Serif;font-size:' + FormFontSize + 'px;}');
   writeln('input.calendarDateInput {letter-spacing:.06em;font-family:' + FormFontFamily + ',Sans-Serif;font-size:' + FormFontSize + 'px;}');
   writeln('</style>');
}
// Globale variabelen
var ZCounter = 100;
var Today = new Date();
var WeekDays = new Array('Z','M','D','W','D','V','Z');
var MonthDays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var MonthNames = new Array('Januari','Februari','Maart','April','Mei','Juni','Juli','Augustus','September','Oktober','November','December');

// Toegestane toetsen in het datumveld
function NumOnly(e) {
   var KeyCode = (e.keyCode) ? e.keyCode : e.which;
   return ((KeyCode == 8) // backspace
        || (KeyCode == 9) // tab
        || (KeyCode == 37) // pijltje links
        || (KeyCode == 39) // pijltje rechts
        || (KeyCode == 46) // delete
        || ((KeyCode > 47) && (KeyCode < 58)) // 0 - 9
   );
}

// Haal de positie (pixel-abosoluut) op van het gegeven element
function GetTagPixels(StartTag, Direction) {
   var PixelAmt = (Direction == 'LEFT') ? StartTag.offsetLeft : StartTag.offsetTop;
   while ((StartTag.tagName != 'BODY') && (StartTag.tagName != 'HTML')) {
      StartTag = StartTag.offsetParent;
      PixelAmt += (Direction == 'LEFT') ? StartTag.offsetLeft : StartTag.offsetTop;
   }
   return PixelAmt;
}

// Zit de aangegeven keuzelijst achter de kalender?
function BehindCal(SelectList, CalLeftX, CalRightX, CalTopY, CalBottomY, ListTopY) {
   var ListLeftX = GetTagPixels(SelectList, 'LEFT');
   var ListRightX = ListLeftX + SelectList.offsetWidth;
   var ListBottomY = ListTopY + SelectList.offsetHeight;
   return (((ListTopY < CalBottomY) && (ListBottomY > CalTopY)) && ((ListLeftX < CalRightX) && (ListRightX > CalLeftX)));
}

// verberg elke keuzelijst achter de kalender in IE
function FixSelectLists(Over) {
  if (navigator.appName == 'Microsoft Internet Explorer') {
    var CalDiv = this.getCalendar();
    var CalLeftX = CalDiv.offsetLeft;
    var CalRightX = CalLeftX + CalDiv.offsetWidth;
    var CalTopY = CalDiv.offsetTop;
    var CalBottomY = CalTopY + (CellHeight * 9);
    var FoundCalInput = false;
    formLoop :
    for (var j=this.formNumber;j<document.forms.length;j++) {
      for (var i=0;i<document.forms[j].elements.length;i++) {
        if (typeof document.forms[j].elements[i].type == 'string') {
          if ((document.forms[j].elements[i].type == 'hidden') && (document.forms[j].elements[i].name == this.hiddenFieldName)) {
            FoundCalInput = true;
            i += 3; // 3 elementen tussen eerste verborgenveld en het jaar invoer veld
          }
          if (FoundCalInput) {
            if (document.forms[j].elements[i].type.substr(0,6) == 'select') {
              ListTopY = GetTagPixels(document.forms[j].elements[i], 'TOP');
              if (ListTopY < CalBottomY) {
                if (BehindCal(document.forms[j].elements[i], CalLeftX, CalRightX, CalTopY, CalBottomY, ListTopY)) {
                  document.forms[j].elements[i].style.visibility = (Over) ? 'hidden' : 'visible';
                }
              }
              else break formLoop;
            }
          }
        }
      }
    }
  }
}

// Toon een melding in de statusbalk als de muis zich boven de kalenderdagen bevindt
function DayCellHover(Cell, Over, Color, HoveredDay) {
  Cell.style.backgroundColor = (Over) ? DayBGColor : Color;
  if (Over) {
    if ((this.yearValue == Today.getFullYear()) && (this.monthIndex == Today.getMonth()) && (HoveredDay == Today.getDate())) self.status = 'Klik om &quot;vandaag&quot; te kiezen';
    else {
      var Suffix = HoveredDay.toString();
//      switch (Suffix.substr(Suffix.length - 1, 1)) {          **** Not in Dutch language ****
//      case '1' : Suffix += (HoveredDay == 11) ? 'th' : 'st'; break;
//      case '2' : Suffix += (HoveredDay == 12) ? 'th' : 'nd'; break;
//      case '3' : Suffix += (HoveredDay == 13) ? 'th' : 'rd'; break;
//      default : Suffix += 'th'; break;
//      }
      self.status = 'Selecteer ' + Suffix + ' ' + this.monthName;
    }
  }
  else self.status = '';
  return true;
}

// Werk de formuliervelden bij nadat een dag is geprikt uit de kalender
function PickDisplayDay(ClickedDay) {
  this.show();
  var MonthList = this.getMonthList();
  var DayList = this.getDayList();
  var YearField = this.getYearField();
  FixDayList(DayList, GetDayCount(this.displayed.yearValue, this.displayed.monthIndex));
  // Kies maand en dag in de lijsten
  for (var i=0;i<MonthList.length;i++) {
    if (MonthList.options[i].value == this.displayed.monthIndex) MonthList.options[i].selected = true;
  }
  for (var j=1;j<=DayList.length;j++) {
    if (j == ClickedDay) DayList.options[j-1].selected = true;
  }
  this.setPicked(this.displayed.yearValue, this.displayed.monthIndex, ClickedDay);
  // Wijzig het jaar, indien nodig
  YearField.value = this.picked.yearPad;
  YearField.defaultValue = YearField.value;
}

// Bouwt de HTML voor de kalenderdagen
function BuildCalendarDays() {
  var Rows = 5;
  if (((this.displayed.dayCount == 31) && (this.displayed.firstDay > 4)) || ((this.displayed.dayCount == 30) && (this.displayed.firstDay == 6))) Rows = 6;
  else if ((this.displayed.dayCount == 28) && (this.displayed.firstDay == 0)) Rows = 4;
  var HTML = '<table width="' + (CellWidth * 7) + '" cellspacing="0" cellpadding="1" style="cursor:default">';
  for (var j=0;j<Rows;j++) {
    HTML += '<tr>';
    for (var i=1;i<=7;i++) {
      Day = (j * 7) + (i - this.displayed.firstDay);
      if ((Day >= 1) && (Day <= this.displayed.dayCount)) {
        if ((this.displayed.yearValue == this.picked.yearValue) && (this.displayed.monthIndex == this.picked.monthIndex) && (Day == this.picked.day)) {
          TextStyle = 'color:'+TextHighlightColor+';font-weight:bold;'
          BackColor = DayBGColor;
        }
        else {
          TextStyle = 'color:'+TextNormalColor+';';
          BackColor = CalBGColor;
        }
        if ((this.displayed.yearValue == Today.getFullYear()) && (this.displayed.monthIndex == Today.getMonth()) && (Day == Today.getDate())) TextStyle += 'border:1px solid ' + TodayMarkColor + ';padding:0px;';
        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>';
      }
      else HTML += '<td class="calendarDateInput" style="height:' + CellHeight + '">&nbsp;</td>';
    }
    HTML += '</tr>';
  }
  return HTML += '</table>';
}

// Kijk welke eeuw (20e of 21e) moet worden gebruikt bij 2-cijferige jaaraanduidingen
function GetGoodYear(YearDigits) {
  if (YearDigits.length == 4) return YearDigits;
  else {
    var Millennium = (YearDigits < Y2kPivotPoint) ? 2000 : 1900;
    return Millennium + parseInt(YearDigits,10);
  }
}

// Geef het aantal dagen in een maand terug, verwerkt tevens schrikkeljaren
function GetDayCount(SomeYear, SomeMonth) {
  return ((SomeMonth == 1) && ((SomeYear % 400 == 0) || ((SomeYear % 4 == 0) && (SomeYear % 100 != 0)))) ? 29 : MonthDays[SomeMonth];
}

// Button Highlights
function VirtualButton(Cell, ButtonDown) {
  if (ButtonDown) {
    Cell.style.borderLeft = 'buttonshadow 1px solid';
    Cell.style.borderTop = 'buttonshadow 1px solid';
    Cell.style.borderBottom = 'buttonhighlight 1px solid';
    Cell.style.borderRight = 'buttonhighlight 1px solid';
  } else {
    Cell.style.borderLeft = 'buttonhighlight 1px solid';
    Cell.style.borderTop = 'buttonhighlight 1px solid';
    Cell.style.borderBottom = 'buttonshadow 1px solid';
    Cell.style.borderRight = 'buttonshadow 1px solid';
  }
}

// Mouse-over voor de vorige/volgens maand buttons
function NeighborHover(Cell, Over, DateObj) {
  if (Over) {
    VirtualButton(Cell, false);
    self.status = 'Toon ' + DateObj.fullName;
  }  else {
    Cell.style.border = 'none';
    self.status = '';
  }
  return true;
}

// Voeg dagen toe of verwijder dagen uit de keuzelijst voor dagen.
// afhankelijk van maand en jaar
function FixDayList(DayList, NewDays) {
  var DayPick = DayList.selectedIndex + 1;
  if (NewDays != DayList.length) {
    var OldSize = DayList.length;
    for (var k=Math.min(NewDays,OldSize);k<Math.max(NewDays,OldSize);k++) {
       (k >= NewDays) ? DayList.options[NewDays] = null : DayList.options[k] = new Option(k+1, k+1);
    }
    DayPick = Math.min(DayPick, NewDays);
    DayList.options[DayPick-1].selected = true;
  }
  return DayPick;
}

// Zet het jaar terug op de vorige waarde na een ongeldige invoer
function FixYearInput(YearField) {
  var YearRE = new RegExp('\\d{' + YearField.defaultValue.length + '}');
  if (!YearRE.test(YearField.value)) YearField.value = YearField.defaultValue;
}

// Toon een melding in de statusbalkals de muis zich boven het kalender-icon bevindt
function CalIconHover(Over) {
  var Message = (this.isShowing()) ? 'verbergen' : 'tonen';
  self.status = (Over) ? 'klik om de kalender te ' + Message : '';
  return true;
}

// Herstart de timer
function CalTimerReset() {
  eval('clearTimeout(' + this.timerID + ')');
  eval(this.timerID + '=setTimeout(\'' + this.objName + '.show()\',' + (HideWait * 1000) + ')');
}

// De timer voor de kalender
function DoTimer(CancelTimer) {
  if (CancelTimer) eval('clearTimeout(' + this.timerID + ')');
  else {
    eval(this.timerID + '=null');
    this.resetTimer();
  }
}

// Toon of verberg de kalender
function ShowCalendar() {
  if (this.isShowing()) {
    var StopTimer = true;
    this.getCalendar().style.zIndex = --ZCounter;
    this.getCalendar().style.visibility = 'hidden';
    this.fixSelects(false);
  }
  else {
    var StopTimer = false;
    this.fixSelects(true);
    this.getCalendar().style.zIndex = ++ZCounter;
    this.getCalendar().style.visibility = 'visible';
  }
  this.handleTimer(StopTimer);
  self.status = '';
}

// Verbergt de invoer elementen als de "blanco" maand wordt gekozen
function SetElementStatus(Hide) {
  this.getDayList().style.visibility = (Hide) ? 'hidden' : 'visible';
  this.getYearField().style.visibility = (Hide) ? 'hidden' : 'visible';
  this.getCalendarLink().style.visibility = (Hide) ? 'hidden' : 'visible';
}

// Stel de datum in, gebaseerd op de gekozen maand
function CheckMonthChange(MonthList) {
  var DayList = this.getDayList();
  if (MonthList.options[MonthList.selectedIndex].value == '') {
    DayList.selectedIndex = 0;
    this.hideElements(true);
    this.setHidden('');
  }
  else {
    this.hideElements(false);
    if (this.isShowing()) {
      this.resetTimer(); // Geef de gebruiker meer tijd om de kalender met de nieuw-gekozen maand te bekijken
      this.getCalendar().style.zIndex = ++ZCounter; // Zorg dat deze kalender helemaal bovenop de stapel van andere kalenders zit
    }
    var DayPick = FixDayList(DayList, GetDayCount(this.picked.yearValue, MonthList.options[MonthList.selectedIndex].value));
    this.setPicked(this.picked.yearValue, MonthList.options[MonthList.selectedIndex].value, DayPick);
  }
}

// Stel de datum in, gebaseerd op de gekozen dag
function CheckDayChange(DayList) {
  if (this.isShowing()) this.show();
  this.setPicked(this.picked.yearValue, this.picked.monthIndex, DayList.selectedIndex+1);
}

// Wijzig de datum als een geldige jaaraanduiding is ingevoerd
function CheckYearInput(YearField) {
  if ((YearField.value.length == YearField.defaultValue.length) && (YearField.defaultValue != YearField.value)) {
    if (this.isShowing()) {
      this.resetTimer(); // Geef de gebruiker meer tijd om de kalender met de nieuw-gekozen jaar te bekijken
      this.getCalendar().style.zIndex = ++ZCounter; // Zorg dat deze kalender helemaal bovenop de stapel van andere kalenders zit
    }
    var NewYear = GetGoodYear(YearField.value);
    var MonthList = this.getMonthList();
    var NewDay = FixDayList(this.getDayList(), GetDayCount(NewYear, this.picked.monthIndex));
    this.setPicked(NewYear, this.picked.monthIndex, NewDay);
    YearField.defaultValue = YearField.value;
  }
}

// Karakteristieken van een datum
function dateObject() {
  this.date = (arguments.length == 1) ? new Date(arguments[0]) : new Date(arguments[0], arguments[1], arguments[2]);
  this.yearValue = this.date.getFullYear();
  this.monthIndex = this.date.getMonth();
  this.monthName = MonthNames[this.monthIndex];
  this.fullName = this.monthName + ' ' + this.yearValue;
  this.day = this.date.getDate();
  this.dayCount = GetDayCount(this.yearValue, this.monthIndex);
  var FirstDate = new Date(this.yearValue, this.monthIndex, 1);
  this.firstDay = FirstDate.getDay();
}

// Keeps track of the date that goes into the hidden field
function storedMonthObject(DateFormat, DateYear, DateMonth, DateDay) {
  dateObject.call(this, DateYear, DateMonth, DateDay);
  this.yearPad = this.yearValue.toString();
  this.monthPad = (this.monthIndex < 9) ? '0' + String(this.monthIndex + 1) : this.monthIndex + 1;
  this.dayPad = (this.day < 10) ? '0' + this.day.toString() : this.day;
  this.monthShort = this.monthName.substr(0,3).toUpperCase();
  // Format de jaaraanduiding
  if (DateFormat != 'YYYYMMDD') {
    DateFormat.match(/(Y{2,4})$/);
    if (RegExp.$1.length == 2) this.yearPad = this.yearPad.substr(2);
  }
  // Format de datum
  if (/YYYYMMDD/.test(DateFormat)) this.formatted = this.yearPad + this.monthPad + this.dayPad;
  else {
    if (/MM?\/DD?\/Y{2,4}/.test(DateFormat)) var FirstPart = this.monthPad + '/' + this.dayPad + '/';
    else if (/DD?\/MM?\/Y{2,4}/.test(DateFormat)) var FirstPart = this.dayPad + '/' + this.monthPad + '/';
    else if (/DD?-((MON)|(MMM))-Y{2,4}/.test(DateFormat)) var FirstPart = this.dayPad + '-' + this.monthShort + '-';
    else if (/((MON)|(MMM))-DD?-Y{2,4}/.test(DateFormat)) var FirstPart = this.monthShort + '-' + this.dayPad + '-';
    this.formatted = FirstPart + this.yearPad;
  }
}

// Object voor de nu getoonde maand
function displayMonthObject(ParentObject, DateYear, DateMonth, DateDay) {
  dateObject.call(this, DateYear, DateMonth, DateDay);
  this.displayID = ParentObject.hiddenFieldName + '_Current_ID';
  this.getDisplay = new Function('return document.getElementById(this.displayID)');
  this.dayHover = DayCellHover;
  this.goCurrent = new Function(ParentObject.objName + '.getCalendar().style.zIndex=++ZCounter;' + ParentObject.objName + '.setDisplayed(Today.getFullYear(),Today.getMonth());');
  if (ParentObject.formNumber >= 0) this.getDisplay().innerHTML = this.fullName;
}

// Object voor de volgende/vorige buttons
function neighborMonthObject(ParentObject, IDText, DateMS) {
  dateObject.call(this, DateMS);
  this.buttonID = ParentObject.hiddenFieldName + '_' + IDText + '_ID';
  this.hover = new Function('C','O','NeighborHover(C,O,this)');
  this.getButton = new Function('return document.getElementById(this.buttonID)');
  this.go = new Function(ParentObject.objName + '.getCalendar().style.zIndex=++ZCounter;' + ParentObject.objName + '.setDisplayed(this.yearValue,this.monthIndex);');
  if (ParentObject.formNumber >= 0) this.getButton().title = this.monthName;
}

// Stelt het nu getoonde maand-object in
function SetDisplayedMonth(DispYear, DispMonth) {
  this.displayed = new displayMonthObject(this, DispYear, DispMonth, 1);
  // Creeer objecten voor de vorige en de volgende maand
  this.previous = new neighborMonthObject(this, 'Previous', this.displayed.date.getTime() - 86400000);
  this.next = new neighborMonthObject(this, 'Next', this.displayed.date.getTime() + (86400000 * (this.displayed.dayCount + 1)));
  // Creeer de HTML voor de kalender
  if (this.formNumber >= 0) this.getDayTable().innerHTML = this.buildCalendar();
}

// Stel de nu geselecteerde datum in
function SetPickedMonth(PickedYear, PickedMonth, PickedDay) {
  this.picked = new storedMonthObject(this.format, PickedYear, PickedMonth, PickedDay);
  this.setHidden(this.picked.formatted);
  this.setDisplayed(PickedYear, PickedMonth);
}

// Het Kalender Object
function calendarObject(DateName, DateFormat, DefaultDate) {

  /* Eigenschappen */
  this.hiddenFieldName = DateName;
  this.monthListName = DateName + '_Month';
  this.dayListID = DateName + '_Day_ID';
  this.yearFieldID = DateName + '_Year_ID';
  this.monthDisplayID = DateName + '_Current_ID';
  this.calendarID = DateName + '_ID';
  this.dayTableID = DateName + '_DayTable_ID';
  this.calendarLinkID = this.calendarID + '_Link';
  this.timerID = this.calendarID + '_Timer';
  this.objName = DateName + '_Object';
  this.format = DateFormat;
  this.formNumber = -1;
  this.picked = null;
  this.displayed = null;
  this.previous = null;
  this.next = null;

  /* Methodes */
  this.setPicked = SetPickedMonth;
  this.setDisplayed = SetDisplayedMonth;
  this.checkYear = CheckYearInput;
  this.fixYear = FixYearInput;
  this.changeMonth = CheckMonthChange;
  this.changeDay = CheckDayChange;
  this.resetTimer = CalTimerReset;
  this.hideElements = SetElementStatus;
  this.show = ShowCalendar;
  this.handleTimer = DoTimer;
  this.iconHover = CalIconHover;
  this.buildCalendar = BuildCalendarDays;
  this.pickDay = PickDisplayDay;
  this.fixSelects = FixSelectLists;
  this.setHidden = new Function('D','if (this.formNumber >= 0) this.getHiddenField().value=D');
  // Geeft een referentie aan deze elementen terug
  this.getHiddenField = new Function('return document.forms[this.formNumber].elements[this.hiddenFieldName]');
  this.getMonthList = new Function('return document.forms[this.formNumber].elements[this.monthListName]');
  this.getDayList = new Function('return document.getElementById(this.dayListID)');
  this.getYearField = new Function('return document.getElementById(this.yearFieldID)');
  this.getCalendar = new Function('return document.getElementById(this.calendarID)');
  this.getDayTable = new Function('return document.getElementById(this.dayTableID)');
  this.getCalendarLink = new Function('return document.getElementById(this.calendarLinkID)');
  this.getMonthDisplay = new Function('return document.getElementById(this.monthDisplayID)');
  this.isShowing = new Function('return !(this.getCalendar().style.visibility != \'visible\')');

  /* Constructor */
  // Functies, alleen gebruikt door de constructor
  function getMonthIndex(MonthAbbr) { // Geeft de index (0-11) van de maand-afkorting terug
    for (var MonPos=0;MonPos<MonthNames.length;MonPos++) {
      if (MonthNames[MonPos].substr(0,3).toUpperCase() == MonthAbbr.toUpperCase()) break;
    }
    return MonPos;
  }
  function SetGoodDate(CalObj, Notify) { // Meldt een foute datum-invoer, stelt de huidige systeem datum in
    CalObj.setPicked(Today.getFullYear(), Today.getMonth(), Today.getDate());
    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);
  }
  // Constructor: main part
  if (DefaultDate == 'undefined') SetGoodDate(this, false);
  else {
    if (this.format == 'YYYYMMDD') {
       (/^\d{8}$/.test(DefaultDate)) ? this.setPicked(DefaultDate.substr(0,4), parseInt(DefaultDate.substr(4,2),10)-1, DefaultDate.substr(6,2)) : SetGoodDate(this, true);
    }
    else {
      if (/\//.test(this.format)) {
        if (/^(\d{1,2})\/(\d{1,2})\/(\d{2,4})$/.test(DefaultDate)) {
          if (this.format.substr(0,1) == 'M') {
            var MonPart = RegExp.$1;
            var DayPart = RegExp.$2;
          }
          else {
            var MonPart = RegExp.$2;
            var DayPart = RegExp.$1;
          }
          this.setPicked(GetGoodYear(RegExp.$3), parseInt(MonPart,10)-1, DayPart);
        }
        else SetGoodDate(this, true);
      }
      else if (/-/.test(this.format)) {
        var REMonths = '';
        for (var j=0;j<MonthNames.length;j++) {
          if (j > 0) REMonths += '|';
          REMonths += MonthNames[j].substr(0,3).toUpperCase();
        }
        if (this.format.substr(0,1) == 'D') {
          var DateRE = new RegExp('^(\\d{1,2})-(' + REMonths + ')-(\\d{2,4})$', 'i');
          (DateRE.test(DefaultDate)) ? this.setPicked(GetGoodYear(RegExp.$3), getMonthIndex(RegExp.$2), RegExp.$1) : SetGoodDate(this, true);
        }
        else {
          var DateRE = new RegExp('^(' + REMonths + ')-(\\d{1,2})-(\\d{2,4})$', 'i');
          (DateRE.test(DefaultDate)) ? this.setPicked(GetGoodYear(RegExp.$3), getMonthIndex(RegExp.$1), RegExp.$2) : SetGoodDate(this, true);
        }
      }
    }
  }
}

// Main function: Maakt en toont de pupup, past de formulier elementen aan
function DateInput(DateName, Required, AbbrevMonth, DateFormat, DefaultDate) {
  if (DateName == undefined) document.writeln('<span style="color:red;font-size:' + FontSize + 'px;font-family:' + FontFamily + ';">ERROR: Ontbrekende parameter in call naar \'DateInput\': [naam verborgen datum-veld].</span>');
  else {
    if (Required == undefined) Required = false;
    if (AbbrevMonth == undefined) AbbrevMonth = true;
    if (DateFormat == undefined) DateFormat = DefaultDateFormat;
    else if ((/^YYYYMMDD$/i.test(DateFormat)) || (/^((MM?)|(DD?))\/((MM?)|(DD?))\/Y{2,4}$/i.test(DateFormat)) || (/^((DD?)|((MON)|(MMM)))-((DD?)|((MON)|(MMM)))-Y{2,4}$/i.test(DateFormat))) DateFormat = DateFormat.toUpperCase();
    else {
      var AlertMessage = 'WARNING: Het opgegeven datum format voor het veld \'' + DateName + '\' is ongeldig: ' + DateFormat + '\nDaarom wordt de default instelling gebruikt: ' + DefaultDateFormat;
      var CurrentDate = new storedMonthObject(DefaultDateFormat, Today.getFullYear(), Today.getMonth(), Today.getDate());
      if (DefaultDate != undefined) AlertMessage += '\n\nDe opgegeven datum kan niet worden verwerkt met het ongeldige format.\nDaarom wordt de huidige systeemdatum toegepast: ' + CurrentDate.formatted;
      DateFormat = DefaultDateFormat;
      DefaultDate = CurrentDate.formatted;
      alert(AlertMessage);
    }
    // Maakt het kalender object!
    eval(DateName + '_Object=new calendarObject(\'' + DateName + '\',\'' + DateFormat + '\',\'' + DefaultDate + '\')');
    if ((!Required) && (DefaultDate == undefined)) {
      var InitialStatus = ' style="visibility:hidden"';
      var InitialDate = '';
    }
    else {
      var InitialStatus = '';
      var InitialDate = eval(DateName + '_Object.picked.formatted');
    }
    if ((Required) && (DefaultDate == undefined)) DefaultDate = eval(DateName + '_Object.picked.formatted');
    // Maak de formulier elementen
    with (document) {
      writeln('<input type="hidden" name="' + DateName + '" value="' + InitialDate + '">');
      // Zoek het nummer van dit formulier op
      for (var f=0;f<forms.length;f++) {
        for (var e=0;e<forms[f].elements.length;e++) {
          if (typeof forms[f].elements[e].type == 'string') {
            if ((forms[f].elements[e].type == 'hidden') && (forms[f].elements[e].name == DateName)) {
              eval(DateName + '_Object.formNumber='+f);
               break;
            }
         }
       }
     }
     writeln('<table cellpadding="0" cellspacing="2" border="0"><tr>' + String.fromCharCode(13) + '<td valign="middle">');
     // listbox dagen
     writeln('<select' + InitialStatus + ' class="calendarDateInput" id="' + DateName + '_Day_ID" onChange="' + DateName + '_Object.changeDay(this)">');
     for (var j=1;j<=eval(DateName + '_Object.picked.dayCount');j++) {
       DaySelected = ((DefaultDate != undefined) && eval(DateName + '_Object.picked.day=='+j)) ? ' selected' : '';
       writeln('<option' + DaySelected + '>' + j + '</option>');
     }
     // Listbox maanden
     writeln('</select>' + String.fromCharCode(13) + '</td>' + String.fromCharCode(13) + '<td valign="middle">'); 
     writeln('<select name="' + DateName + '_Month" class="calendarDateInput" onChange="' + DateName + '_Object.changeMonth(this)">');
     if (!Required) {
       var NoneSelected = (DefaultDate == undefined) ? ' selected' : '';
       writeln('<option value=""' + NoneSelected + '></option>');
     }
     for (var i=0;i<12;i++) {
        MonthSelected = ((DefaultDate != undefined) && (eval(DateName + '_Object.picked.monthIndex=='+i))) ? ' selected' : '';
        if (!AbbrevMonth)
          writeln('<option value="' + i + '"' + MonthSelected + '>' + MonthNames[i] + '</option>')
        else
          writeln('<option value="' + i + '"' + MonthSelected + '>' + MonthNames[i].substr(0,3) + '</option>');
     }
     writeln('</select>' + String.fromCharCode(13) + '</td>' + String.fromCharCode(13) + '<td valign="middle">');
     // tekstveld jaren en kalender plaatje
     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 NumOnly(event)" onKeyUp="' + DateName + '_Object.checkYear(this)" onBlur="' + DateName + '_Object.fixYear(this)">');
     write('</td>' + String.fromCharCode(13) + '<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 + '" alt="" width="16" height="15" hspace="5" border="0" align="baseline" title="Calendar"></a>&nbsp;');
     writeln('<span id="' + DateName + '_ID" style="position:absolute;visibility:hidden;width:' + (CellWidth * 7) + 'px;background-color:' + CalBGColor + ';border:1px solid ' + TableBorderColor + ';" onMouseOver="' + DateName + '_Object.handleTimer(true)" onMouseOut="' + DateName + '_Object.handleTimer(false)">');
     // tabel-kop van de popup-kalender
     writeln('<table width="' + (CellWidth * 7) + '" cellspacing="0" cellpadding="1">' + String.fromCharCode(13) + '<tr style="background-color:' + TopRowBGColor + ';">');
     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 + '" width="5" height="9"></td>');
     writeln('<td id="' + DateName + '_Current_ID" style="color:' + TopTextColor + ';cursor:pointer" align="center" class="calendarDateInput" style="height:' + CellHeight + '" colspan="5" onClick="' + DateName + '_Object.displayed.goCurrent()" onMouseOver="self.status=\'Toon ' + eval(DateName + '_Object.displayed.fullName') + '\';return true;" onMouseOut="self.status=\'\';return true;" title="Toon huidige maand">' + eval(DateName + '_Object.displayed.fullName') + '</td>');
     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 + '" width="5" height="9"></td></tr>' + String.fromCharCode(13) + '<tr>');
     // tabel cellen met dagnamen
     for (var w=0;w<7;w++) writeln('<td width="18" align="center" class="calendarDateInput" style="height:' + CellHeight + ';width:' + CellWidth + ';font-weight:bold;border-bottom:1px solid ' + DaysRowColor + ';color:'+DaysTextColor+'">' + WeekDays[w] + '</td>');
       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>');
     }
  }
}