https://www.wanosato.com/common/js/jkl-calendar.js

1//  ========================================================
2//  jkl-calendar.js ---- ポップアップカレンダー表示クラス
3//  Copyright 2005-2006 Kawasaki Yusuke <u-suke [at] kawa.net>
4//  2005/04/06 - 最初のバージョン
5//  2005/04/10 - 外部スタイルシートを使用しない、JKL.Opacity はオプション
6//  2006/10/22 - typo修正、spliter/min_date/max_dateプロパティ、×ボタン追加
7//  2006/10/23 - prototype.js併用時は、Event.observe()でイベント登録
8//  2006/10/24 - max_date 範囲バグ修正
9//  2006/10/25 - フォームに初期値があれば、カレンダーの初期値に採用する
10//  2006/11/15 - MOM Update 週の初めの曜日を変更できるように修正
11//  2006/11/23 - MOM Update 今日日付の文字色を指定できるように修正、あと枠線も描画してみる
12//               邪魔な<select>への応急処置を書いてみた
13//  2006/11/27 - MOM Update 邪魔な<select>への応急処置を修正、描画領域の高さを取得する
14//  2006/11/30 - MOM Update 選択可能な曜日をプロパティに追加、今日日付と選択不可能な日付の背景色をスタイルに追加
15//               カレンダーのz-indexをプロパティに追加
16//  2006/12/04 - ksuzu Update 選択可能日がない月には移動できないように変更
17//               カレンダーの表示月をクリックすると現在の月に移動できるよう変更
18//               閉じるボタンにてカレンダーを閉じたとき、カレンダーの初期表示を戻すよう変更
19//  2006/12/30 - MOM IFRAMEのSRC属性にdummy.htmlを挿入
20//  2007/02/04 - MOM setDateYMDのバグを修正
21//               TDタグのスタイルに背景色を指定するよう修正
22//  2013/10/18 - DYN 祝日を文字色を変更するように修正
23//
24//  ========================================================
25
26// 親クラス
27
28if ( typeof(JKL) == 'undefined' ) JKL = function() {};
29
30// JKL.Calendar コンストラクタの定義
31
32JKL.Calendar = function ( eid, fid, valname ) {
33    // 2013.10.18 DYN 祝日 関数設定
34    this.initHoliday();
35
36    this.eid = eid;
37    this.formid = fid;
38    this.valname = valname;
39    this.__dispelem = null;  // カレンダー表示欄エレメント
40    this.__textelem = null;  // テキスト入力欄エレメント
41    this.__opaciobj = null;  // JKL.Opacity オブジェクト
42    this.style = new JKL.Calendar.Style();
43    return this;
44};
45
46// バージョン番号
47
48JKL.Calendar.VERSION = "0.13";
49
50// デフォルトのプロパティ
51
52JKL.Calendar.prototype.spliter = "/";
53JKL.Calendar.prototype.date = null;
54JKL.Calendar.prototype.min_date = null;
55JKL.Calendar.prototype.max_date = null;
56
57// 2006.11.15 MOM 表示開始曜日をプロパティに追加(デフォルトは日曜日=0)
58JKL.Calendar.prototype.start_day = 0;
59
60// 2006.11.23 MOM カレンダー内の日付を枠線で区切るかどうかのプロパティ(デフォルトはtrue)
61JKL.Calendar.prototype.draw_border = true;
62
63// 2006.11.30 MOM 各曜日の選択可否をプロパティに追加(デフォルトは全てtrue)
64// 配列の添え字で曜日を指定(0～6 = 日曜～土曜)、選択可否をboolean値で代入する、という使い方
65JKL.Calendar.prototype.selectable_days = new Array(true,true,true,true,true,true,true);
66
67// 2006.11.30 MOM カレンダーのz-indexをプロパティに追加
68JKL.Calendar.prototype.zindex = 10;
69
70// 2013.10.18 DYN 祝日プロパティ追加
71JKL.Calendar.prototype.holiday = null;
72
73// JKL.Calendar.Style
74JKL.Calendar.Style = function() {
75    return this;
76};
77
78// デフォルトのスタイル
79
80JKL.Calendar.Style.prototype.frame_width        = "220px";      // フレーム横幅
81JKL.Calendar.Style.prototype.frame_color        = "#CCCCCC";    // フレーム枠の色
82JKL.Calendar.Style.prototype.font_size          = "12px";       // 文字サイズ
83JKL.Calendar.Style.prototype.day_bgcolor        = "#FFFFFF";    // カレンダーの背景色
84JKL.Calendar.Style.prototype.month_color        = "#333333";    // ○年○月部分の背景色
85JKL.Calendar.Style.prototype.month_hover_color  = "#333333";    // 月のマウスオーバー時の≪≫文字色
86JKL.Calendar.Style.prototype.month_hover_bgcolor= "#DDDDDD";    // 月のマウスオーバー時の≪≫背景色
87JKL.Calendar.Style.prototype.weekday_color      = "#404040";    // 月曜～金曜日セルの文字色
88JKL.Calendar.Style.prototype.saturday_color     = "#0040D0";    // 土曜日セルの文字色
89JKL.Calendar.Style.prototype.sunday_color       = "#D00000";    // 日曜日セルの文字色
90JKL.Calendar.Style.prototype.others_color       = "#AAAAAA";    // 他の月の日セルの文字色
91JKL.Calendar.Style.prototype.day_hover_bgcolor  = "#FEB797";    // 日付のマウスオーバー時の日セルの背景
92JKL.Calendar.Style.prototype.cursor             = "pointer";    // 日付のマウスオーバー時のカーソル形状
93
94// 2006.11.23 MOM 今日日付の文字色をプロパティに追加
95JKL.Calendar.Style.prototype.today_color        = "#666666";    // 今日日付セルの文字色
96
97// 2006.11.23 MOM 枠線もつけてみる
98JKL.Calendar.Style.prototype.today_border_color = "#666666";    // 今日日付セルの枠線の色
99JKL.Calendar.Style.prototype.others_border_color= "#EEEEEE";    // 他の日セルの枠線の色
100

