~cdparra/gelee/trunk

« back to all changes in this revision

Viewing changes to webui/extjs/source/widgets/DatePicker.js

  • Committer: parra
  • Date: 2010-03-15 15:56:56 UTC
  • Revision ID: svn-v4:ac5bba68-f036-4e09-846e-8f32731cc928:trunk/gelee:1448
merged gelee at svn

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/*
 
2
 * Ext JS Library 3.0 RC2
 
3
 * Copyright(c) 2006-2009, Ext JS, LLC.
 
4
 * licensing@extjs.com
 
5
 * 
 
6
 * http://extjs.com/license
 
7
 */
 
8
 
 
9
/**
 
10
 * @class Ext.DatePicker
 
11
 * @extends Ext.Component
 
12
 * Simple date picker class.
 
13
 * @constructor
 
14
 * Create a new DatePicker
 
15
 * @param {Object} config The config object
 
16
 * @xtype datepicker
 
17
 */
 
18
Ext.DatePicker = Ext.extend(Ext.BoxComponent, {
 
19
    /**
 
20
     * @cfg {String} todayText
 
21
     * The text to display on the button that selects the current date (defaults to "Today")
 
22
     */
 
23
    todayText : "Today",
 
24
    /**
 
25
     * @cfg {String} okText
 
26
     * The text to display on the ok button
 
27
     */
 
28
    okText : " OK ", //   to give the user extra clicking room
 
29
    /**
 
30
     * @cfg {String} cancelText
 
31
     * The text to display on the cancel button
 
32
     */
 
33
    cancelText : "Cancel",
 
34
    /**
 
35
     * @cfg {String} todayTip
 
36
     * The tooltip to display for the button that selects the current date (defaults to "{current date} (Spacebar)")
 
37
     */
 
38
    todayTip : "{0} (Spacebar)",
 
39
    /**
 
40
     * @cfg {String} minText
 
41
     * The error text to display if the minDate validation fails (defaults to "This date is before the minimum date")
 
42
     */
 
43
    minText : "This date is before the minimum date",
 
44
    /**
 
45
     * @cfg {String} maxText
 
46
     * The error text to display if the maxDate validation fails (defaults to "This date is after the maximum date")
 
47
     */
 
48
    maxText : "This date is after the maximum date",
 
49
    /**
 
50
     * @cfg {String} format
 
51
     * The default date format string which can be overriden for localization support.  The format must be
 
52
     * valid according to {@link Date#parseDate} (defaults to 'm/d/y').
 
53
     */
 
54
    format : "m/d/y",
 
55
    /**
 
56
     * @cfg {String} disabledDaysText
 
57
     * The tooltip to display when the date falls on a disabled day (defaults to "Disabled")
 
58
     */
 
59
    disabledDaysText : "Disabled",
 
60
    /**
 
61
     * @cfg {String} disabledDatesText
 
62
     * The tooltip text to display when the date falls on a disabled date (defaults to "Disabled")
 
63
     */
 
64
    disabledDatesText : "Disabled",
 
65
    /**
 
66
     * @cfg {Array} monthNames
 
67
     * An array of textual month names which can be overriden for localization support (defaults to Date.monthNames)
 
68
     */
 
69
    monthNames : Date.monthNames,
 
70
    /**
 
71
     * @cfg {Array} dayNames
 
72
     * An array of textual day names which can be overriden for localization support (defaults to Date.dayNames)
 
73
     */
 
74
    dayNames : Date.dayNames,
 
75
    /**
 
76
     * @cfg {String} nextText
 
77
     * The next month navigation button tooltip (defaults to 'Next Month (Control+Right)')
 
78
     */
 
79
    nextText: 'Next Month (Control+Right)',
 
80
    /**
 
81
     * @cfg {String} prevText
 
82
     * The previous month navigation button tooltip (defaults to 'Previous Month (Control+Left)')
 
83
     */
 
84
    prevText: 'Previous Month (Control+Left)',
 
85
    /**
 
86
     * @cfg {String} monthYearText
 
87
     * The header month selector tooltip (defaults to 'Choose a month (Control+Up/Down to move years)')
 
88
     */
 
89
    monthYearText: 'Choose a month (Control+Up/Down to move years)',
 
90
    /**
 
91
     * @cfg {Number} startDay
 
92
     * Day index at which the week should begin, 0-based (defaults to 0, which is Sunday)
 
93
     */
 
94
    startDay : 0,
 
95
    /**
 
96
     * @cfg {Boolean} showToday
 
97
     * False to hide the footer area containing the Today button and disable the keyboard handler for spacebar
 
98
     * that selects the current date (defaults to true).
 
99
     */
 
100
    showToday : true,
 
101
    /**
 
102
     * @cfg {Date} minDate
 
103
     * Minimum allowable date (JavaScript date object, defaults to null)
 
104
     */
 
105
    /**
 
106
     * @cfg {Date} maxDate
 
107
     * Maximum allowable date (JavaScript date object, defaults to null)
 
108
     */
 
109
    /**
 
110
     * @cfg {Array} disabledDays
 
111
     * An array of days to disable, 0-based. For example, [0, 6] disables Sunday and Saturday (defaults to null).
 
112
     */
 
113
    /**
 
114
     * @cfg {RegExp} disabledDatesRE
 
115
     * JavaScript regular expression used to disable a pattern of dates (defaults to null).  The {@link #disabledDates}
 
116
     * config will generate this regex internally, but if you specify disabledDatesRE it will take precedence over the 
 
117
     * disabledDates value.
 
118
     */
 
119
    /**
 
120
     * @cfg {Array} disabledDates
 
121
     * An array of "dates" to disable, as strings. These strings will be used to build a dynamic regular
 
122
     * expression so they are very powerful. Some examples:
 
123
     * <ul>
 
124
     * <li>["03/08/2003", "09/16/2003"] would disable those exact dates</li>
 
125
     * <li>["03/08", "09/16"] would disable those days for every year</li>
 
126
     * <li>["^03/08"] would only match the beginning (useful if you are using short years)</li>
 
127
     * <li>["03/../2006"] would disable every day in March 2006</li>
 
128
     * <li>["^03"] would disable every day in every March</li>
 
129
     * </ul>
 
130
     * Note that the format of the dates included in the array should exactly match the {@link #format} config.
 
131
     * In order to support regular expressions, if you are using a date format that has "." in it, you will have to
 
132
     * escape the dot when restricting dates. For example: ["03\\.08\\.03"].
 
133
     */
 
134
 
 
135
    // private
 
136
    initComponent : function(){
 
137
        Ext.DatePicker.superclass.initComponent.call(this);
 
138
 
 
139
        this.value = this.value ?
 
140
                 this.value.clearTime() : new Date().clearTime();
 
141
 
 
142
        this.addEvents(
 
143
            /**
 
144
             * @event select
 
145
             * Fires when a date is selected
 
146
             * @param {DatePicker} this
 
147
             * @param {Date} date The selected date
 
148
             */
 
149
            'select'
 
150
        );
 
151
 
 
152
        if(this.handler){
 
153
            this.on("select", this.handler,  this.scope || this);
 
154
        }
 
155
 
 
156
        this.initDisabledDays();
 
157
    },
 
158
 
 
159
    // private
 
160
    initDisabledDays : function(){
 
161
        if(!this.disabledDatesRE && this.disabledDates){
 
162
            var dd = this.disabledDates;
 
163
            var re = "(?:";
 
164
            for(var i = 0; i < dd.length; i++){
 
165
                re += dd[i];
 
166
                if(i != dd.length-1) re += "|";
 
167
            }
 
168
            this.disabledDatesRE = new RegExp(re + ")");
 
169
        }
 
170
    },
 
171
    
 
172
    /**
 
173
     * Replaces any existing disabled dates with new values and refreshes the DatePicker.
 
174
     * @param {Array/RegExp} disabledDates An array of date strings (see the {@link #disabledDates} config
 
175
     * for details on supported values), or a JavaScript regular expression used to disable a pattern of dates.
 
176
     */
 
177
    setDisabledDates : function(dd){
 
178
        if(Ext.isArray(dd)){
 
179
            this.disabledDates = dd;
 
180
            this.disabledDatesRE = null;
 
181
        }else{
 
182
            this.disabledDatesRE = dd;
 
183
        }
 
184
        this.initDisabledDays();
 
185
        this.update(this.value, true);
 
186
    },
 
187
    
 
188
    /**
 
189
     * Replaces any existing disabled days (by index, 0-6) with new values and refreshes the DatePicker.
 
190
     * @param {Array} disabledDays An array of disabled day indexes. See the {@link #disabledDays} config
 
191
     * for details on supported values.
 
192
     */
 
193
    setDisabledDays : function(dd){
 
194
        this.disabledDays = dd;
 
195
        this.update(this.value, true);
 
196
    },
 
197
    
 
198
    /**
 
199
     * Replaces any existing {@link #minDate} with the new value and refreshes the DatePicker.
 
200
     * @param {Date} value The minimum date that can be selected
 
201
     */
 
202
    setMinDate : function(dt){
 
203
        this.minDate = dt;
 
204
        this.update(this.value, true);
 
205
    },
 
206
    
 
207
    /**
 
208
     * Replaces any existing {@link #maxDate} with the new value and refreshes the DatePicker.
 
209
     * @param {Date} value The maximum date that can be selected
 
210
     */
 
211
    setMaxDate : function(dt){
 
212
        this.maxDate = dt;
 
213
        this.update(this.value, true);
 
214
    },
 
215
 
 
216
    /**
 
217
     * Sets the value of the date field
 
218
     * @param {Date} value The date to set
 
219
     */
 
220
    setValue : function(value){
 
221
        var old = this.value;
 
222
        this.value = value.clearTime(true);
 
223
        if(this.el){
 
224
            this.update(this.value);
 
225
        }
 
226
    },
 
227
 
 
228
    /**
 
229
     * Gets the current selected value of the date field
 
230
     * @return {Date} The selected date
 
231
     */
 
232
    getValue : function(){
 
233
        return this.value;
 
234
    },
 
235
 
 
236
    // private
 
237
    focus : function(){
 
238
        if(this.el){
 
239
            this.update(this.activeDate);
 
240
        }
 
241
    },
 
242
 
 
243
    // private
 
244
    onRender : function(container, position){
 
245
        var m = [
 
246
             '<table cellspacing="0">',
 
247
                '<tr><td class="x-date-left"><a href="#" title="', this.prevText ,'">&#160;</a></td><td class="x-date-middle" align="center"></td><td class="x-date-right"><a href="#" title="', this.nextText ,'">&#160;</a></td></tr>',
 
248
                '<tr><td colspan="3"><table class="x-date-inner" cellspacing="0"><thead><tr>'];
 
249
        var dn = this.dayNames;
 
250
        for(var i = 0; i < 7; i++){
 
251
            var d = this.startDay+i;
 
252
            if(d > 6){
 
253
                d = d-7;
 
254
            }
 
255
            m.push("<th><span>", dn[d].substr(0,1), "</span></th>");
 
256
        }
 
257
        m[m.length] = "</tr></thead><tbody><tr>";
 
258
        for(var i = 0; i < 42; i++) {
 
259
            if(i % 7 == 0 && i != 0){
 
260
                m[m.length] = "</tr><tr>";
 
261
            }
 
262
            m[m.length] = '<td><a href="#" hidefocus="on" class="x-date-date" tabIndex="1"><em><span></span></em></a></td>';
 
263
        }
 
264
        m.push('</tr></tbody></table></td></tr>', 
 
265
                this.showToday ? '<tr><td colspan="3" class="x-date-bottom" align="center"></td></tr>' : '', 
 
266
                '</table><div class="x-date-mp"></div>');
 
267
 
 
268
        var el = document.createElement("div");
 
269
        el.className = "x-date-picker";
 
270
        el.innerHTML = m.join("");
 
271
 
 
272
        container.dom.insertBefore(el, position);
 
273
 
 
274
        this.el = Ext.get(el);
 
275
        this.eventEl = Ext.get(el.firstChild);
 
276
 
 
277
        new Ext.util.ClickRepeater(this.el.child("td.x-date-left a"), {
 
278
            handler: this.showPrevMonth,
 
279
            scope: this,
 
280
            preventDefault:true,
 
281
            stopDefault:true
 
282
        });
 
283
 
 
284
        new Ext.util.ClickRepeater(this.el.child("td.x-date-right a"), {
 
285
            handler: this.showNextMonth,
 
286
            scope: this,
 
287
            preventDefault:true,
 
288
            stopDefault:true
 
289
        });
 
290
 
 
291
        this.mon(this.eventEl, "mousewheel", this.handleMouseWheel, this);
 
292
 
 
293
        this.monthPicker = this.el.down('div.x-date-mp');
 
294
        this.monthPicker.enableDisplayMode('block');
 
295
        
 
296
        var kn = new Ext.KeyNav(this.eventEl, {
 
297
            "left" : function(e){
 
298
                e.ctrlKey ?
 
299
                    this.showPrevMonth() :
 
300
                    this.update(this.activeDate.add("d", -1));
 
301
            },
 
302
 
 
303
            "right" : function(e){
 
304
                e.ctrlKey ?
 
305
                    this.showNextMonth() :
 
306
                    this.update(this.activeDate.add("d", 1));
 
307
            },
 
308
 
 
309
            "up" : function(e){
 
310
                e.ctrlKey ?
 
311
                    this.showNextYear() :
 
312
                    this.update(this.activeDate.add("d", -7));
 
313
            },
 
314
 
 
315
            "down" : function(e){
 
316
                e.ctrlKey ?
 
317
                    this.showPrevYear() :
 
318
                    this.update(this.activeDate.add("d", 7));
 
319
            },
 
320
 
 
321
            "pageUp" : function(e){
 
322
                this.showNextMonth();
 
323
            },
 
324
 
 
325
            "pageDown" : function(e){
 
326
                this.showPrevMonth();
 
327
            },
 
328
 
 
329
            "enter" : function(e){
 
330
                e.stopPropagation();
 
331
                return true;
 
332
            },
 
333
 
 
334
            scope : this
 
335
        });
 
336
 
 
337
        this.mon(this.eventEl, "click", this.handleDateClick,  this, {delegate: "a.x-date-date"});
 
338
 
 
339
        this.el.unselectable();
 
340
        
 
341
        this.cells = this.el.select("table.x-date-inner tbody td");
 
342
        this.textNodes = this.el.query("table.x-date-inner tbody span");
 
343
 
 
344
        this.mbtn = new Ext.Button({
 
345
            text: "&#160;",
 
346
            tooltip: this.monthYearText,
 
347
            renderTo: this.el.child("td.x-date-middle", true)
 
348
        });
 
349
        
 
350
                this.mon(this.mbtn, 'click', this.showMonthPicker, this);
 
351
        this.mbtn.el.child('em').addClass("x-btn-arrow");
 
352
 
 
353
        if(this.showToday){
 
354
            this.todayKeyListener = this.eventEl.addKeyListener(Ext.EventObject.SPACE, this.selectToday,  this);
 
355
            var today = (new Date()).dateFormat(this.format);
 
356
            this.todayBtn = new Ext.Button({
 
357
                renderTo: this.el.child("td.x-date-bottom", true),
 
358
                text: String.format(this.todayText, today),
 
359
                tooltip: String.format(this.todayTip, today),
 
360
                handler: this.selectToday,
 
361
                scope: this
 
362
            });
 
363
        }
 
364
        
 
365
        if(Ext.isIE){
 
366
            this.el.repaint();
 
367
        }
 
368
        this.update(this.value);
 
369
    },
 
370
 
 
371
    // private
 
372
    createMonthPicker : function(){
 
373
        if(!this.monthPicker.dom.firstChild){
 
374
            var buf = ['<table border="0" cellspacing="0">'];
 
375
            for(var i = 0; i < 6; i++){
 
376
                buf.push(
 
377
                    '<tr><td class="x-date-mp-month"><a href="#">', this.monthNames[i].substr(0, 3), '</a></td>',
 
378
                    '<td class="x-date-mp-month x-date-mp-sep"><a href="#">', this.monthNames[i+6].substr(0, 3), '</a></td>',
 
379
                    i == 0 ?
 
380
                    '<td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-prev"></a></td><td class="x-date-mp-ybtn" align="center"><a class="x-date-mp-next"></a></td></tr>' :
 
381
                    '<td class="x-date-mp-year"><a href="#"></a></td><td class="x-date-mp-year"><a href="#"></a></td></tr>'
 
382
                );
 
383
            }
 
384
            buf.push(
 
385
                '<tr class="x-date-mp-btns"><td colspan="4"><button type="button" class="x-date-mp-ok">',
 
386
                    this.okText,
 
387
                    '</button><button type="button" class="x-date-mp-cancel">',
 
388
                    this.cancelText,
 
389
                    '</button></td></tr>',
 
390
                '</table>'
 
391
            );
 
392
            this.monthPicker.update(buf.join(''));
 
393
            
 
394
            this.mon(this.monthPicker, 'click', this.onMonthClick, this);
 
395
            this.mon(this.monthPicker, 'dblclick', this.onMonthDblClick, this);
 
396
 
 
397
            this.mpMonths = this.monthPicker.select('td.x-date-mp-month');
 
398
            this.mpYears = this.monthPicker.select('td.x-date-mp-year');
 
399
 
 
400
            this.mpMonths.each(function(m, a, i){
 
401
                i += 1;
 
402
                if((i%2) == 0){
 
403
                    m.dom.xmonth = 5 + Math.round(i * .5);
 
404
                }else{
 
405
                    m.dom.xmonth = Math.round((i-1) * .5);
 
406
                }
 
407
            });
 
408
        }
 
409
    },
 
410
 
 
411
    // private
 
412
    showMonthPicker : function(){
 
413
        this.createMonthPicker();
 
414
        var size = this.el.getSize();
 
415
        this.monthPicker.setSize(size);
 
416
        this.monthPicker.child('table').setSize(size);
 
417
 
 
418
        this.mpSelMonth = (this.activeDate || this.value).getMonth();
 
419
        this.updateMPMonth(this.mpSelMonth);
 
420
        this.mpSelYear = (this.activeDate || this.value).getFullYear();
 
421
        this.updateMPYear(this.mpSelYear);
 
422
 
 
423
        this.monthPicker.slideIn('t', {duration:.2});
 
424
    },
 
425
 
 
426
    // private
 
427
    updateMPYear : function(y){
 
428
        this.mpyear = y;
 
429
        var ys = this.mpYears.elements;
 
430
        for(var i = 1; i <= 10; i++){
 
431
            var td = ys[i-1], y2;
 
432
            if((i%2) == 0){
 
433
                y2 = y + Math.round(i * .5);
 
434
                td.firstChild.innerHTML = y2;
 
435
                td.xyear = y2;
 
436
            }else{
 
437
                y2 = y - (5-Math.round(i * .5));
 
438
                td.firstChild.innerHTML = y2;
 
439
                td.xyear = y2;
 
440
            }
 
441
            this.mpYears.item(i-1)[y2 == this.mpSelYear ? 'addClass' : 'removeClass']('x-date-mp-sel');
 
442
        }
 
443
    },
 
444
 
 
445
    // private
 
446
    updateMPMonth : function(sm){
 
447
        this.mpMonths.each(function(m, a, i){
 
448
            m[m.dom.xmonth == sm ? 'addClass' : 'removeClass']('x-date-mp-sel');
 
449
        });
 
450
    },
 
451
 
 
452
    // private
 
453
    selectMPMonth: function(m){
 
454
        
 
455
    },
 
456
 
 
457
    // private
 
458
    onMonthClick : function(e, t){
 
459
        e.stopEvent();
 
460
        var el = new Ext.Element(t), pn;
 
461
        if(el.is('button.x-date-mp-cancel')){
 
462
            this.hideMonthPicker();
 
463
        }
 
464
        else if(el.is('button.x-date-mp-ok')){
 
465
            var d = new Date(this.mpSelYear, this.mpSelMonth, (this.activeDate || this.value).getDate());
 
466
            if(d.getMonth() != this.mpSelMonth){
 
467
                // "fix" the JS rolling date conversion if needed
 
468
                d = new Date(this.mpSelYear, this.mpSelMonth, 1).getLastDateOfMonth();
 
469
            }
 
470
            this.update(d);
 
471
            this.hideMonthPicker();
 
472
        }
 
473
        else if(pn = el.up('td.x-date-mp-month', 2)){
 
474
            this.mpMonths.removeClass('x-date-mp-sel');
 
475
            pn.addClass('x-date-mp-sel');
 
476
            this.mpSelMonth = pn.dom.xmonth;
 
477
        }
 
478
        else if(pn = el.up('td.x-date-mp-year', 2)){
 
479
            this.mpYears.removeClass('x-date-mp-sel');
 
480
            pn.addClass('x-date-mp-sel');
 
481
            this.mpSelYear = pn.dom.xyear;
 
482
        }
 
483
        else if(el.is('a.x-date-mp-prev')){
 
484
            this.updateMPYear(this.mpyear-10);
 
485
        }
 
486
        else if(el.is('a.x-date-mp-next')){
 
487
            this.updateMPYear(this.mpyear+10);
 
488
        }
 
489
    },
 
490
 
 
491
    // private
 
492
    onMonthDblClick : function(e, t){
 
493
        e.stopEvent();
 
494
        var el = new Ext.Element(t), pn;
 
495
        if(pn = el.up('td.x-date-mp-month', 2)){
 
496
            this.update(new Date(this.mpSelYear, pn.dom.xmonth, (this.activeDate || this.value).getDate()));
 
497
            this.hideMonthPicker();
 
498
        }
 
499
        else if(pn = el.up('td.x-date-mp-year', 2)){
 
500
            this.update(new Date(pn.dom.xyear, this.mpSelMonth, (this.activeDate || this.value).getDate()));
 
501
            this.hideMonthPicker();
 
502
        }
 
503
    },
 
504
 
 
505
    // private
 
506
    hideMonthPicker : function(disableAnim){
 
507
        if(this.monthPicker){
 
508
            if(disableAnim === true){
 
509
                this.monthPicker.hide();
 
510
            }else{
 
511
                this.monthPicker.slideOut('t', {duration:.2});
 
512
            }
 
513
        }
 
514
    },
 
515
 
 
516
    // private
 
517
    showPrevMonth : function(e){
 
518
        this.update(this.activeDate.add("mo", -1));
 
519
    },
 
520
 
 
521
    // private
 
522
    showNextMonth : function(e){
 
523
        this.update(this.activeDate.add("mo", 1));
 
524
    },
 
525
 
 
526
    // private
 
527
    showPrevYear : function(){
 
528
        this.update(this.activeDate.add("y", -1));
 
529
    },
 
530
 
 
531
    // private
 
532
    showNextYear : function(){
 
533
        this.update(this.activeDate.add("y", 1));
 
534
    },
 
535
 
 
536
    // private
 
537
    handleMouseWheel : function(e){
 
538
        var delta = e.getWheelDelta();
 
539
        if(delta > 0){
 
540
            this.showPrevMonth();
 
541
            e.stopEvent();
 
542
        } else if(delta < 0){
 
543
            this.showNextMonth();
 
544
            e.stopEvent();
 
545
        }
 
546
    },
 
547
 
 
548
    // private
 
549
    handleDateClick : function(e, t){
 
550
        e.stopEvent();
 
551
        if(t.dateValue && !Ext.fly(t.parentNode).hasClass("x-date-disabled")){
 
552
            this.setValue(new Date(t.dateValue));
 
553
            this.fireEvent("select", this, this.value);
 
554
        }
 
555
    },
 
556
 
 
557
    // private
 
558
    selectToday : function(){
 
559
        if(this.todayBtn && !this.todayBtn.disabled){
 
560
            this.setValue(new Date().clearTime());
 
561
            this.fireEvent("select", this, this.value);
 
562
        }
 
563
    },
 
564
 
 
565
    // private
 
566
    update : function(date, forceRefresh){
 
567
        var vd = this.activeDate, vis = this.isVisible();
 
568
        this.activeDate = date;
 
569
        if(!forceRefresh && vd && this.el){
 
570
            var t = date.getTime();
 
571
            if(vd.getMonth() == date.getMonth() && vd.getFullYear() == date.getFullYear()){
 
572
                this.cells.removeClass("x-date-selected");
 
573
                this.cells.each(function(c){
 
574
                   if(c.dom.firstChild.dateValue == t){
 
575
                       c.addClass("x-date-selected");
 
576
                       if(vis){
 
577
                           Ext.fly(c.dom.firstChild).focus(50);
 
578
                       }
 
579
                       return false;
 
580
                   }
 
581
                });
 
582
                return;
 
583
            }
 
584
        }
 
585
        var days = date.getDaysInMonth();
 
586
        var firstOfMonth = date.getFirstDateOfMonth();
 
587
        var startingPos = firstOfMonth.getDay()-this.startDay;
 
588
 
 
589
        if(startingPos <= this.startDay){
 
590
            startingPos += 7;
 
591
        }
 
592
 
 
593
        var pm = date.add("mo", -1);
 
594
        var prevStart = pm.getDaysInMonth()-startingPos;
 
595
 
 
596
        var cells = this.cells.elements;
 
597
        var textEls = this.textNodes;
 
598
        days += startingPos;
 
599
 
 
600
        // convert everything to numbers so it's fast
 
601
        var day = 86400000;
 
602
        var d = (new Date(pm.getFullYear(), pm.getMonth(), prevStart)).clearTime();
 
603
        var today = new Date().clearTime().getTime();
 
604
        var sel = date.clearTime().getTime();
 
605
        var min = this.minDate ? this.minDate.clearTime() : Number.NEGATIVE_INFINITY;
 
606
        var max = this.maxDate ? this.maxDate.clearTime() : Number.POSITIVE_INFINITY;
 
607
        var ddMatch = this.disabledDatesRE;
 
608
        var ddText = this.disabledDatesText;
 
609
        var ddays = this.disabledDays ? this.disabledDays.join("") : false;
 
610
        var ddaysText = this.disabledDaysText;
 
611
        var format = this.format;
 
612
 
 
613
        if(this.showToday){
 
614
            var td = new Date().clearTime();
 
615
            var disable = (td < min || td > max || 
 
616
                (ddMatch && format && ddMatch.test(td.dateFormat(format))) || 
 
617
                (ddays && ddays.indexOf(td.getDay()) != -1));
 
618
                        
 
619
            this.todayBtn.setDisabled(disable);
 
620
            this.todayKeyListener[disable ? 'disable' : 'enable']();
 
621
        }
 
622
        
 
623
        var setCellClass = function(cal, cell){
 
624
            cell.title = "";
 
625
            var t = d.getTime();
 
626
            cell.firstChild.dateValue = t;
 
627
            if(t == today){
 
628
                cell.className += " x-date-today";
 
629
                cell.title = cal.todayText;
 
630
            }
 
631
            if(t == sel){
 
632
                cell.className += " x-date-selected";
 
633
                if(vis){
 
634
                    Ext.fly(cell.firstChild).focus(50);
 
635
                }
 
636
            }
 
637
            // disabling
 
638
            if(t < min) {
 
639
                cell.className = " x-date-disabled";
 
640
                cell.title = cal.minText;
 
641
                return;
 
642
            }
 
643
            if(t > max) {
 
644
                cell.className = " x-date-disabled";
 
645
                cell.title = cal.maxText;
 
646
                return;
 
647
            }
 
648
            if(ddays){
 
649
                if(ddays.indexOf(d.getDay()) != -1){
 
650
                    cell.title = ddaysText;
 
651
                    cell.className = " x-date-disabled";
 
652
                }
 
653
            }
 
654
            if(ddMatch && format){
 
655
                var fvalue = d.dateFormat(format);
 
656
                if(ddMatch.test(fvalue)){
 
657
                    cell.title = ddText.replace("%0", fvalue);
 
658
                    cell.className = " x-date-disabled";
 
659
                }
 
660
            }
 
661
        };
 
662
 
 
663
        var i = 0;
 
664
        for(; i < startingPos; i++) {
 
665
            textEls[i].innerHTML = (++prevStart);
 
666
            d.setDate(d.getDate()+1);
 
667
            cells[i].className = "x-date-prevday";
 
668
            setCellClass(this, cells[i]);
 
669
        }
 
670
        for(; i < days; i++){
 
671
            var intDay = i - startingPos + 1;
 
672
            textEls[i].innerHTML = (intDay);
 
673
            d.setDate(d.getDate()+1);
 
674
            cells[i].className = "x-date-active";
 
675
            setCellClass(this, cells[i]);
 
676
        }
 
677
        var extraDays = 0;
 
678
        for(; i < 42; i++) {
 
679
             textEls[i].innerHTML = (++extraDays);
 
680
             d.setDate(d.getDate()+1);
 
681
             cells[i].className = "x-date-nextday";
 
682
             setCellClass(this, cells[i]);
 
683
        }
 
684
 
 
685
        this.mbtn.setText(this.monthNames[date.getMonth()] + " " + date.getFullYear());
 
686
 
 
687
        if(!this.internalRender){
 
688
            var main = this.el.dom.firstChild;
 
689
            var w = main.offsetWidth;
 
690
            this.el.setWidth(w + this.el.getBorderWidth("lr"));
 
691
            Ext.fly(main).setWidth(w);
 
692
            this.internalRender = true;
 
693
            // opera does not respect the auto grow header center column
 
694
            // then, after it gets a width opera refuses to recalculate
 
695
            // without a second pass
 
696
            if(Ext.isOpera && !this.secondPass){
 
697
                main.rows[0].cells[1].style.width = (w - (main.rows[0].cells[0].offsetWidth+main.rows[0].cells[2].offsetWidth)) + "px";
 
698
                this.secondPass = true;
 
699
                this.update.defer(10, this, [date]);
 
700
            }
 
701
        }
 
702
    },
 
703
 
 
704
    // private
 
705
    beforeDestroy : function() {
 
706
        if(this.rendered){
 
707
            Ext.destroy(
 
708
                this.leftClickRpt,
 
709
                this.rightClickRpt,
 
710
                this.monthPicker,
 
711
                this.eventEl,
 
712
                this.mbtn,
 
713
                this.todayBtn
 
714
            );
 
715
        }
 
716
    }
 
717
 
 
718
    /**
 
719
     * @cfg {String} autoEl @hide
 
720
     */
 
721
});
 
722
Ext.reg('datepicker', Ext.DatePicker);
 
 
b'\\ No newline at end of file'