Subversion-Projekte lars-tiefland.codeigniter

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
1 lars 1 
<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');
2 
/**
3 
 * CodeIgniter
4 
 *
5 
 * An open source application development framework for PHP 4.3.2 or newer
6 
 *
7 
 * @package		CodeIgniter
8 
 * @author		ExpressionEngine Dev Team
9 
 * @copyright	Copyright (c) 2008, EllisLab, Inc.
10 
 * @license		http://codeigniter.com/user_guide/license.html
11 
 * @link		http://codeigniter.com
12 
 * @since		Version 1.0
13 
 * @filesource
14 
 */
15 
 
16 
// ------------------------------------------------------------------------
17 
 
18 
/*
19 
Instructions:
20 
 
21 
Load the plugin using:
22 
 
23 
 	$this->load->plugin('js_calendar');
24 
 
25 
Once loaded you'll add the calendar script to the <head> of your page like this:
26 
 
27 
<?php echo js_calendar_script('my_form');  ?>
28 
 
29 
The above function will be passed the name of your form.
30 
 
31 
Then to show the actual calendar you'll do this:
32 
 
33 
<?php echo js_calendar_write('entry_date', time(), true);?>
34 
<form name="my_form">
35 
<input type="text" name="entry_date" value="" onblur="update_calendar(this.name, this.value);" />
36 
<p><a href="javascript:void(0);" onClick="set_to_time('entry_date', '<?php echo time();?>')" >Today</a></p>
37 
</form>
38 
 
39 
 
40 
Note:  The first parameter is the name of the field containing your date, the second parameter contains the "now" time,
41 
and the third tells the calendar whether to highlight the current day or not.
42 
 
43 
Lastly, you'll need some CSS for your calendar:
44 
 
45 
.calendar {
46 
	border: 1px #6975A3 solid;
47 
	background-color: transparent;
48 
}
49 
.calheading {
50 
	background-color: #7C8BC0;
51 
	color: #fff;
52 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
53 
	font-size: 11px;
54 
	font-weight: bold;
55 
	text-align: center;
56 
}
57 
.calnavleft {
58 
	background-color: #7C8BC0;
59 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
60 
	font-size: 10px;
61 
	font-weight: bold;
62 
	color: #fff;
63 
	padding: 4px;
64 
	cursor: pointer;
65 
}
66 
.calnavright {
67 
	background-color: #7C8BC0;
68 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
69 
	font-size: 10px;
70 
	font-weight: bold;
71 
	color: #fff;
72 
	text-align:  right;
73 
	padding: 4px;
74 
	cursor: pointer;
75 
}
76 
.caldayheading {
77 
	background-color: #000;
78 
	color: #fff;
79 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
80 
	font-size: 10px;
81 
	text-align: center;
82 
	padding: 6px 2px 6px 2px;
83 
}
84 
.caldaycells{
85 
	color: #000;
86 
	background-color: #D1D7E6;
87 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
88 
	font-size: 11px;
89 
	text-align: center;
90 
	padding: 4px;
91 
	border: 1px #E0E5F1 solid;
92 
	cursor: pointer;
93 
}
94 
.caldaycellhover{
95 
	color: #fff;
96 
	background-color: #B3BCD4;
97 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
98 
	font-size: 11px;
99 
	text-align: center;
100 
	padding: 4px;
101 
	border: 1px #B3BCD4 solid;
102 
	cursor: pointer;
103 
}
104 
.caldayselected{
105 
	background-color: #737FAC;
106 
	color:	#fff;
107 
	font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
108 
	font-size: 11px;
109 
	font-weight: bold;
110 
	text-align: center;
111 
	border: 1px #566188 solid;
112 
	padding: 3px;
113 
	cursor: pointer;
114 
}
115 
.calblanktop {
116 
	background-color: #fff;
117 
	padding: 4px;
118 
}
119 
.calblankbot {
120 
	background-color: #fff;
121 
	padding: 4px;
122 
}
123 
 
124 
 
125 
*/
126 
 