101// 2006.11.30 MOM 今日日付の背景色を忘れてたので追加してみる
102JKL.Calendar.Style.prototype.today_bgcolor      = "#FFFFFF";    // 今日日付セルの背景色
103
104// 2006.11.30 MOM 選択不可能な日付の背景色を追加
105JKL.Calendar.Style.prototype.unselectable_day_bgcolor = "#EEEEEE";    // 選択不可能な日付の背景色
106
107// 2013.10.18 DYN 祝日セルの文字色を追加
108JKL.Calendar.Style.prototype.holiday_color      = "#D00000";
109
110//  メソッド
111
112JKL.Calendar.Style.prototype.set = function(key,val) { this[key] = val; }
113JKL.Calendar.Style.prototype.get = function(key) { return this[key]; }
114JKL.Calendar.prototype.setStyle = function(key,val) { this.style.set(key,val); };
115JKL.Calendar.prototype.getStyle = function(key) { return this.style.get(key); };
116
117// 日付を初期化する
118
119JKL.Calendar.prototype.initDate = function ( dd ) {
120    if ( ! dd ) dd = new Date();
121    var year = dd.getFullYear();
122    var mon  = dd.getMonth();
123    var date = dd.getDate();
124    this.date = new Date( year, mon, date );
125    this.getFormValue();
126    return this.date;
127}
128
129// 2013.10.18 DYN 祝日を取得する
130JKL.Calendar.prototype.initHoliday = function () {
131    // var $j = jQuery.noConflict(true);
132    // alert($j.fn.jquery);
133    var holiday = new Array();
134
135    // googleから
136    if (!this.date) this.initDate();
137
138    var endDate = new Date(this.date.getFullYear(), this.date.getMonth() + 13, 01); // 13か月後
139
140    // フォーマット
141    var startM = this.date.getMonth() + 1;
142    var endM = endDate.getMonth() + 1;
143    if (startM < 10) startM = '0' + startM;
144    if (endM < 10) endM = '0' + endM;
145
146    var start = this.date.getFullYear() + '-' + startM + '-01'; // 今月から
147    var end   = endDate.getFullYear() + '-' + endM + '-01';

147     // 13か月後までとってくる
148
149    jQuery.ajax({
150        url: 'http://www.google.com/calendar/feeds/japanese__ja%40holiday.calendar.google.com/public/full?alt=json&start-min=' + start + '&start-max=' + end,
151        type: 'GET',
152        dataType: 'jsonp',
153        scriptCharset: 'utf-8',
154        timeout: 5000,
155        success: function (data) {
156            var entry = data.feed.entry;
157            for (var i = 0; i < entry.length; i++) {
158                holiday.push(entry[i].gd$when[0].startTime.replace(/-/g, '/'));
159            }
160            holiday.sort();
161        },
162        error: function (data) {
163        },
164        complete: function (data) {
165        }
166    });
167
168    this.holiday = holiday;
169}
170
171
172// 透明度設定のオブジェクトを返す
173
174JKL.Calendar.prototype.getOpacityObject = function () {
175    if ( this.__opaciobj ) return this.__opaciobj;
176    var cal = this.getCalendarElement();
177    if ( ! JKL.Opacity ) return;
178    this.__opaciobj = new JKL.Opacity( cal );
179    return this.__opaciobj;
180};
181
182// カレンダー表示欄のエレメントを返す
183
184JKL.Calendar.prototype.getCalendarElement = function () {
185    if ( this.__dispelem ) return this.__dispelem;
186    this.__dispelem = document.getElementById( this.eid )
187    return this.__dispelem;
188};
189
190// テキスト入力欄のエレメントを返す
191
192JKL.Calendar.prototype.getFormElement = function () {
193    if ( this.__textelem ) return this.__textelem;
194    var frmelms = document.getElementById( this.formid );
195    if ( ! frmelms ) return;
196    for( var i=0; i < frmelms.elements.length; i++ ) {
197        if ( frmelms.elements[i].name == this.valname ) {
198            this.__textelem = frmelms.elements[i];
199        }
200    }
201    return this.__textelem;
202};
203
204// オブジェクトに日付を記憶する（YYYY/MM/DD形式で指定する）
205
206JKL.Calendar.prototype.setDateYMD = function (ymd) {
207    var splt = ymd.split( this.spliter );
208    if ( splt[0]-0 > 0 &&
209         splt[1]-0 >= 1 && splt[1]-0 <= 12 &&       // bug fix 2006/03/03 thanks to ucb
210         splt[2]-0 >= 1 && splt[2]-0 <= 31 ) {
211        if ( ! this.date ) this.initDate();
212            this.date.setDate( splt[2] );
213            this.date.setMonth( splt[1]-1 );
214            this.date.setFullYear( splt[0] );
215    } else {
216        ymd = "";
217    }
218    return ymd;
219};
220
221// オブジェクトから日付を取り出す（YYYY/MM/DD形式で返る）
222// 引数に Date オブジェクトの指定があれば、
223// オブジェクトは無視して、引数の日付を使用する（単なるfprint機能）
224
225JKL.Calendar.prototype.getDateYMD = function ( dd ) {
226    if ( ! dd ) {
227        if ( ! this.date ) this.initDate();
228        dd = this.date;
229    }
230    var mm = "" + (dd.getMonth()+1);
231    var aa = "" + dd.getDate();
232    if ( mm.length == 1 ) mm = "" + "0" + mm;
233    if ( aa.length == 1 ) aa = "" + "0" + aa;
234    return dd.getFullYear() + this.spliter + mm + this.spliter + aa;
235};
236
237// テキスト入力欄の値を返す（ついでにオブジェクトも更新する）
238
239JKL.Calendar.prototype.getFormValue = function () {
240    var form1 = this.getFormElement();
241    if ( ! form1 ) return "";
242    var date1 = this.setDateYMD( form1.value );
243    return date1;
244};
245
246// フォーム入力欄に指定した値を書き込む
247
248JKL.Calendar.prototype.setFormValue = function (ymd) {
249    if ( ! ymd ) ymd = this.getDateYMD();   // 無指定時はオブジェクトから？
250    var form1 = this.getFormElement();
251    if ( form1 ) form1.value = ymd;
252};
253
254// 2011.02.09 DYN追加
255// カレンダーから日付データを戻す
256JKL.Calendar.prototype.SetCalenderYmd = function (ymd) {
257	var warrArray = new Array;
258	var warrY;
259	var warrM;
260	var warrD;
261	var cnt;
262
263	warrArray = ymd.split('/');
264	warrY　　 = warrArray[0];
265	warrM　　 = Number(warrArray[1]);
266	warrD　　 = Number(warrArray[2]);
267
268	objfrm.cmbARRY.value = warrY;
269	objfrm.cmbARRM.value = warrM;
270	objfrm.cmbARRD.value = warrD;
271};
272
273//  カレンダー表示欄を表示する
274
275JKL.Calendar.prototype.show = function () {
276    this.getCalendarElement().style.display = "";
277};
278
279//  カレンダー表示欄を即座に隠す
280
281JKL.Calendar.prototype.hide = function () {
282    this.getCalendarElement().style.display = "none";
283};
284
285//  カレンダー表示欄をフェードアウトする
286
287JKL.Calendar.prototype.fadeOut = function (s) {
288    if ( JKL.Opacity ) {
289        this.getOpacityObject().fadeOut(s);
290    } else {
291        this.hide();
292    }
293};
294
295// 月単位で移動する
296
297JKL.Calendar.prototype.moveMonth = function ( mon ) {
298    // 前へ移動
299    if ( ! this.date ) this.initDate();
300    for( ; mon<0; mon++ ) {
301        this.date.setDate(1);   // 毎月1日の1日前は必ず前の月
302        this.date.setTime( this.date.getTime() - (24*3600*1000) );
303    }
304    // 後へ移動
305    for( ; mon>0; mon-- ) {
306        this.date.setDate(1);   // 毎月1日の32日後は必ず次の月
307        this.date.setTime( this.date.getTime() + (24*3600*1000)*32 );
308    }
309    this.date.setDate(1);       // 当月の1日に戻す
310    this.write();    // 描画する
311};
312
313// イベントを登録する
314
315JKL.Calendar.prototype.addEvent = function ( elem, ev, func ) {
316//  prototype.js があれば利用する(IEメモリリーク回避)
317    if ( window.Event && Event.observe ) {
318        Event.observe( elem, ev, func, false );
319    } else {
320        elem["on"+ev] = func;
321    }
322}
323
324// カレンダーを描画する
325
326JKL.Calendar.prototype.write = function () {
327    var date = new Date();
328    if ( ! this.date ) this.initDate();
329    date.setTime( this.date.getTime() );
330
331    var year  = date.getFullYear();          // 指定年
332    var mon   = date.getMonth();             // 指定月
333    var today = date.getDate();              // 指定日
334    var form1 = this.getFormElement();
335
336    // 2013.10.18 DYN 指定月の祝日を取り出す
337    var holy = new Array();
338    for (var i = 0; i < this.holiday.length; i++) {
339        var ymd = this.holiday[i].split('/');
340        if (ymd[0] == year && ymd[1] == mon+1) {

341            holy.push(ymd[2]);
342        }
343    }
344
345
346// 2011.6.17 DYN  深夜販売時間を設定（通常は0を設定）
347    var midnight  = 5;
348    var checktime = new Date();
349    var hours     = (new Date(checktime.getHours())).getTime();
350
351    // 選択可能な日付範囲
352    var min;
353    if ( this.min_date ) {
354
355        // 2011.6.17 DYN 最初に深夜販売（midnight時）までかどうかをチェックする
356        if ( midnight > hours ){
357           this.min_date.setDate(checktime.getDate() - 1);
358           var tmp = new Date( this.min_date.getFullYear(), this.min_date.getMonth(), this.min_date.getDate() );
359        }else{
360           var tmp = new Date( this.min_date.getFullYear(), this.min_date.getMonth(), this.min_date.getDate() );
361        }
362        min = tmp.getTime();
363    }
364    var max;
365    if ( this.max_date ) {
366        var tmp = new Date( this.max_date.getFullYear(), 
367            this.max_date.getMonth(), this.max_date.getDate() );
368        max = tmp.getTime();
369    }
370
371    // 直前の月曜日まで戻す
372    date.setDate(1);                        // 1日に戻す
373    var wday = date.getDay();               // 曜日 日曜(0)～土曜(6)
374
375// 2006.11.15 MOM 表示開始曜日を可変にしたので、ロジックちょっといじりますよ
376    if ( wday != this.start_day ) {
377        date.setTime( date.getTime() - (24*3600*1000)*((wday-this.start_day+7)%7) );
378    }
379
380
381    // 最大で7日×6週間＝42日分のループ
382    var list = new Array();
383    for( var i=0; i<42; i++ ) {
384        var tmp = new Date();
385        tmp.setTime( date.getTime() + (24*3600*1000)*i );
386        if ( i && i%7==0 && tmp.getMonth() != mon ) break;
387        list[list.length] = tmp;
388    }
389
390    // スタイルシートを生成する
391    var month_table_style = 'width: 100%; ';
392    month_table_style += 'background: '+this.style.frame_color+'; ';
393    month_table_style += 'border: 1px solid '+this.style.frame_color+';';
394
395    var week_table_style = 'width: 100%; ';
396    week_table_style += 'background: '+this.style.day_bgcolor+'; ';
397    week_table_style += 'border-left: 1px solid '+this.style.frame_color+'; ';
398    week_table_style += 'border-right: 1px solid '+this.style.frame_color+'; ';
399
400    var days_table_style = 'width: 100%; ';
401    days_table_style += 'background: '+this.style.day_bgcolor+'; ';
402    days_table_style += 'border: 1px solid '+this.style.frame_color+'; ';
403
404    var month_td_style = "";
405// 2007.02.04 MOM TDタグも背景色のスタイルを明示的に指定する
406    month_td_style += 'background: '+this.style.frame_color+'; ';
407    month_td_style += 'font-size: '+this.style.font_size+'; ';
408    month_td_style += 'color: '+this.style.month_color+'; ';
409    month_td_style += 'padding: 4px 0px 2px 0px; ';
410    month_td_style += 'text-align: center; ';
411    month_td_style += 'font-weight: bold;';
412
413    var week_td_style = "";
414// 2007.02.04 MOM TDタグも背景色のスタイルを明示的に指定する
415    week_td_style += 'background: '+this.style.day_bgcolor+'; ';
416    week_td_style += 'font-size: '+this.style.font_size+'; ';
417    week_td_style += 'padding: 2px 0px 2px 0px; ';
418    week_td_style += 'font-weight: bold;';
419    week_td_style += 'text-align: center;';
420
421    var days_td_style = "";
422// 2007.02.04 MOM TDタグも背景色のスタイルを明示的に指定する
423    days_td_style += 'background: '+this.style.day_bgcolor+'; ';
424    days_td_style += 'font-size: '+this.style.font_size+'; ';
425    days_td_style += 'padding: 1px; ';
426    days_td_style += 'text-align: center; ';
427    days_td_style += 'font-weight: bold;';
428
429    var days_unselectable = "font-weight: normal;";
430
431    // HTMLソースを生成する
432    var src1 = "";
433
434// 2006.11.23 MOM 邪魔な<select>への応急処置その１
435// テーブルをdivで囲んで上位レイヤに設定(z-indexの値を大きくしておく)
436// 2006.11.27 MOM 描画フィールドの高さを取得するため、idをセットしておく
437    src1 += '<div id="'+this.eid+'_screen" style="position:relative;z-index:'+(this.zindex+1)+';">\n';
438
439    src1 += '<table border="0" cellpadding="0" cellspacing="0" style="'+month_table_style+'"><tr>';
440    src1 += '<td id="__'+this.eid+'_btn_prev" title="前の月へ" style="'+month_td_style+'">≪</td>';
441    src1 += '<td style="'+month_td_style+'">&nbsp;</td>';
442// 2006.12.04 ksuzu 表示月をクリックすると現在の月に移動
443    src1 += '<td id="__'+this.eid+'_btn_today" style="'+month_td_style+'">'+(year)+'年 '+(mon+1)+'月</td>';
444    src1 += '<td id="__'+this.eid+'_btn_close" title="閉じる" style="'+month_td_style+'">

444×</td>';
445    src1 += '<td id="__'+this.eid+'_btn_next" title="次の月へ" style="'+month_td_style+'">≫</td>';
446    src1 += "</tr></table>\n";
447    src1 += '<table border="0" cellpadding="0" cellspacing="0" style="'+week_table_style+'"><tr>';
448
449// 2006.11.15 MOM 表示開始曜日start_dayから順に一週間分表示する
450    for(var i = this.start_day; i < this.start_day + 7; i++){
451        var _wday = i%7;
452        if(_wday == 0){
453             src1 += '<td style="color: '+this.style.sunday_color+'; '+week_td_style+'">日</td>';
454        }else if(_wday == 6){
455             src1 += '<td style="color: '+this.style.saturday_color+'; '+week_td_style+'">土</td>';
456        }else{
457             src1 += '<td style="color: '+this.style.weekday_color+'; '+week_td_style+'">';
458            if(_wday == 1)        src1 += '月</td>';
459            else if(_wday == 2)    src1 += '火</td>';
460            else if(_wday == 3)    src1 += 'æ°´</td>';
461            else if(_wday == 4)    src1 += '木</td>';
462            else if(_wday == 5)    src1 += '金</td>';
463        }
464    }
465
466
467    src1 += "</tr></table>\n";
468    src1 += '<table border="0" cellpadding="0" cellspacing="0" style="'+days_table_style+'">';
469
470    var curutc;
471    if ( form1 && form1.value ) {
472        var splt = form1.value.split(this.spliter);
473        if ( splt[0] > 0 && splt[2] > 0 ) {
474            var curdd = new Date( splt[0]-0, splt[1]-1, splt[2]-0 );
475            curutc = curdd.getTime(); // フォーム上の当日
476        }
477    }
478
479//2006.11.23 MOM 今日日付を取得し、時分秒を切り捨てる
480    var realdd   = new Date();
481    var realutc  = (new Date(realdd.getFullYear(),realdd.getMonth(),realdd.getDate())).getTime();
482
483    for ( var i=0; i<list.length; i++ ) {
484        var dd = list[i];
485        var ww = dd.getDay();
486        var mm = dd.getMonth();
487
488        if ( ww == this.start_day ) {
489            src1 += "<tr>"; // 表示開始曜日の前に行頭
490        }
491
492        var cc  = days_td_style;
493        var utc = dd.getTime();
494
495        if ( mon == mm ) {
496
497//2006.11.23 MOM 最初に今日日付かどうかをチェックする
498//※当月でない場合にも色変えると選択できそうに見えて紛らわしいので、当月かつ今日日付の場合のみ色を変える
499            if ( utc == realutc ){
500                cc += "color: "+this.style.today_color+";";     // 今日日付
501            } else
502
503            //s131018 t-suhara 当月の祝日を追加
504                if (dd.getDate() == holy[0]) {
505                    cc += "color: " + this.style.holiday_color + ";";
506                    holy = holy.slice(1);
507                } else
508                //e131018 t-suhara
509                    if (ww == 0) {
510                        cc += "color: " + this.style.sunday_color + ";";    // 当月の日曜日
511                    } else if (ww == 6) {
512                        cc += "color: " + this.style.saturday_color + ";";  // 当月の土曜日
513                    } else {
514                        cc += "color: " + this.style.weekday_color + ";";   // 当月の平日
515                    }
516
517        } else {
518            cc += "color: "+this.style.others_color+";";        // 前月末と翌月初の日付
519        }
520
521//2006.11.23 MOM utcの変数宣言を↑に移動
522//      var utc = dd.getTime();
523
524// 2006.11.30 MOM 選択可能な曜日指定の条件追加
525//        if (( min && min > utc ) || ( max && max < utc )) {
526        if (( min && min > utc ) || ( max && max < utc ) || ( !this.selectable_days[dd.getDay()] )) {
527            cc += days_unselectable;
528        }
529        if ( utc == curutc ) { // フォーム上の当日
530            cc += "background: "+this.style.day_hover_bgcolor+";";
531        }
532// 2006.11.30 MOM 今日日付の背景色
533        else if ( mon == mm && utc == realutc ) {
534            cc += "background: "+this.style.today_bgcolor+";";
535        }
536// 2006.11.30 MOM 選択不可能な日付の背景色
537        else if (( min && min > utc ) || ( max && max < utc ) || ( !this.selectable_days[dd.getDay()] )) {
538            cc += 'background: '+this.style.unselectable_day_bgcolor+';';
539        }
540
541//2006.11.23 MOM 枠線描画を追加
542        if ( this.draw_border ){
543            if ( mon == mm && utc == realutc ){
544                cc += "border:solid 1px "+this.style.today_border_color+";";    // 当月かつ今日日付
545            } else {
546                cc += "border:solid 1px "+this.style.others_border_color+";";    // その他
547            }
548        }
549
550        var ss = this.getDateYMD(dd);
551        var tt = dd.getDate();
552
553        src1 += '<td style="'+cc+'" title='+ss+' id="__'+this.eid+'_td_'+ss+'">'+tt+'</td>';
554
555        if ( ww == (this.start_day+6)%7 ) {
556            src1 += "</tr>\n";                                  // 表示開始曜日の１つ手前で行末
557        }
558    }
559    src1 += "</table>\n";
560
561    src1 += '</div>\n';
562
563    // カレンダーを書き換える
564    var cal1 = this.getCalendarElement();
565    if ( ! cal1 ) return;
566    cal1.style.width = this.style.frame_width;
567    cal1.style.position = "absolute";
568    cal1.innerHTML = src1;
569
570
571// 2006.11.23 MOM 邪魔な<select>への応急処置その２
572// カレンダーと全く同じサイズのIFRAMEを生成し、座標を一致させて下位レイヤに描画する
573
574// IFRAME対応が可能なバージョンのみ処置を施す
575    var ua = navigator.userAgent;
576    if( ua.indexOf("MSIE 5.5") >= 0 || ua.indexOf("MSIE 6") >= 0 ){
577
578// 2006.11.27 MOM 先にinnerHTMLにカレンダーの実体を渡しておいて、描画フィールドの高さを取得する
579// ※hide()が呼ばれた直後だと、offsetHeightが0になってしまうので、一時的にshowを呼ぶ
580        this.show();
581        var screenHeight = cal1.document.getElementById(this.eid+"_screen").offsetHeight;
582        this.hide();
583
584        src1 += '<div style="position:absolute;z-index:'+this.zindex+';top:0px;left:0px;">';
585        src1 += '<iframe /?scid="dummy.htm" frameborder=0 scrolling=no width='+this.style.frame_width+' height='+screenHeight+'></iframe>';
586        src1 += '</div>\n';
587
588//改めてinnerHTMLにセット
589        cal1.innerHTML = src1;
590    }
591
592
593
594    // イベントを登録する
595    var __this = this;
596    var get_src = function (ev) {
597        ev  = ev || window.event;
598        var src = ev.target || ev.srcElement;
599        return src;
600    };
601    var month_onmouseover = function (ev) {
602        var src = get_src(ev);
603        src.style.color = __this.style.month_hover_color;
604        src.style.background = __this.style.month_hover_bgcolor;
605    };
606    var month_onmouseout = function (ev) {
607        var src = get_src(ev);
608        src.style.color = __this.style.month_color;
609        src.style.background = __this.style.frame_color;
610    };
611    var day_onmouseover = function (ev) {
612        var src = get_src(ev);
613        src.style.background = __this.style.day_hover_bgcolor;
614    };
615    var day_onmouseout = function (ev) {
616        var src = get_src(ev);
617// 2006.11.30 MOM 当月かつ今日日付であれば、今日日付用の背景色を適用
618        var today = new Date();
619        if( today.getMonth() == __this.date.getMonth() && src.id == '__'+__this.eid+'_td_'+__this.getDateYMD(today) ){
620            src.style.background = __this.style.today_bgcolor;
621        }else{
622            src.style.background = __this.style.day_bgcolor;
623        }
624    };
625    var day_onclick = function (ev) {
626        var src = get_src(ev);
627        var srcday = src.id.substr(src.id.length-10);
628//      __this.setFormValue( srcday );
629	__this.SetCalenderYmd( srcday );
630        __this.fadeOut( 1.0 );
631    };
632
633//
634// 2006.12.04 ksuzu 選択できない月へのリンクは作成しない
635//
636    // 前の月へボタン
637    var tdprev = document.getElementById( "__"+this.eid+"_btn_prev" );
638    //前の月の最終日
639    var tmpDate = new Date(year,mon,1);
640    tmpDate.setTime( tmpDate.getTime() - (24*3600*1000) );
641    //選択可能な日がある？
642    if ( !min || this.min_date <= tmpDate ){
643        tdprev.style.cursor = this.style.cursor;
644        this.addEvent( tdprev, "mouseover", month_onmouseover );
645        this.addEvent( tdprev, "mouseout", month_onmouseout );
646        this.addEvent( tdprev, "click", function(){ __this.moveMonth( -1 ); });
647    }
648    //選択不可能
649    else{
650        tdprev.title = "前の月は選択できません";
651    }
652
653
654//
655// 2006.12.04 ksuzu 表示月をクリックすると現在の月に移動
656//
657    var nMov = (realdd.getFullYear() - year) * 12 + (realdd.getMonth() - mon);
658    if ( nMov != 0 ){
659        // 現在の月へボタン
660        var tdtoday = document.getElementById( "__"+this.eid+"_btn_today" );
661        tdtoday.style.cursor = this.style.cursor;
662        tdtoday.title = "現在の月へ";
663        this.addEvent( tdtoday, "mouseover", month_onmouseover );
664        this.addEvent( tdtoday, "mouseout", month_onmouseout );
665        this.addEvent( tdtoday, "click", function(){ __this.moveMonth( nMov ); });
666    }
667
668    // 閉じるボタン
669    var tdclose = document.getElementById( "__"+this.eid+"_btn_close" );
670    tdclose.style.cursor = this.style.cursor;
671    this.addEvent( tdclose, "mouseover", month_onmouseover );
672    this.addEvent( tdclose, "mouseout", month_onmouseout );
673
674//
675// 2006.12.04 ksuzu カレンダーの初期表示を戻す
676//
677    this.addEvent( tdclose, "click", function(){ __this.getFormValue(); __this.hide(); });
678
679//
680// 2006.12.04 ksuzu 選択できない月へのリンクは作成しない
681//
682    // 次の月へボタン
683    var tdnext = document.getElementById( "__"+this.eid+"_btn_next" );
684    //次の月の初日
685    var tmpDate = new Date(year,mon,1);
686    tmpDate.setTime( tmpDate.getTime() + (24*3600*1000)*32 );
687    tmpDate.setDate(1);
688    //選択可能な日がある？
689    if ( !max || this.max_date >= tmpDate ){
690        tdnext.style.cursor = this.style.cursor;
691        this.addEvent( tdnext, "mouseover", month_onmouseover );
692        this.addEvent( tdnext, "mouseout", month_onmouseout );
693        this.addEvent( tdnext, "click", function(){ __this.moveMonth( +1 ); });
694    }
695    //選択不可能
696    else{
697        tdnext.title = "次の月は選択できません";
698    }
699
700
701    // セルごとのイベントを登録する
702    for ( var i=0; i<list.length; i++ ) {
703        var dd = list[i];
704        if ( mon != dd.getMonth() ) continue;       // 今月のセルにのみ設定する
705
706        var utc = dd.getTime();
707        if ( min && min > utc ) continue;           // 昔過ぎる
708        if ( max && max < utc ) continue;           // 未来過ぎる
709//      if ( utc == curutc ) continue;              // フォーム上の当日
710// 2006.11.30 MOM 選択可能な曜日指定対応
711        if ( !this.selectable_days[dd.getDay()] ) continue;
712
713        var ss = this.getDateYMD(dd);
714        var cc = document.getElementById( "__"+this.eid+"_td_"+ss );
715        if ( ! cc ) continue;
716
717        cc.style.cursor = this.style.cursor;
718        this.addEvent( cc, "mouseover", day_onmouseover );
719        this.addEvent( cc, "mouseout", day_onmouseout );
720        this.addEvent( cc, "click", day_onclick );
721    }
722
723    // 表示する
724    this.show();
725
726};
727
728
729// 旧バージョン互換（typo）
730JKL.Calendar.prototype.getCalenderElement = JKL.Calendar.prototype.getCalendarElement;
731JKL.Calender = JKL.Calendar;