webcit/static/datepicker-dev.js

   1 /**
   2  * DatePicker widget using Prototype and Scriptaculous.
   3  * (c) 2007 Mathieu Jondet <mathieu@eulerian.com>
   4  * Eulerian Technologies
   5  *
   6  * DatePicker is freely distributable under the same terms as Prototype.
   7  *
   8  */
   9
  10 /**
  11  * DatePickerFormatter class for matching and stringifying dates.
  12  *
  13  * By Arturas Slajus <x11@arturaz.net>.
  14  */
  15 var DatePickerFormatter = Class.create();
  16 DatePickerFormatter.prototype = {
  17     /**
  18      * Create a DatePickerFormatter.
  19      *
  20      * format: specify a format by passing 3 value array consisting of
  21      *   "yyyy", "mm", "dd". Default: ["yyyy", "mm", "dd"].
  22      *
  23      * separator: string for splitting the values. Default: "-".
  24      *
  25      * Use it like this:
  26      *   var df = new DatePickerFormatter(["dd", "mm", "yyyy"], "/");
  27      *   df.current_date();
  28      *   df.match("7/7/2007");
  29      */
  30     initialize: function(format, separator) {
  31         if (Object.isUndefined(format))
  32          format = ["yyyy", "mm", "dd"];
  33         if (Object.isUndefined(separator))
  34          separator = "-";
  35
  36         this._format    = format;
  37         this.separator  = separator;
  38
  39         this._format_year_index = format.indexOf("yyyy");
  40         this._format_month_index= format.indexOf("mm");
  41         this._format_day_index  = format.indexOf("dd");
  42
  43         this._year_regexp       = /^\d{4}$/;
  44         this._month_regexp      = /^0\d|1[012]|\d$/;
  45         this._day_regexp        = /^0\d|[12]\d|3[01]|\d$/;
  46     },
  47
  48     /**
  49      * Match a string against date format.
  50      * Returns: [year, month, day]
  51      */
  52     match: function(str) {
  53         var d = str.split(this.separator);
  54
  55         if (d.length < 3)
  56          return false;
  57
  58         var year = d[this._format_year_index].match(this._year_regexp);
  59         if (year) { year = year[0] } else { return false }
  60         var month = d[this._format_month_index].match(this._month_regexp);
  61         if (month) { month = month[0] } else { return false }
  62         var day = d[this._format_day_index].match(this._day_regexp);
  63         if (day) { day = day[0] } else { return false }
  64
  65         return [year, month, day];
  66     },
  67
  68     /**
  69      * Return current date according to format.
  70      */
  71     current_date: function() {
  72         var d = new Date;
  73         return this.date_to_string(
  74             d.getFullYear(),
  75             d.getMonth() + 1,
  76             d.getDate()
  77        );
  78     },
  79
  80     /**
  81      * Return a stringified date accordint to format.
  82      */
  83     date_to_string: function(year, month, day, separator) {
  84         if (Object.isUndefined(separator))
  85          separator = this.separator;
  86
  87         var a = [0, 0, 0];
  88         a[this._format_year_index]      = year;
  89         a[this._format_month_index]     = month.toPaddedString(2);
  90         a[this._format_day_index]       = day.toPaddedString(2);
  91
  92         return a.join(separator);
  93     }
  94 };
  95
  96
  97 /**
  98  * DatePicker
  99  */
 100
 101 var DatePicker  = Class.create();
 102
 103 DatePicker.prototype    = {
 104  Version        : '0.9.4',
 105  _relative      : null,
 106  _div           : null,
 107  _zindex        : 1,
 108  _keepFieldEmpty: false,
 109  _daysInMonth   : [31,28,31,30,31,30,31,31,30,31,30,31],
 110  _dateFormat    : [ ["dd", "mm", "yyyy"], "/" ],
 111  /* language */
 112  _language      : 'fr',
 113  _language_month        : $H({
 114   'fr'  : [ 'Janvier', 'F&#233;vrier', 'Mars', 'Avril', 'Mai', 'Juin',
 115    'Juillet', 'Aout', 'Septembre', 'Octobre', 'Novembre', 'D&#233;cembre' ],
 116   'en'  : [ 'January', 'February', 'March', 'April', 'May',
 117    'June', 'July', 'August', 'September', 'October', 'November', 'December' ],
 118   'sp'  : [ 'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
 119    'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre' ],
 120   'it'  : [ 'Gennaio', 'Febbraio', 'Marzo', 'Aprile', 'Maggio', 'Giugno',
 121    'Luglio', 'Agosto', 'Settembre', 'Ottobre', 'Novembre', 'Dicembre' ],
 122   'de'  : [ 'Januar', 'Februar', 'M&#228;rz', 'April', 'Mai', 'Juni',
 123    'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember' ],
 124   'pt'  : [ 'Janeiro', 'Fevereiro', 'Mar&#231;o', 'Abril', 'Maio', 'Junho',
 125    'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro' ],
 126   'hu'  : [ 'Janu&#225;r', 'Febru&#225;r', 'M&#225;rcius', '&#193;prilis',
 127    'M&#225;jus', 'J&#250;nius', 'J&#250;lius', 'Augusztus', 'Szeptember',
 128    'Okt&#243;ber', 'November', 'December' ],
 129   'lt'  : [ 'Sausis', 'Vasaris', 'Kovas', 'Balandis', 'Gegu&#382;&#279;',
 130    'Bir&#382;elis', 'Liepa', 'Rugj&#363;tis', 'Rus&#279;jis', 'Spalis',
 131    'Lapkritis', 'Gruodis' ],
 132   'nl'  : [ 'januari', 'februari', 'maart', 'april', 'mei', 'juni',
 133    'juli', 'augustus', 'september', 'oktober', 'november', 'december' ],
 134   'dk'  : [ 'Januar', 'Februar', 'Marts', 'April', 'Maj',
 135    'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'December' ],
 136   'no'  : [ 'Januar', 'Februar', 'Mars', 'April', 'Mai', 'Juni',
 137    'Juli', 'August', 'September', 'Oktober', 'November', 'Desember' ],
 138   'lv'  : [ 'Janv&#257;ris', 'Febru&#257;ris', 'Marts', 'Apr&#299;lis', 'Maijs',
 139    'J&#363;nijs', 'J&#363;lijs', 'Augusts', 'Septembris', 'Oktobris',
 140    'Novembris', 'Decemberis' ],
 141   'ja'  : [ '1&#26376;', '2&#26376;', '3&#26376;', '4&#26376;', '5&#26376;',
 142    '6&#26376;', '7&#26376;', '8&#26376;', '9&#26376;', '10&#26376;',
 143    '11&#26376;', '12&#26376;' ],
 144   'fi'  : [ 'Tammikuu', 'Helmikuu', 'Maaliskuu', 'Huhtikuu', 'Toukokuu',
 145    'Kes&#228;kuu', 'Hein&#228;kuu', 'Elokuu', 'Syyskuu', 'Lokakuu',
 146    'Marraskuu', 'Joulukuu' ],
 147   'ro'  : [ 'Ianuarie', 'Februarie', 'Martie', 'Aprilie', 'Mai', 'Junie',
 148    'Julie', 'August', 'Septembrie', 'Octombrie', 'Noiembrie', 'Decembrie' ],
 149   'zh'  : [ '1&#32;&#26376;', '2&#32;&#26376;', '3&#32;&#26376;',
 150    '4&#32;&#26376;', '5&#32;&#26376;', '6&#32;&#26376;', '7&#32;&#26376;',
 151    '8&#32;&#26376;', '9&#32;&#26376;', '10&#26376;', '11&#26376;', '12&#26376;'],
 152   'sv'  : [ 'Januari', 'Februari', 'Mars', 'April', 'Maj', 'Juni',
 153    'Juli', 'Augusti', 'September', 'Oktober', 'November', 'December' ]
 154  }),
 155  _language_day  : $H({
 156   'fr'  : [ 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam', 'Dim' ],
 157   'en'  : [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
 158   'sp'  : [ 'Lun', 'Mar', 'Mie', 'Jue', 'Vie', 'S&#225;b', 'Dom' ],
 159   'it'  : [ 'Lun', 'Mar', 'Mer', 'Gio', 'Ven', 'Sab', 'Dom' ],
 160   'de'  : [ 'Mon', 'Die', 'Mit', 'Don', 'Fre', 'Sam', 'Son' ],
 161   'pt'  : [ 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'S&#225;b', 'Dom' ],
 162   'hu'  : [ 'H&#233;', 'Ke', 'Sze', 'Cs&#252;', 'P&#233;', 'Szo', 'Vas' ],
 163   'lt'  : [ 'Pir', 'Ant', 'Tre', 'Ket', 'Pen', '&Scaron;e&scaron;', 'Sek' ],
 164   'nl'  : [ 'ma', 'di', 'wo', 'do', 'vr', 'za', 'zo' ],
 165   'dk'  : [ 'Man', 'Tir', 'Ons', 'Tor', 'Fre', 'L&#248;r', 'S&#248;n' ],
 166   'no'  : [ 'Man', 'Tir', 'Ons', 'Tor', 'Fre', 'L&#248;r', 'Sun' ],
 167   'lv'  : [ 'P', 'O', 'T', 'C', 'Pk', 'S', 'Sv' ],
 168   'ja'  : [ '&#26376;', '&#28779;', '&#27700;', '&#26408;', '&#37329;',
 169    '&#22303;', '&#26085;' ],
 170   'fi'  : [ 'Ma', 'Ti', 'Ke', 'To', 'Pe', 'La', 'Su' ],
 171   'ro'  : [ 'Lun', 'Mar', 'Mie', 'Joi', 'Vin', 'Sam', 'Dum' ],
 172   'zh'  : [ '&#21608;&#19968;', '&#21608;&#20108;', '&#21608;&#19977;',
 173    '&#21608;&#22235;', '&#21608;&#20116;', '&#21608;&#20845;',
 174    '&#21608;&#26085;' ],
 175   'sv'  : [ 'M&#229;n', 'Tis', 'Ons', 'Tor', 'Fre', 'L&#246;r',
 176    'S&#246;n' ]
 177  }),
 178  _language_close        : $H({
 179   'fr'  : 'fermer',
 180   'en'  : 'close',
 181   'sp'  : 'cerrar',
 182   'it'  : 'fine',
 183   'de'  : 'schliessen',
 184   'pt'  : 'fim',
 185   'hu'  : 'bez&#225;r',
 186   'lt'  : 'udaryti',
 187   'nl'  : 'sluiten',
 188   'dk'  : 'luk',
 189   'no'  : 'lukk',
 190   'lv'  : 'aizv&#275;rt',
 191   'ja'  : '&#38281;&#12376;&#12427;',
 192   'fi'  : 'sulje',
 193   'ro'  : 'inchide',
 194   'zh'  : '&#20851;&#32;&#38381',
 195   'sv'  : 'st&#228;ng'
 196  }),
 197  /* date manipulation */
 198  _todayDate             : new Date(),
 199  _current_date          : null,
 200  _clickCallback         : Prototype.emptyFunction,
 201  _cellCallback          : Prototype.emptyFunction,
 202  _id_datepicker         : null,
 203  _disablePastDate       : false,
 204  _disableFutureDate     : true,
 205  _enableYearBrowse      : false,
 206  _oneDayInMs            : 24 * 3600 * 1000,
 207  /* positionning */
 208  _topOffset             : 30,
 209  _leftOffset            : 0,
 210  _isPositionned         : false,
 211  _relativePosition      : true,
 212  _setPositionTop        : 0,
 213  _setPositionLeft       : 0,
 214  _bodyAppend            : false,
 215  _contentAppend         : '',
 216  _showEvent             : 'click',
 217  /* Effects Adjustment */
 218  _showEffect            : "appear",
 219  _showDuration          : 1,
 220  _enableShowEffect      : true,
 221  _closeEffect           : "fade",
 222  _closeEffectDuration   : 0.3,
 223  _enableCloseEffect     : true,
 224  _closeTimer            : null,
 225  _enableCloseOnBlur     : false,
 226  /* afterClose : called when the close function is executed */
 227  _afterClose    : Prototype.emptyFunction,
 228  /* return the name of current month in appropriate language */
 229  getMonthLocale : function ( month ) {
 230   return        this._language_month.get(this._language)[month];
 231  },
 232  getLocaleClose : function () {
 233   return        this._language_close.get(this._language);
 234  },
 235  _initCurrentDate : function () {
 236   /* Create the DateFormatter */
 237   this._df = new DatePickerFormatter(this._dateFormat[0], this._dateFormat[1]);
 238   /* check if value in field is proper, if not set to today */
 239   this._current_date = $F(this._relative);
 240   if (! this._df.match(this._current_date)) {
 241     this._current_date = this._df.current_date();
 242    /* set the field value ? */
 243    if (!this._keepFieldEmpty)
 244     $(this._relative).value = this._current_date;
 245   }
 246   var a_date = this._df.match(this._current_date);
 247   this._current_year    = Number(a_date[0]);
 248   this._current_mon     = Number(a_date[1]) - 1;
 249   this._current_day     = Number(a_date[2]);
 250  },
 251  /* init */
 252  initialize     : function ( h_p ) {
 253   /* arguments */
 254   this._relative= h_p["relative"];
 255   if (h_p["language"])
 256    this._language = h_p["language"];
 257   this._zindex  = ( h_p["zindex"] ) ? parseInt(Number(h_p["zindex"])) : 1;
 258   if (!Object.isUndefined(h_p["keepFieldEmpty"]))
 259    this._keepFieldEmpty = h_p["keepFieldEmpty"];
 260   if (Object.isFunction(h_p["clickCallback"]))
 261    this._clickCallback  = h_p["clickCallback"];
 262   if (!Object.isUndefined(h_p["leftOffset"]))
 263    this._leftOffset     = parseInt(h_p["leftOffset"]);
 264   if (!Object.isUndefined(h_p["topOffset"]))
 265    this._topOffset      = parseInt(h_p["topOffset"]);
 266   if (!Object.isUndefined(h_p["relativePosition"]))
 267    this._relativePosition = h_p["relativePosition"];
 268   if (!Object.isUndefined(h_p["showEvent"]))
 269    this._showEvent      = h_p["showEvent"];
 270   if (!Object.isUndefined(h_p["showEffect"]))
 271    this._showEffect     = h_p["showEffect"];
 272   if (!Object.isUndefined(h_p["contentAppend"]))
 273    this._contentAppend  = h_p["contentAppend"];
 274   if (!Object.isUndefined(h_p["enableShowEffect"]))
 275    this._enableShowEffect       = h_p["enableShowEffect"];
 276   if (!Object.isUndefined(h_p["showDuration"]))
 277    this._showDuration   = h_p["showDuration"];
 278   if (!Object.isUndefined(h_p["closeEffect"]))
 279    this._closeEffect    = h_p["closeEffect"];
 280   if (!Object.isUndefined(h_p["enableCloseEffect"]))
 281    this._enableCloseEffect      = h_p["enableCloseEffect"];
 282   if (!Object.isUndefined(h_p["closeEffectDuration"]))
 283    this._closeEffectDuration = h_p["closeEffectDuration"];
 284   if (Object.isFunction(h_p["afterClose"]))
 285    this._afterClose     = h_p["afterClose"];
 286   if (!Object.isUndefined(h_p["externalControl"]))
 287    this._externalControl= h_p["externalControl"];
 288   if (!Object.isUndefined(h_p["dateFormat"]))
 289    this._dateFormat     = h_p["dateFormat"];
 290   if (Object.isFunction(h_p["cellCallback"]))
 291    this._cellCallback   = h_p["cellCallback"];
 292   this._setPositionTop  = ( h_p["setPositionTop"] ) ?
 293    parseInt(Number(h_p["setPositionTop"])) : 0;
 294   this._setPositionLeft = ( h_p["setPositionLeft"] ) ?
 295    parseInt(Number(h_p["setPositionLeft"])) : 0;
 296   if (!Object.isUndefined(h_p["enableCloseOnBlur"]) && h_p["enableCloseOnBlur"])
 297    this._enableCloseOnBlur      = true;
 298   if (!Object.isUndefined(h_p["disablePastDate"]) && h_p["disablePastDate"])
 299    this._disablePastDate        = true;
 300   if (!Object.isUndefined(h_p["disableFutureDate"]) &&
 301    !h_p["disableFutureDate"])
 302    this._disableFutureDate      = false;
 303   if (!Object.isUndefined(h_p["enableYearBrowse"]))
 304    this._enableYearBrowse       = true;
 305   this._id_datepicker           = 'datepicker-'+this._relative;
 306   this._id_datepicker_prev      = this._id_datepicker+'-prev';
 307   this._id_datepicker_next      = this._id_datepicker+'-next';
 308   this._id_datepicker_prev_year = this._id_datepicker_prev+'-year';
 309   this._id_datepicker_next_year = this._id_datepicker_next+'-year';
 310   this._id_datepicker_hdr       = this._id_datepicker+'-header';
 311   this._id_datepicker_ftr       = this._id_datepicker+'-footer';
 312
 313   /* build up calendar skel */
 314   this._div = new Element('div', {
 315    id : this._id_datepicker,
 316    className : 'datepicker',
 317    style : 'display: none; z-index:'+this._zindex });
 318   this._div.innerHTML = '<table><thead><tr>'+((this._enableYearBrowse) ? '<th width="10px" id="'+this._id_datepicker_prev_year+'" style="cursor: pointer;">&nbsp;&lt;&nbsp;</th>' : '')+'<th width="10px" id="'+this._id_datepicker_prev+'" style="cursor: pointer;">&nbsp;&lt;&lt;&nbsp;</th><th id="'+this._id_datepicker_hdr+'" colspan="'+((this._enableYearBrowse) ? 3 : 5 )+'"></th><th width="10px" id="'+this._id_datepicker_next+'" style="cursor: pointer;">&nbsp;&gt;&gt;&nbsp;</th>'+((this._enableYearBrowse) ? '<th width="10px" id="'+this._id_datepicker_next_year+'" style="cursor: pointer;">&nbsp;&gt;&nbsp;</th>' : '')+'</tr></thead><tbody id="'+this._id_datepicker+'-tbody"></tbody><tfoot><td colspan="7" id="'+this._id_datepicker_ftr+'"></td></tfoot></table>';
 319   /* finally declare the event listener on input field */
 320   Event.observe(this._relative,
 321     this._showEvent, this.click.bindAsEventListener(this), false);
 322   /* need to append on body when doc is loaded for IE */
 323   document.observe('dom:loaded', this.load.bindAsEventListener(this), false);
 324   /* automatically close when blur event is triggered */
 325   if ( this._enableCloseOnBlur ) {
 326    Event.observe(this._relative, 'blur', function (e) {
 327     this._closeTimer = this.close.bind(this).delay(2);
 328    }.bindAsEventListener(this));
 329    Event.observe(this._div, 'click', function (e) {
 330     if (this._closeTimer) {
 331      window.clearTimeout(this._closeTimer);
 332      this._closeTimer = null;
 333     }
 334    });
 335   }
 336  },
 337  /**
 338   * load        : called when document is fully-loaded to append datepicker
 339   *               to main object.
 340   */
 341  load           : function () {
 342   /* if externalControl defined set the observer on it */
 343   if (this._externalControl)
 344    Event.observe(this._externalControl, 'click',
 345     this.click.bindAsEventListener(this), false);
 346   /* append to page */
 347   if (this._relativeAppend) {
 348    /* append to parent node */
 349    if ($(this._relative).parentNode) {
 350     this._div.innerHTML = this._wrap_in_iframe(this._div.innerHTML);
 351     $(this._relative).parentNode.appendChild( this._div );
 352    }
 353   } else {
 354    /* append to body tag or to provided contentAppend id */
 355    var body     = ( this._contentAppend ) ?
 356     $(this._contentAppend) : document.getElementsByTagName("body").item(0);
 357    if (body) {
 358     this._div.innerHTML = this._wrap_in_iframe(this._div.innerHTML);
 359     body.appendChild(this._div);
 360    }
 361    if ( this._relativePosition ) {
 362      var a_pos = Element.cumulativeOffset($(this._relative));
 363      this.setPosition(a_pos[1], a_pos[0]);
 364    } else {
 365     if (this._setPositionTop || this._setPositionLeft)
 366      this.setPosition(this._setPositionTop, this._setPositionLeft);
 367    }
 368   }
 369   /* init the date in field if needed */
 370   this._initCurrentDate();
 371   /* set the close locale content */
 372   $(this._id_datepicker_ftr).innerHTML = this.getLocaleClose();
 373   /* declare the observers for UI control */
 374   Event.observe($(this._id_datepicker_prev),
 375     'click', this.prevMonth.bindAsEventListener(this), false);
 376   Event.observe($(this._id_datepicker_next),
 377     'click', this.nextMonth.bindAsEventListener(this), false);
 378   if ( this._enableYearBrowse ) {
 379    Event.observe($(this._id_datepicker_prev_year),
 380      'click', this.prevYear.bindAsEventListener(this), false);
 381    Event.observe($(this._id_datepicker_next_year),
 382      'click', this.nextYear.bindAsEventListener(this), false);
 383   }
 384   Event.observe($(this._id_datepicker_ftr),
 385     'click', this.close.bindAsEventListener(this), false);
 386  },
 387  /* hack for buggy form elements layering in IE */
 388  _wrap_in_iframe        : function ( content ) {
 389   var _iframe_src       = 'javascript:false';
 390   return        ( Prototype.Browser.IE ) ?
 391    "<div style='height:167px;width:185px;background-color:white;align:left'><iframe width='100%' height='100%' marginwidth='0' marginheight='0' frameborder='0' src='"+ _iframe_src +"' style='filter:alpha(Opacity=50);'></iframe><div style='position:absolute;background-color:white;top:2px;left:2px;width:180px'>" + content + "</div></div>" : content;
 392  },
 393  /**
 394   * visible     : return the visibility status of the datepicker.
 395   */
 396  visible        : function () {
 397   return        ( $(this._id_datepicker) ) ?
 398    $(this._id_datepicker).visible() : false;
 399  },
 400  /**
 401   * click       : called when input element is clicked
 402   */
 403  click          : function () {
 404   /* init the datepicker if it doesn't exists */
 405   if ( $(this._id_datepicker) == null ) this.load();
 406   if (!this._isPositionned && this._relativePosition) {
 407    /* position the datepicker relatively to element */
 408    var a_lt = Element.positionedOffset($(this._relative));
 409    $(this._id_datepicker).setStyle({
 410     'left'      : Number(a_lt[0]+this._leftOffset)+'px',
 411     'top'       : Number(a_lt[1]+this._topOffset)+'px'
 412    });
 413    this._isPositionned  = true;
 414   }
 415   if (!this.visible()) {
 416    this._initCurrentDate();
 417    this._redrawCalendar();
 418   }
 419   /* eval the clickCallback function */
 420   eval(this._clickCallback());
 421   /* Effect toggle to fade-in / fade-out the datepicker */
 422   if ( this._enableShowEffect ) {
 423    new Effect.toggle(this._id_datepicker,
 424      this._showEffect, { duration: this._showDuration });
 425   } else {
 426    $(this._id_datepicker).show();
 427   }
 428   /* clean timer */
 429   if (this._closeTimer) {
 430    window.clearTimeout(this._closeTimer);
 431    this._closeTimer = null;
 432   }
 433  },
 434  /**
 435   * close       : called when the datepicker is closed
 436   */
 437  close          : function () {
 438   if ( this._enableCloseEffect ) {
 439    switch(this._closeEffect) {
 440     case 'puff':
 441      new Effect.Puff(this._id_datepicker, {
 442       duration : this._closeEffectDuration });
 443      break;
 444     case 'blindUp':
 445      new Effect.BlindUp(this._id_datepicker, {
 446       duration : this._closeEffectDuration });
 447      break;
 448     case 'dropOut':
 449      new Effect.DropOut(this._id_datepicker, {
 450       duration : this._closeEffectDuration });
 451      break;
 452     case 'switchOff':
 453      new Effect.SwitchOff(this._id_datepicker, {
 454       duration : this._closeEffectDuration });
 455      break;
 456     case 'squish':
 457      new Effect.Squish(this._id_datepicker, {
 458       duration : this._closeEffectDuration });
 459      break;
 460     case 'fold':
 461      new Effect.Fold(this._id_datepicker, {
 462       duration : this._closeEffectDuration });
 463      break;
 464     case 'shrink':
 465      new Effect.Shrink(this._id_datepicker, {
 466       duration : this._closeEffectDuration });
 467      break;
 468     default:
 469      new Effect.Fade(this._id_datepicker, {
 470       duration : this._closeEffectDuration });
 471      break;
 472    };
 473   } else {
 474    $(this._id_datepicker).hide();
 475   }
 476   eval(this._afterClose());
 477  },
 478  /**
 479   * setDateFormat
 480   */
 481  setDateFormat  : function ( format, separator ) {
 482   if (Object.isUndefined(format))
 483    format       = this._dateFormat[0];
 484   if (Object.isUndefined(separator))
 485    separator    = this._dateFormat[1];
 486   this._dateFormat      = [ format, separator ];
 487  },
 488  /**
 489   * setPosition : set the position of the datepicker.
 490   *  param : t=top | l=left
 491   */
 492  setPosition    : function ( t, l ) {
 493   var h_pos     = { 'top' : '0px', 'left' : '0px' };
 494   if (!Object.isUndefined(t))
 495    h_pos['top'] = Number(t)+this._topOffset+'px';
 496   if (!Object.isUndefined(l))
 497    h_pos['left']= Number(l)+this._leftOffset+'px';
 498   $(this._id_datepicker).setStyle(h_pos);
 499   this._isPositionned   = true;
 500  },
 501  /**
 502   * _getMonthDays : given the year and month find the number of days.
 503   */
 504  _getMonthDays  : function ( year, month ) {
 505   if (((0 == (year%4)) &&
 506    ( (0 != (year%100)) || (0 == (year%400)))) && (month == 1))
 507    return 29;
 508   return this._daysInMonth[month];
 509  },
 510  /**
 511   * _buildCalendar      : draw the days array for current date
 512   */
 513  _buildCalendar         : function () {
 514   var _self     = this;
 515   var tbody     = $(this._id_datepicker+'-tbody');
 516   try {
 517    while ( tbody.hasChildNodes() )
 518     tbody.removeChild(tbody.childNodes[0]);
 519   } catch ( e ) {};
 520   /* generate day headers */
 521   var trDay     = new Element('tr');
 522   this._language_day.get(this._language).each( function ( item ) {
 523    var td       = new Element('td');
 524    td.innerHTML = item;
 525    td.className = 'wday';
 526    trDay.appendChild( td );
 527   });
 528   tbody.appendChild( trDay );
 529   /* generate the content of days */
 530
 531   /* build-up days matrix */
 532   var a_d       = [ [ 0, 0, 0, 0, 0, 0, 0 ] ,[ 0, 0, 0, 0, 0, 0, 0 ]
 533    ,[ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ], [ 0, 0, 0, 0, 0, 0, 0 ]
 534    ,[ 0, 0, 0, 0, 0, 0, 0 ]
 535   ];
 536   /* set date at beginning of month to display */
 537   var d         = new Date(this._current_year, this._current_mon, 1, 12);
 538   /* start the day list on monday */
 539   var startIndex        = ( !d.getDay() ) ? 6 : d.getDay() - 1;
 540   var nbDaysInMonth     = this._getMonthDays(
 541     this._current_year, this._current_mon);
 542   var daysIndex         = 1;
 543   for ( var j = startIndex; j < 7; j++ ) {
 544    a_d[0][j]    = {
 545      d : daysIndex
 546     ,m : this._current_mon
 547     ,y : this._current_year
 548    };
 549    daysIndex++;
 550   }
 551   var a_prevMY  = this._prevMonthYear();
 552   var nbDaysInMonthPrev = this._getMonthDays(a_prevMY[1], a_prevMY[0]);
 553   for ( var j = 0; j < startIndex; j++ ) {
 554    a_d[0][j]    = {
 555      d : Number(nbDaysInMonthPrev - startIndex + j + 1)
 556     ,m : Number(a_prevMY[0])
 557     ,y : a_prevMY[1]
 558     ,c : 'outbound'
 559    };
 560   }
 561   var switchNextMonth   = false;
 562   var currentMonth      = this._current_mon;
 563   var currentYear       = this._current_year;
 564   for ( var i = 1; i < 6; i++ ) {
 565    for ( var j = 0; j < 7; j++ ) {
 566     a_d[i][j]   = {
 567       d : daysIndex
 568      ,m : currentMonth
 569      ,y : currentYear
 570      ,c : ( switchNextMonth ) ? 'outbound' : (
 571       ((daysIndex == this._todayDate.getDate()) &&
 572         (this._current_mon  == this._todayDate.getMonth()) &&
 573         (this._current_year == this._todayDate.getFullYear())) ? 'today' : null)
 574     };
 575     daysIndex++;
 576     /* if at the end of the month : reset counter */
 577     if (daysIndex > nbDaysInMonth ) {
 578      daysIndex  = 1;
 579      switchNextMonth = true;
 580      if (this._current_mon + 1 > 11 ) {
 581       currentMonth = 0;
 582       currentYear += 1;
 583      } else {
 584       currentMonth += 1;
 585      }
 586     }
 587    }
 588   }
 589   /* generate days for current date */
 590   for ( var i = 0; i < 6; i++ ) {
 591    var tr       = new Element('tr');
 592    for ( var j = 0; j < 7; j++ ) {
 593     var h_ij    = a_d[i][j];
 594     var td      = new Element('td');
 595     /* id is : datepicker-day-mon-year or depending on language other way */
 596     /* don't forget to add 1 on month for proper formmatting */
 597     var id      = $A([
 598      this._relative,
 599      this._df.date_to_string(h_ij["y"], h_ij["m"]+1, h_ij["d"], '-')
 600     ]).join('-');
 601     /* set id and classname for cell if exists */
 602     td.setAttribute('id', id);
 603     if (h_ij["c"])
 604      td.className       = h_ij["c"];
 605     /* on onclick : rebuild date value from id of current cell */
 606     var _curDate        = new Date();
 607     _curDate.setFullYear(h_ij["y"], h_ij["m"], h_ij["d"]);
 608     if ( this._disablePastDate || this._disableFutureDate ) {
 609      if ( this._disablePastDate ) {
 610       var _res  = ( _curDate >= this._todayDate ) ? true : false;
 611       this._bindCellOnClick( td, true, _res, h_ij["c"] );
 612      }
 613      if ( this._disableFutureDate ) {
 614       var _res  = ( this._todayDate.getTime() + this._oneDayInMs > _curDate.getTime() ) ? true : false;
 615       this._bindCellOnClick( td, true, _res,  h_ij["c"] );
 616      }
 617     } else {
 618      this._bindCellOnClick( td, false );
 619     }
 620     td.innerHTML= h_ij["d"];
 621     tr.appendChild( td );
 622    }
 623    tbody.appendChild( tr );
 624   }
 625   return        tbody;
 626  },
 627  /**
 628   * _bindCellOnClick    : bind the cell onclick depending on status.
 629   */
 630  _bindCellOnClick       : function ( td, wcompare, compareresult, h_ij_c ) {
 631   var doBind    = false;
 632   if ( wcompare ) {
 633    if ( compareresult ) {
 634     doBind      = true;
 635    } else {
 636     td.className= ( h_ij_c ) ? 'nclick_outbound' : 'nclick';
 637    }
 638   } else {
 639    doBind       = true;
 640   }
 641   if ( doBind ) {
 642    var _self    = this;
 643    td.onclick   = function () {
 644     $(_self._relative).value = String($(this).readAttribute('id')
 645       ).replace(_self._relative+'-','').replace(/-/g, _self._df.separator);
 646     /* if we have a cellCallback defined call it and pass it the cell */
 647     if (_self._cellCallback)
 648      _self._cellCallback(this);
 649     _self.close();
 650    };
 651   }
 652  },
 653  /**
 654   * nextMonth   : redraw the calendar content for next month.
 655   */
 656  _nextMonthYear : function () {
 657   var c_mon     = this._current_mon;
 658   var c_year    = this._current_year;
 659   if (c_mon + 1 > 11) {
 660    c_mon        = 0;
 661    c_year       += 1;
 662   } else {
 663    c_mon        += 1;
 664   }
 665   return        [ c_mon, c_year ];
 666  },
 667  nextMonth      : function () {
 668   var a_next    = this._nextMonthYear();
 669   var _nextMon  = a_next[0];
 670   var _nextYear = a_next[1];
 671   var _curDate  = new Date(); _curDate.setFullYear(_nextYear, _nextMon, 1);
 672   var _res      = ( this._todayDate.getTime() + this._oneDayInMs > _curDate.getTime() ) ? true : false;
 673   if ( this._disableFutureDate && !_res )
 674    return;
 675   this._current_mon     = _nextMon;
 676   this._current_year    = _nextYear;
 677   this._redrawCalendar();
 678  },
 679  /**
 680   * prevMonth   : redraw the calendar content for previous month.
 681   */
 682  _prevMonthYear : function () {
 683   var c_mon     = this._current_mon;
 684   var c_year    = this._current_year;
 685   if (c_mon - 1 < 0) {
 686    c_mon        = 11;
 687    c_year       -= 1;
 688   } else {
 689    c_mon        -= 1;
 690   }
 691   return        [ c_mon, c_year ];
 692  },
 693  prevMonth      : function () {
 694   var a_prev    = this._prevMonthYear();
 695   var _prevMon  = a_prev[0];
 696   var _prevYear = a_prev[1];
 697   var _curDate  = new Date(); _curDate.setFullYear(_prevYear, _prevMon, 1);
 698   var _res      = ( _curDate >= this._todayDate ) ? true : false;
 699   if ( this._disablePastDate && !_res && (_prevMon!=this._todayDate.getMonth()))
 700    return;
 701   this._current_mon     = _prevMon;
 702   this._current_year    = _prevYear;
 703   this._redrawCalendar();
 704  },
 705  /**
 706   * prevYear    : redraw the calendar content for prev year.
 707   */
 708  _prevYear      : function () {
 709   var c_mon     = this._current_mon;
 710   var c_year    = (this._current_year - 1);
 711
 712   return        [ c_mon, c_year ];
 713  },
 714  prevYear       : function () {
 715   var a_next    = this._prevYear();
 716   var _nextMon  = a_next[0];
 717   var _nextYear = a_next[1];
 718   var _curDate  = new Date(); _curDate.setFullYear(_nextYear, _nextMon, 1);
 719   var _res      = ( this._todayDate.getTime() + this._oneDayInMs > _curDate.getTime() ) ? true : false;
 720   if ( this._disableFutureDate && !_res )
 721    return;
 722   this._current_mon     = _nextMon;
 723   this._current_year    = _nextYear;
 724   this._redrawCalendar();
 725  },
 726
 727  /**
 728   * nextYear    : redraw the calendar content for next year.
 729   */
 730  _nextYear      : function () {
 731   var c_mon     = this._current_mon;
 732   var c_year    = (this._current_year + 1);
 733
 734   return        [ c_mon, c_year ];
 735  },
 736  nextYear       : function () {
 737   var a_next    = this._nextYear();
 738   var _nextMon  = a_next[0];
 739   var _nextYear = a_next[1];
 740   var _curDate  = new Date(); _curDate.setFullYear(_nextYear, _nextMon, 1);
 741   var _res      = ( this._todayDate.getTime() + this._oneDayInMs > _curDate.getTime() ) ? true : false;
 742   if ( this._disableFutureDate && !_res )
 743    return;
 744   this._current_mon     = _nextMon;
 745   this._current_year    = _nextYear;
 746   this._redrawCalendar();
 747  },
 748
 749  _redrawCalendar        : function () {
 750   this._setLocaleHdr(); this._buildCalendar();
 751  },
 752  _setLocaleHdr  : function () {
 753   /* next link */
 754   var a_next    = this._nextMonthYear();
 755   $(this._id_datepicker_next).setAttribute('title',
 756    this.getMonthLocale(a_next[0])+' '+a_next[1]);
 757   /* prev link */
 758   var a_prev    = this._prevMonthYear();
 759   $(this._id_datepicker_prev).setAttribute('title',
 760    this.getMonthLocale(a_prev[0])+' '+a_prev[1]);
 761   /* year browse */
 762   if ( this._enableYearBrowse ) {
 763    var a_next_y = this._nextYear();
 764    $(this._id_datepicker_next_year).setAttribute('title',
 765      this.getMonthLocale(a_next_y[0])+' '+a_next_y[1]);
 766    var a_prev_y = this._prevYear();
 767    $(this._id_datepicker_prev_year).setAttribute('title',
 768      this.getMonthLocale(a_prev_y[0])+' '+a_prev_y[1]);
 769   }
 770   /* header */
 771   $(this._id_datepicker_hdr).update('&nbsp;&nbsp;&nbsp;'+this.getMonthLocale(this._current_mon)+'&nbsp;'+this._current_year+'&nbsp;&nbsp;&nbsp;');
 772  }
 773 };