3 Description: See the demo at url
4 URL: http://www.softcomplex.com/products/tigra_calendar/
6 Date: 08-08-2002 (mm-dd-yyyy)
7 Feedback: feedback@softcomplex.com (specify product title in the subject)
8 Note: Permission given to use this script in ANY kind of applications if
9 header lines are left unchanged.
10 Note: Script consists of two files: calendar?.js and calendar.html
11 About us: Our company provides offshore IT consulting services.
12 Contact us at sales@softcomplex.com if you have any programming task you
13 want to be handled by professionals. Our typical hourly rate is $20.
15 modified by Martin Hoerning, mh@skyrix.com, 2002-12-05
19 <title>Select Date, Please.</title>
21 td {font-family: Tahoma, Verdana, sans-serif; font-size: 12px;}
23 <script language="JavaScript">
25 // months as they appear in the calendar's title
26 var ARR_MONTHS = ["January", "February", "March", "April", "May", "June",
27 "July", "August", "September", "October", "November", "December"];
28 // week day titles as they appear on the calendar
29 var ARR_WEEKDAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
30 // day week starts from (normally 0-Mo or 1-Su)
31 var NUM_WEEKSTART = 1;
32 // path to the directory where calendar images are stored. trailing slash req.
33 var STR_ICONPATH = '';
35 var re_url = new RegExp('datetime=(\\-?\\d+)');
36 var dt_current = (re_url.exec(String(window.location))
37 ? new Date(new Number(RegExp.$1)) : new Date());
38 var re_id = new RegExp('id=(\\d+)');
39 var num_id = (re_id.exec(String(window.location))
40 ? new Number(RegExp.$1) : 0);
41 var obj_caller = (window.opener ? window.opener.calendars[num_id] : null);
43 if (obj_caller && obj_caller.year_scroll) {
44 // get same date in the previous year
45 var dt_prev_year = new Date(dt_current);
46 dt_prev_year.setFullYear(dt_prev_year.getFullYear() - 1);
47 if (dt_prev_year.getDate() != dt_current.getDate())
48 dt_prev_year.setDate(0);
50 // get same date in the next year
51 var dt_next_year = new Date(dt_current);
52 dt_next_year.setFullYear(dt_next_year.getFullYear() + 1);
53 if (dt_next_year.getDate() != dt_current.getDate())
54 dt_next_year.setDate(0);
57 // get same date in the previous month
58 var dt_prev_month = new Date(dt_current);
59 dt_prev_month.setMonth(dt_prev_month.getMonth() - 1);
60 if (dt_prev_month.getDate() != dt_current.getDate())
61 dt_prev_month.setDate(0);
63 // get same date in the next month
64 var dt_next_month = new Date(dt_current);
65 dt_next_month.setMonth(dt_next_month.getMonth() + 1);
66 if (dt_next_month.getDate() != dt_current.getDate())
67 dt_next_month.setDate(0);
69 // get first day to display in the grid for current month
70 var dt_firstday = new Date(dt_current);
71 dt_firstday.setDate(1);
72 dt_firstday.setDate(1 - (7 + dt_firstday.getDay() - NUM_WEEKSTART) % 7);
74 // function passing selected date to calling window
75 function set_datetime(n_datetime, b_close) {
76 if (!obj_caller) return;
78 var dt_datetime = new Date(n_datetime);
81 alert('failed to generate date string');
84 if (b_close) { // only set value when closing window
85 obj_caller.target.value = (document.cal
86 ? obj_caller.gen_tsmp(dt_datetime)
87 : obj_caller.gen_date(dt_datetime)
90 if (b_close) window.close();
91 else obj_caller.popup(dt_datetime.valueOf());
96 <body bgcolor="#FFFFFF" marginheight="5" marginwidth="5" topmargin="5" leftmargin="5" rightmargin="5">
97 <table class="clsOTable" cellspacing="0" border="0" width="100%">
98 <tr><td bgcolor="#E8E8E0">
99 <table cellspacing="1" cellpadding="3" border="0" width="100%">
100 <tr><td colspan="7" bgcolor="#D0D0D0"><table cellspacing="0" cellpadding="0" border="0" width="100%">
102 <script language="JavaScript">
104 '<td>'+(obj_caller&&obj_caller.year_scroll?'<a href="javascript:set_datetime('+dt_prev_year.valueOf()+')"><img src="'+STR_ICONPATH+'first.gif" width="15" height="15" border="0" alt="previous year" title="previous year"></a> ':'')+'<a href="javascript:set_datetime('+dt_prev_month.valueOf()+')"><img src="'+STR_ICONPATH+'previous.gif" width="15" height="15" border="0" alt="previous month" title="previous month"></a></td>'+
105 '<td align="center" width="100%"><font color="#000000">'+ARR_MONTHS[dt_current.getMonth()]+' '+dt_current.getFullYear() + '</font></td>'+
106 '<td><a href="javascript:set_datetime('+dt_next_month.valueOf()+')"><img src="'+STR_ICONPATH+'next.gif" width="15" height="15" border="0" alt="next month" title="next month"></a>'+(obj_caller && obj_caller.year_scroll?' <a href="javascript:set_datetime('+dt_next_year.valueOf()+')"><img src="'+STR_ICONPATH+'last.gif" width="15" height="15" border="0" alt="next year" title="next year"></a>':'')+'</td>'
112 <script language="JavaScript">
114 // print weekdays titles
115 for (var n=0; n<7; n++)
116 document.write('<td bgcolor="#D0D0D0" align="center"><font color="#000000">'+ARR_WEEKDAYS[(NUM_WEEKSTART+n)%7]+'</font></td>');
117 document.write('</tr>');
119 // print calendar table
120 var dt_current_day = new Date(dt_firstday);
121 while (dt_current_day.getMonth() == dt_current.getMonth() ||
122 dt_current_day.getMonth() == dt_firstday.getMonth()) {
124 document.write('<tr>');
125 for (var n_current_wday=0; n_current_wday<7; n_current_wday++) {
126 if (dt_current_day.getDate() == dt_current.getDate() &&
127 dt_current_day.getMonth() == dt_current.getMonth())
128 // print current date
129 document.write('<td bgcolor="#F18D39" align="center" width="14%">');
130 //else if (dt_current_day.getDay() == 0 || dt_current_day.getDay() == 6)
131 else if (dt_current_day.getMonth() != dt_current.getMonth())
132 // old: weekend days // new: other month
133 document.write('<td bgcolor="#D0D0D0" align="center" width="14%">');
135 // print working days of current month
136 document.write('<td bgcolor="#E0E0E0" align="center" width="14%">');
138 document.write('<a href="javascript:set_datetime('+dt_current_day.valueOf() +', true);">');
140 if (dt_current_day.getMonth() == this.dt_current.getMonth())
141 // print days of current month
142 document.write('<font color="#000000">');
144 // print days of other months
145 document.write('<font color="#555555">');
147 document.write(dt_current_day.getDate()+'</font></a></td>');
148 dt_current_day.setDate(dt_current_day.getDate()+1);
151 document.write('</tr>');
153 //if (obj_caller && obj_caller.time_comp)
154 // document.write('<form onsubmit="javascript:set_datetime('+dt_current.valueOf()+', true)" name="cal"><tr><td colspan="7" bgcolor="#87CEFA"><font color="White" face="tahoma, verdana" size="2">Time: <input type="text" name="time" value="'+obj_caller.gen_time(this.dt_current)+'" size="8" maxlength="8"></font></td></tr></form>');