127 
function js_calendar_script($form_name = 'entryform')
128 
{
129 
$CI =& get_instance();
130 
$CI->load->language('calendar');
131 
ob_start();
132 
?>
133 
<script type="text/javascript">
134 
<!--
135 
var form_name	= "<?php echo $form_name; ?>";
136 
var format		= 'us'; // eu or us
137 
var days		= new Array(
138 
					'<?php echo $CI->lang->line('cal_su');?>', // Sunday, short name
139 
					'<?php echo $CI->lang->line('cal_mo');?>', // Monday, short name
140 
					'<?php echo $CI->lang->line('cal_tu');?>', // Tuesday, short name
141 
					'<?php echo $CI->lang->line('cal_wed');?>', // Wednesday, short name
142 
					'<?php echo $CI->lang->line('cal_thu');?>', // Thursday, short name
143 
					'<?php echo $CI->lang->line('cal_fri');?>', // Friday, short name
144 
					'<?php echo $CI->lang->line('cal_sat');?>' // Saturday, short name
145 
				);
146 
var months		= new Array(
147 
					'<?php echo $CI->lang->line('cal_january');?>',
148 
					'<?php echo $CI->lang->line('cal_february');?>',
149 
					'<?php echo $CI->lang->line('cal_march');?>',
150 
					'<?php echo $CI->lang->line('cal_april');?>',
151 
					'<?php echo $CI->lang->line('cal_mayl');?>',
152 
					'<?php echo $CI->lang->line('cal_june');?>',
153 
					'<?php echo $CI->lang->line('cal_july');?>',
154 
					'<?php echo $CI->lang->line('cal_august');?>',
155 
					'<?php echo $CI->lang->line('cal_september');?>',
156 
					'<?php echo $CI->lang->line('cal_october');?>',
157 
					'<?php echo $CI->lang->line('cal_november');?>',
158 
					'<?php echo $CI->lang->line('cal_december');?>'
159 
				);
160 
var last_click	= new Array();
161 
var current_month  = '';
162 
var current_year   = '';
163 
var last_date  = '';
164 
 
165 
function calendar(id, d, highlight, adjusted)
166 
{
167 
	if (adjusted == undefined)
168 
	{
169 
		var d = new Date(d * 1000);
170 
	}
171 
 
172 
	this.id			= id;
173 
	this.highlight	= highlight;
174 
	this.date_obj	= d;
175 
	this.write		= build_calendar;
176 
	this.total_days	= total_days;
177 
	this.month		= d.getMonth();
178 
	this.date		= d.getDate();
179 
	this.day		= d.getDay();
180 
	this.year		= d.getFullYear();
181 
	this.hours		= d.getHours();
182 
	this.minutes	= d.getMinutes();
183 
	this.seconds	= d.getSeconds();
184 
	this.date_str	= date_str;
185 
 
186 
	if (highlight == false)
187 
	{
188 
		this.selected_date = '';
189 
	}
190 
	else
191 
	{
192 
		this.selected_date = this.year + '' + this.month + '' + this.date;
193 
	}
194 
 
195 
	//	Set the "selected date"
196 
	d.setDate(1);
197 
	this.firstDay = d.getDay();
198 
 
199 
	//then reset the date object to the correct date
200 
	d.setDate(this.date);
201 
}
202 
 
203 
//	Build the body of the calendar
204 
function build_calendar()
205 
{
206 
	var str = '';
207 
 
208 
	//	Calendar Heading
209 
 
210 
	str += '<div id="cal' + this.id + '">';
211 
	str += '<table class="calendar" cellspacing="0" cellpadding="0" border="0" >';
212 
	str += '<tr>';
213 
	str += '<td class="calnavleft" onClick="change_month(-1, \'' + this.id + '\')">&lt;&lt;<\/td>';
214 
	str += '<td colspan="5" class="calheading">' + months[this.month] + ' ' + this.year + '<\/td>';
215 
	str += '<td class="calnavright" onClick="change_month(1, \'' + this.id + '\')">&gt;&gt;<\/td>';
216 
	str += '<\/tr>';
217 
 
218 
	//	Day Names
219 
 
220 
	str += '<tr>';
221 
 
222 
	for (i = 0; i < 7; i++)
223 
	{
224 
		str += '<td class="caldayheading">' + days[i] + '<\/td>';
225 
	}
226 
 
227 
	str += '<\/tr>';
228 
 
229 
	//	Day Cells
230 
 
231 
	str += '<tr>';
232 
 
233 
	selDate = (last_date != '') ? last_date : this.date;
234 
 
235 
	for (j = 0; j < 42; j++)
236 
	{
237 
		var displayNum = (j - this.firstDay + 1);
238 
 
239 
		if (j < this.firstDay) // leading empty cells
240 
		{
241 
			str += '<td class="calblanktop">&nbsp;<\/td>';
242 
		}
243 
		else if (displayNum == selDate && this.highlight == true) // Selected date
244 
		{
245 
			str += '<td id="' + this.id +'selected" class="caldayselected" onClick="set_date(this,\'' + this.id + '\')">' + displayNum + '<\/td>';
246 
		}
247 
		else if (displayNum > this.total_days())
248 
		{
249 
			str += '<td class="calblankbot">&nbsp;<\/td>'; // trailing empty cells
250 
		}
251 
		else  // Unselected days
252 
		{
253 
			str += '<td id="" class="caldaycells" onClick="set_date(this,\'' + this.id + '\'); return false;"  onMouseOver="javascript:cell_highlight(this,\'' + displayNum + '\',\'' + this.id + '\');" onMouseOut="javascript:cell_reset(this,\'' + displayNum + '\',\'' + this.id + '\');" >' + displayNum + '<\/td>';
254 
		}
255 
 
256 
		if (j % 7 == 6)
257 
		{
258 
			str += '<\/tr><tr>';
259 
		}
260 
	}
261 
 
262 
	str += '<\/tr>';
263 
	str += '<\/table>';
264 
	str += '<\/div>';
265 
 
266 
	return str;
267 
}
268 
 
269 
//	Total number of days in a month
270 
function total_days()
271 
{
272 
	switch(this.month)
273 
	{
274 
		case 1: // Check for leap year
275 
			if ((  this.date_obj.getFullYear() % 4 == 0
276 
				&& this.date_obj.getFullYear() % 100 != 0)
277 
				|| this.date_obj.getFullYear() % 400 == 0)
278 
				return 29;
279 
			else
280 
				return 28;
281 
		case 3:
282 
			return 30;
283 
		case 5:
284 
			return 30;
285 
		case 8:
286 
			return 30;
287 
		case 10:
288 
			return 30
289 
		default:
290 
			return 31;
291 
	}
292 
}
293 
 
294 
//	Highlight Cell on Mouseover
295 
function cell_highlight(td, num, cal)
296 
{
297 
	cal = eval(cal);
298 
 
299 
	if (last_click[cal.id]  != num)
300 
	{
301 
		td.className = "caldaycellhover";
302 
	}
303 
}
304 
 
305 
//	Reset Cell on MouseOut
306 
function cell_reset(td, num, cal)
307 
{
308 
	cal = eval(cal);
309 
 
310 
	if (last_click[cal.id] == num)
311 
	{
312 
		td.className = "caldayselected";
313 
	}
314 
	else
315 
	{
316 
		td.className = "caldaycells";
317 
	}
318 
}
319 
 
320 
//	Clear Field
321 
function clear_field(id)
322 
{
323 
	eval("document." + form_name + "." + id + ".value = ''");
324 
 
325 
	document.getElementById(id + "selected").className = "caldaycells";
326 
	document.getElementById(id + "selected").id = "";
327 
 
328 
	cal = eval(id);
329 
	cal.selected_date = '';
330 
}
331 
 
332 
 
333 
//	Set date to specified time
334 
function set_to_time(id, raw)
335 
{
336 
	if (document.getElementById(id + "selected"))
337 
	{
338 
		document.getElementById(id + "selected").className = "caldaycells";
339 
		document.getElementById(id + "selected").id = "";
340 
	}
341 
 
342 
	document.getElementById('cal' + id).innerHTML = '<div id="tempcal'+id+'">&nbsp;<'+'/div>';
343 
 
344 
	var nowDate = new Date();
345 
	nowDate.setTime = raw * 1000;
346 
 
347 
	current_month	= nowDate.getMonth();
348 
	current_year	= nowDate.getFullYear();
349 
	current_date	= nowDate.getDate();
350 
 
351 
	oldcal = eval(id);
352 
	oldcal.selected_date = current_year + '' + current_month + '' + current_date;
353 
 
354 
	cal = new calendar(id, nowDate, true, true);
355 
	cal.selected_date = current_year + '' + current_month + '' + current_date;
356 
 
357 
	last_date = cal.date;
358 
 
359 
	document.getElementById('tempcal'+id).innerHTML = cal.write();
360 
 
361 
	insert_date(cal);
362 
}
363 
 
364 
//	Set date to what is in the field
365 
var lastDates = new Array();
366 
 
367 
function update_calendar(id, dateValue)
368 
{
369 
	if (lastDates[id] == dateValue) return;
370 
 
371 
	lastDates[id] = dateValue;
372 
 
373 
	var fieldString = dateValue.replace(/\s+/g, ' ');
374 
 
375 
	while (fieldString.substring(0,1) == ' ')
376 
	{
377 
		fieldString = fieldString.substring(1, fieldString.length);
378 
	}
379 
 
380 
	var dateString = fieldString.split(' ');
381 
	var dateParts = dateString[0].split('-')
382 
 
383 
	if (dateParts.length < 3) return;
384 
	var newYear  = dateParts[0];
385 
	var newMonth = dateParts[1];
386 
	var newDay   = dateParts[2];
387 
 
388 
	if (isNaN(newDay)  || newDay < 1 || (newDay.length != 1 && newDay.length != 2)) return;
389 
	if (isNaN(newYear) || newYear < 1 || newYear.length != 4) return;
390 
	if (isNaN(newMonth) || newMonth < 1 || (newMonth.length != 1 && newMonth.length != 2)) return;
391 
 
392 
	if (newMonth > 12) newMonth = 12;
393 
 
394 
	if (newDay > 28)
395 
	{
396 
		switch(newMonth - 1)
397 
		{
398 
			case 1: // Check for leap year
399 
				if ((newYear % 4 == 0 && newYear % 100 != 0) || newYear % 400 == 0)
400 
				{
401 
					if (newDay > 29) newDay = 29;
402 
				}
403 
				else
404 
				{
405 
					if (newDay > 28) newDay = 28;
406 
				}
407 
			case 3:
408 
				if (newDay > 30) newDay = 30;
409 
			case 5:
410 
				if (newDay > 30) newDay = 30;
411 
			case 8:
412 
				if (newDay > 30) newDay = 30;
413 
			case 10:
414 
				if (newDay > 30) newDay = 30;
415 
			default:
416 
				if (newDay > 31) newDay = 31;
417 
		}
418 
	}
419 
 
420 
	if (document.getElementById(id + "selected"))
421 
	{
422 
		document.getElementById(id + "selected").className = "caldaycells";
423 
		document.getElementById(id + "selected").id = "";
424 
	}
425 
 
426 
	document.getElementById('cal' + id).innerHTML = '<div id="tempcal'+id+'">&nbsp;<'+'/div>';
427 
 
428 
	var nowDate = new Date();
429 
	nowDate.setDate(newDay);
430 
	nowDate.setMonth(newMonth - 1);
431 
	nowDate.setYear(newYear);
432 
	nowDate.setHours(12);
433 
 
434 
	current_month	= nowDate.getMonth();
435 
	current_year	= nowDate.getFullYear();
436 
 
437 
	cal = new calendar(id, nowDate, true, true);
438 
	document.getElementById('tempcal'+id).innerHTML = cal.write();
439 
}
440 
 
441 
//	Set the date
442 
function set_date(td, cal)
443 
{
444 
 
445 
	cal = eval(cal);
446 
 
447 
	// If the user is clicking a cell that is already
448 
	// selected we'll de-select it and clear the form field
449 
 
450 
	if (last_click[cal.id] == td.firstChild.nodeValue)
451 
	{
452 
		td.className = "caldaycells";
453 
		last_click[cal.id] = '';
454 
		remove_date(cal);
455 
		cal.selected_date =  '';
456 
		return;
457 
	}
458 
 
459 
	// Onward!
460 
	if (document.getElementById(cal.id + "selected"))
461 
	{
462 
		document.getElementById(cal.id + "selected").className = "caldaycells";
463 
		document.getElementById(cal.id + "selected").id = "";
464 
	}
465 
 
466 
	td.className = "caldayselected";
467 
	td.id = cal.id + "selected";
468 
 
469 
	cal.selected_date = cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
470 
	cal.date_obj.setDate(td.firstChild.nodeValue);
471 
	cal = new calendar(cal.id, cal.date_obj, true, true);
472 
	cal.selected_date = cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
473 
 
474 
	last_date = cal.date;
475 
 
476 
	//cal.date
477 
	last_click[cal.id] = cal.date;
478 
 
479 
	// Insert the date into the form
480 
	insert_date(cal);
481 
}
482 
/*
483 
//	Insert the date into the form field
484 
function insert_date(cal)
485 
{
486 
	cal = eval(cal);
487 
	fval = eval("document." + form_name + "." + cal.id);
488 
 
489 
	if (fval.value == '')
490 
	{
491 
		fval.value = cal.date_str('y');
492 
	}
493 
	else
494 
	{
495 
		time = fval.value.substring(10);
496 
		new_date = cal.date_str('n') + time;
497 
		fval.value = new_date;
498 
	}
499 
}
500 
*/
501 
//	Remove the date from the form field
502 
function remove_date(cal)
503 
{
504 
	cal = eval(cal);
505 
	fval = eval("document." + form_name + "." + cal.id);
506 
	fval.value = '';
507 
}
508 
 
509 
//	Change to a new month
510 
function change_month(mo, cal)
511 
{
512 
	cal = eval(cal);
513 
 
514 
	if (current_month != '')
515 
	{
516 
		cal.date_obj.setMonth(current_month);
517 
		cal.date_obj.setYear(current_year);
518 
 
519 
		current_month	= '';
520 
		current_year	= '';
521 
	}
522 
 
523 
	var newMonth = cal.date_obj.getMonth() + mo;
524 
	var newDate  = cal.date_obj.getDate();
525 
 
526 
	if (newMonth == 12)
527 
	{
528 
		cal.date_obj.setYear(cal.date_obj.getFullYear() + 1)
529 
		newMonth = 0;
530 
	}
531 
	else if (newMonth == -1)
532 
	{
533 
		cal.date_obj.setYear(cal.date_obj.getFullYear() - 1)
534 
		newMonth = 11;
535 
	}
536 
 
537 
	if (newDate > 28)
538 
	{
539 
		var newYear = cal.date_obj.getFullYear();
540 
 
541 
		switch(newMonth)
542 
		{
543 
			case 1: // Check for leap year
544 
				if ((newYear % 4 == 0 && newYear % 100 != 0) || newYear % 400 == 0)
545 
				{
546 
					if (newDate > 29) newDate = 29;
547 
				}
548 
				else
549 
				{
550 
					if (newDate > 28) newDate = 28;
551 
				}
552 
			case 3:
553 
				if (newDate > 30) newDate = 30;
554 
			case 5:
555 
				if (newDate > 30) newDate = 30;
556 
			case 8:
557 
				if (newDate > 30) newDate = 30;
558 
			case 10:
559 
				if (newDate > 30) newDate = 30;
560 
			default:
561 
				if (newDate > 31) newDate = 31;
562 
		}
563 
	}
564 
 
565 
	cal.date_obj.setDate(newDate);
566 
	cal.date_obj.setMonth(newMonth);
567 
	new_mdy	= cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
568 
 
569 
	highlight = (cal.selected_date == new_mdy) ? true : false;
570 
	cal = new calendar(cal.id, cal.date_obj, highlight, true);
571 
	document.getElementById('cal' + cal.id).innerHTML = cal.write();
572 
}
573 
 
574 
//	Finalize the date string
575 
function date_str(time)
576 
{
577 
	var month = this.month + 1;
578 
	if (month < 10)
579 
		month = '0' + month;
580 
 
581 
	var day		= (this.date  < 10) 	?  '0' + this.date		: this.date;
582 
	var minutes	= (this.minutes  < 10)	?  '0' + this.minutes	: this.minutes;
583 
 
584 
	if (format == 'us')
585 
	{
586 
		var hours	= (this.hours > 12) ? this.hours - 12 : this.hours;
587 
		var ampm	= (this.hours > 11) ? 'PM' : 'AM'
588 
	}
589 
	else
590 
	{
591 
		var hours	= this.hours;
592 
		var ampm	= '';
593 
	}
594 
 
595 
	if (time == 'y')
596 
	{
597 
		return this.year + '-' + month + '-' + day + '  ' + hours + ':' + minutes + ' ' + ampm;
598 
	}
599 
	else
600 
	{
601 
		return this.year + '-' + month + '-' + day;
602 
	}
603 
}
604 
 
605 
//-->
606 
</script>
607 
<?php
608 
 
609 
$r = ob_get_contents();
610 
ob_end_clean();
611 
return $r;
612 
}
613 
 
614 
 
615 
function js_calendar_write($field_id, $time = '', $highlight = TRUE)
616 
{
617 
	if ($time == '')
618 
		$time = time();
619 
 
620 
	return
621 
	'<script type="text/javascript">
622 
		var '.$field_id.' = new calendar("'.$field_id.'", '.$time.', '.(($highlight == TRUE) ? 'true' : 'false').');
623 
		document.write('.$field_id.'.write());
624 
	</script>';
625 
}
626 
 
627 
 
628 
/* End of file js_calendar_pi.php */
629 
/* Location: ./system/plugins/js_calendar_pi.php */