629 lines
15 KiB
PHP
629 lines
15 KiB
PHP
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
|
|
/**
|
|
* CodeIgniter
|
|
*
|
|
* An open source application development framework for PHP 4.3.2 or newer
|
|
*
|
|
* @package CodeIgniter
|
|
* @author ExpressionEngine Dev Team
|
|
* @copyright Copyright (c) 2008 - 2010, EllisLab, Inc.
|
|
* @license http://codeigniter.com/user_guide/license.html
|
|
* @link http://codeigniter.com
|
|
* @since Version 1.0
|
|
* @filesource
|
|
*/
|
|
|
|
// ------------------------------------------------------------------------
|
|
|
|
/*
|
|
Instructions:
|
|
|
|
Load the plugin using:
|
|
|
|
$this->load->plugin('js_calendar');
|
|
|
|
Once loaded you'll add the calendar script to the <head> of your page like this:
|
|
|
|
<?php echo js_calendar_script('my_form'); ?>
|
|
|
|
The above function will be passed the name of your form.
|
|
|
|
Then to show the actual calendar you'll do this:
|
|
|
|
<?php echo js_calendar_write('entry_date', time(), true);?>
|
|
<form name="my_form">
|
|
<input type="text" name="entry_date" value="" onblur="update_calendar(this.name, this.value);" />
|
|
<p><a href="javascript:void(0);" onClick="set_to_time('entry_date', '<?php echo time();?>')" >Today</a></p>
|
|
</form>
|
|
|
|
|
|
Note: The first parameter is the name of the field containing your date, the second parameter contains the "now" time,
|
|
and the third tells the calendar whether to highlight the current day or not.
|
|
|
|
Lastly, you'll need some CSS for your calendar:
|
|
|
|
.calendar {
|
|
border: 1px #6975A3 solid;
|
|
background-color: transparent;
|
|
}
|
|
.calheading {
|
|
background-color: #7C8BC0;
|
|
color: #fff;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
.calnavleft {
|
|
background-color: #7C8BC0;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
padding: 4px;
|
|
cursor: pointer;
|
|
}
|
|
.calnavright {
|
|
background-color: #7C8BC0;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
color: #fff;
|
|
text-align: right;
|
|
padding: 4px;
|
|
cursor: pointer;
|
|
}
|
|
.caldayheading {
|
|
background-color: #000;
|
|
color: #fff;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 10px;
|
|
text-align: center;
|
|
padding: 6px 2px 6px 2px;
|
|
}
|
|
.caldaycells{
|
|
color: #000;
|
|
background-color: #D1D7E6;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 11px;
|
|
text-align: center;
|
|
padding: 4px;
|
|
border: 1px #E0E5F1 solid;
|
|
cursor: pointer;
|
|
}
|
|
.caldaycellhover{
|
|
color: #fff;
|
|
background-color: #B3BCD4;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 11px;
|
|
text-align: center;
|
|
padding: 4px;
|
|
border: 1px #B3BCD4 solid;
|
|
cursor: pointer;
|
|
}
|
|
.caldayselected{
|
|
background-color: #737FAC;
|
|
color: #fff;
|
|
font-family: Lucida Grande, Verdana, Geneva, Sans-serif;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
border: 1px #566188 solid;
|
|
padding: 3px;
|
|
cursor: pointer;
|
|
}
|
|
.calblanktop {
|
|
background-color: #fff;
|
|
padding: 4px;
|
|
}
|
|
.calblankbot {
|
|
background-color: #fff;
|
|
padding: 4px;
|
|
}
|
|
|
|
|
|
*/
|
|
|
|
function js_calendar_script($form_name = 'entryform')
|
|
{
|
|
$CI =& get_instance();
|
|
$CI->load->language('calendar');
|
|
ob_start();
|
|
?>
|
|
<script type="text/javascript">
|
|
<!--
|
|
var form_name = "<?php echo $form_name; ?>";
|
|
var format = 'us'; // eu or us
|
|
var days = new Array(
|
|
'<?php echo $CI->lang->line('cal_su');?>', // Sunday, short name
|
|
'<?php echo $CI->lang->line('cal_mo');?>', // Monday, short name
|
|
'<?php echo $CI->lang->line('cal_tu');?>', // Tuesday, short name
|
|
'<?php echo $CI->lang->line('cal_wed');?>', // Wednesday, short name
|
|
'<?php echo $CI->lang->line('cal_thu');?>', // Thursday, short name
|
|
'<?php echo $CI->lang->line('cal_fri');?>', // Friday, short name
|
|
'<?php echo $CI->lang->line('cal_sat');?>' // Saturday, short name
|
|
);
|
|
var months = new Array(
|
|
'<?php echo $CI->lang->line('cal_january');?>',
|
|
'<?php echo $CI->lang->line('cal_february');?>',
|
|
'<?php echo $CI->lang->line('cal_march');?>',
|
|
'<?php echo $CI->lang->line('cal_april');?>',
|
|
'<?php echo $CI->lang->line('cal_mayl');?>',
|
|
'<?php echo $CI->lang->line('cal_june');?>',
|
|
'<?php echo $CI->lang->line('cal_july');?>',
|
|
'<?php echo $CI->lang->line('cal_august');?>',
|
|
'<?php echo $CI->lang->line('cal_september');?>',
|
|
'<?php echo $CI->lang->line('cal_october');?>',
|
|
'<?php echo $CI->lang->line('cal_november');?>',
|
|
'<?php echo $CI->lang->line('cal_december');?>'
|
|
);
|
|
var last_click = new Array();
|
|
var current_month = '';
|
|
var current_year = '';
|
|
var last_date = '';
|
|
|
|
function calendar(id, d, highlight, adjusted)
|
|
{
|
|
if (adjusted == undefined)
|
|
{
|
|
var d = new Date(d * 1000);
|
|
}
|
|
|
|
this.id = id;
|
|
this.highlight = highlight;
|
|
this.date_obj = d;
|
|
this.write = build_calendar;
|
|
this.total_days = total_days;
|
|
this.month = d.getMonth();
|
|
this.date = d.getDate();
|
|
this.day = d.getDay();
|
|
this.year = d.getFullYear();
|
|
this.hours = d.getHours();
|
|
this.minutes = d.getMinutes();
|
|
this.seconds = d.getSeconds();
|
|
this.date_str = date_str;
|
|
|
|
if (highlight == false)
|
|
{
|
|
this.selected_date = '';
|
|
}
|
|
else
|
|
{
|
|
this.selected_date = this.year + '' + this.month + '' + this.date;
|
|
}
|
|
|
|
// Set the "selected date"
|
|
d.setDate(1);
|
|
this.firstDay = d.getDay();
|
|
|
|
//then reset the date object to the correct date
|
|
d.setDate(this.date);
|
|
}
|
|
|
|
// Build the body of the calendar
|
|
function build_calendar()
|
|
{
|
|
var str = '';
|
|
|
|
// Calendar Heading
|
|
|
|
str += '<div id="cal' + this.id + '">';
|
|
str += '<table class="calendar" cellspacing="0" cellpadding="0" border="0" >';
|
|
str += '<tr>';
|
|
str += '<td class="calnavleft" onClick="change_month(-1, \'' + this.id + '\')"><<<\/td>';
|
|
str += '<td colspan="5" class="calheading">' + months[this.month] + ' ' + this.year + '<\/td>';
|
|
str += '<td class="calnavright" onClick="change_month(1, \'' + this.id + '\')">>><\/td>';
|
|
str += '<\/tr>';
|
|
|
|
// Day Names
|
|
|
|
str += '<tr>';
|
|
|
|
for (i = 0; i < 7; i++)
|
|
{
|
|
str += '<td class="caldayheading">' + days[i] + '<\/td>';
|
|
}
|
|
|
|
str += '<\/tr>';
|
|
|
|
// Day Cells
|
|
|
|
str += '<tr>';
|
|
|
|
selDate = (last_date != '') ? last_date : this.date;
|
|
|
|
for (j = 0; j < 42; j++)
|
|
{
|
|
var displayNum = (j - this.firstDay + 1);
|
|
|
|
if (j < this.firstDay) // leading empty cells
|
|
{
|
|
str += '<td class="calblanktop"> <\/td>';
|
|
}
|
|
else if (displayNum == selDate && this.highlight == true) // Selected date
|
|
{
|
|
str += '<td id="' + this.id +'selected" class="caldayselected" onClick="set_date(this,\'' + this.id + '\')">' + displayNum + '<\/td>';
|
|
}
|
|
else if (displayNum > this.total_days())
|
|
{
|
|
str += '<td class="calblankbot"> <\/td>'; // trailing empty cells
|
|
}
|
|
else // Unselected days
|
|
{
|
|
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>';
|
|
}
|
|
|
|
if (j % 7 == 6)
|
|
{
|
|
str += '<\/tr><tr>';
|
|
}
|
|
}
|
|
|
|
str += '<\/tr>';
|
|
str += '<\/table>';
|
|
str += '<\/div>';
|
|
|
|
return str;
|
|
}
|
|
|
|
// Total number of days in a month
|
|
function total_days()
|
|
{
|
|
switch(this.month)
|
|
{
|
|
case 1: // Check for leap year
|
|
if (( this.date_obj.getFullYear() % 4 == 0
|
|
&& this.date_obj.getFullYear() % 100 != 0)
|
|
|| this.date_obj.getFullYear() % 400 == 0)
|
|
return 29;
|
|
else
|
|
return 28;
|
|
case 3:
|
|
return 30;
|
|
case 5:
|
|
return 30;
|
|
case 8:
|
|
return 30;
|
|
case 10:
|
|
return 30
|
|
default:
|
|
return 31;
|
|
}
|
|
}
|
|
|
|
// Highlight Cell on Mouseover
|
|
function cell_highlight(td, num, cal)
|
|
{
|
|
cal = eval(cal);
|
|
|
|
if (last_click[cal.id] != num)
|
|
{
|
|
td.className = "caldaycellhover";
|
|
}
|
|
}
|
|
|
|
// Reset Cell on MouseOut
|
|
function cell_reset(td, num, cal)
|
|
{
|
|
cal = eval(cal);
|
|
|
|
if (last_click[cal.id] == num)
|
|
{
|
|
td.className = "caldayselected";
|
|
}
|
|
else
|
|
{
|
|
td.className = "caldaycells";
|
|
}
|
|
}
|
|
|
|
// Clear Field
|
|
function clear_field(id)
|
|
{
|
|
eval("document." + form_name + "." + id + ".value = ''");
|
|
|
|
document.getElementById(id + "selected").className = "caldaycells";
|
|
document.getElementById(id + "selected").id = "";
|
|
|
|
cal = eval(id);
|
|
cal.selected_date = '';
|
|
}
|
|
|
|
|
|
// Set date to specified time
|
|
function set_to_time(id, raw)
|
|
{
|
|
if (document.getElementById(id + "selected"))
|
|
{
|
|
document.getElementById(id + "selected").className = "caldaycells";
|
|
document.getElementById(id + "selected").id = "";
|
|
}
|
|
|
|
document.getElementById('cal' + id).innerHTML = '<div id="tempcal'+id+'"> <'+'/div>';
|
|
|
|
var nowDate = new Date();
|
|
nowDate.setTime = raw * 1000;
|
|
|
|
current_month = nowDate.getMonth();
|
|
current_year = nowDate.getFullYear();
|
|
current_date = nowDate.getDate();
|
|
|
|
oldcal = eval(id);
|
|
oldcal.selected_date = current_year + '' + current_month + '' + current_date;
|
|
|
|
cal = new calendar(id, nowDate, true, true);
|
|
cal.selected_date = current_year + '' + current_month + '' + current_date;
|
|
|
|
last_date = cal.date;
|
|
|
|
document.getElementById('tempcal'+id).innerHTML = cal.write();
|
|
|
|
insert_date(cal);
|
|
}
|
|
|
|
// Set date to what is in the field
|
|
var lastDates = new Array();
|
|
|
|
function update_calendar(id, dateValue)
|
|
{
|
|
if (lastDates[id] == dateValue) return;
|
|
|
|
lastDates[id] = dateValue;
|
|
|
|
var fieldString = dateValue.replace(/\s+/g, ' ');
|
|
|
|
while (fieldString.substring(0,1) == ' ')
|
|
{
|
|
fieldString = fieldString.substring(1, fieldString.length);
|
|
}
|
|
|
|
var dateString = fieldString.split(' ');
|
|
var dateParts = dateString[0].split('-')
|
|
|
|
if (dateParts.length < 3) return;
|
|
var newYear = dateParts[0];
|
|
var newMonth = dateParts[1];
|
|
var newDay = dateParts[2];
|
|
|
|
if (isNaN(newDay) || newDay < 1 || (newDay.length != 1 && newDay.length != 2)) return;
|
|
if (isNaN(newYear) || newYear < 1 || newYear.length != 4) return;
|
|
if (isNaN(newMonth) || newMonth < 1 || (newMonth.length != 1 && newMonth.length != 2)) return;
|
|
|
|
if (newMonth > 12) newMonth = 12;
|
|
|
|
if (newDay > 28)
|
|
{
|
|
switch(newMonth - 1)
|
|
{
|
|
case 1: // Check for leap year
|
|
if ((newYear % 4 == 0 && newYear % 100 != 0) || newYear % 400 == 0)
|
|
{
|
|
if (newDay > 29) newDay = 29;
|
|
}
|
|
else
|
|
{
|
|
if (newDay > 28) newDay = 28;
|
|
}
|
|
case 3:
|
|
if (newDay > 30) newDay = 30;
|
|
case 5:
|
|
if (newDay > 30) newDay = 30;
|
|
case 8:
|
|
if (newDay > 30) newDay = 30;
|
|
case 10:
|
|
if (newDay > 30) newDay = 30;
|
|
default:
|
|
if (newDay > 31) newDay = 31;
|
|
}
|
|
}
|
|
|
|
if (document.getElementById(id + "selected"))
|
|
{
|
|
document.getElementById(id + "selected").className = "caldaycells";
|
|
document.getElementById(id + "selected").id = "";
|
|
}
|
|
|
|
document.getElementById('cal' + id).innerHTML = '<div id="tempcal'+id+'"> <'+'/div>';
|
|
|
|
var nowDate = new Date();
|
|
nowDate.setDate(newDay);
|
|
nowDate.setMonth(newMonth - 1);
|
|
nowDate.setYear(newYear);
|
|
nowDate.setHours(12);
|
|
|
|
current_month = nowDate.getMonth();
|
|
current_year = nowDate.getFullYear();
|
|
|
|
cal = new calendar(id, nowDate, true, true);
|
|
document.getElementById('tempcal'+id).innerHTML = cal.write();
|
|
}
|
|
|
|
// Set the date
|
|
function set_date(td, cal)
|
|
{
|
|
|
|
cal = eval(cal);
|
|
|
|
// If the user is clicking a cell that is already
|
|
// selected we'll de-select it and clear the form field
|
|
|
|
if (last_click[cal.id] == td.firstChild.nodeValue)
|
|
{
|
|
td.className = "caldaycells";
|
|
last_click[cal.id] = '';
|
|
remove_date(cal);
|
|
cal.selected_date = '';
|
|
return;
|
|
}
|
|
|
|
// Onward!
|
|
if (document.getElementById(cal.id + "selected"))
|
|
{
|
|
document.getElementById(cal.id + "selected").className = "caldaycells";
|
|
document.getElementById(cal.id + "selected").id = "";
|
|
}
|
|
|
|
td.className = "caldayselected";
|
|
td.id = cal.id + "selected";
|
|
|
|
cal.selected_date = cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
|
|
cal.date_obj.setDate(td.firstChild.nodeValue);
|
|
cal = new calendar(cal.id, cal.date_obj, true, true);
|
|
cal.selected_date = cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
|
|
|
|
last_date = cal.date;
|
|
|
|
//cal.date
|
|
last_click[cal.id] = cal.date;
|
|
|
|
// Insert the date into the form
|
|
insert_date(cal);
|
|
}
|
|
/*
|
|
// Insert the date into the form field
|
|
function insert_date(cal)
|
|
{
|
|
cal = eval(cal);
|
|
fval = eval("document." + form_name + "." + cal.id);
|
|
|
|
if (fval.value == '')
|
|
{
|
|
fval.value = cal.date_str('y');
|
|
}
|
|
else
|
|
{
|
|
time = fval.value.substring(10);
|
|
new_date = cal.date_str('n') + time;
|
|
fval.value = new_date;
|
|
}
|
|
}
|
|
*/
|
|
// Remove the date from the form field
|
|
function remove_date(cal)
|
|
{
|
|
cal = eval(cal);
|
|
fval = eval("document." + form_name + "." + cal.id);
|
|
fval.value = '';
|
|
}
|
|
|
|
// Change to a new month
|
|
function change_month(mo, cal)
|
|
{
|
|
cal = eval(cal);
|
|
|
|
if (current_month != '')
|
|
{
|
|
cal.date_obj.setMonth(current_month);
|
|
cal.date_obj.setYear(current_year);
|
|
|
|
current_month = '';
|
|
current_year = '';
|
|
}
|
|
|
|
var newMonth = cal.date_obj.getMonth() + mo;
|
|
var newDate = cal.date_obj.getDate();
|
|
|
|
if (newMonth == 12)
|
|
{
|
|
cal.date_obj.setYear(cal.date_obj.getFullYear() + 1)
|
|
newMonth = 0;
|
|
}
|
|
else if (newMonth == -1)
|
|
{
|
|
cal.date_obj.setYear(cal.date_obj.getFullYear() - 1)
|
|
newMonth = 11;
|
|
}
|
|
|
|
if (newDate > 28)
|
|
{
|
|
var newYear = cal.date_obj.getFullYear();
|
|
|
|
switch(newMonth)
|
|
{
|
|
case 1: // Check for leap year
|
|
if ((newYear % 4 == 0 && newYear % 100 != 0) || newYear % 400 == 0)
|
|
{
|
|
if (newDate > 29) newDate = 29;
|
|
}
|
|
else
|
|
{
|
|
if (newDate > 28) newDate = 28;
|
|
}
|
|
case 3:
|
|
if (newDate > 30) newDate = 30;
|
|
case 5:
|
|
if (newDate > 30) newDate = 30;
|
|
case 8:
|
|
if (newDate > 30) newDate = 30;
|
|
case 10:
|
|
if (newDate > 30) newDate = 30;
|
|
default:
|
|
if (newDate > 31) newDate = 31;
|
|
}
|
|
}
|
|
|
|
cal.date_obj.setDate(newDate);
|
|
cal.date_obj.setMonth(newMonth);
|
|
new_mdy = cal.date_obj.getFullYear() + '' + cal.date_obj.getMonth() + '' + cal.date;
|
|
|
|
highlight = (cal.selected_date == new_mdy) ? true : false;
|
|
cal = new calendar(cal.id, cal.date_obj, highlight, true);
|
|
document.getElementById('cal' + cal.id).innerHTML = cal.write();
|
|
}
|
|
|
|
// Finalize the date string
|
|
function date_str(time)
|
|
{
|
|
var month = this.month + 1;
|
|
if (month < 10)
|
|
month = '0' + month;
|
|
|
|
var day = (this.date < 10) ? '0' + this.date : this.date;
|
|
var minutes = (this.minutes < 10) ? '0' + this.minutes : this.minutes;
|
|
|
|
if (format == 'us')
|
|
{
|
|
var hours = (this.hours > 12) ? this.hours - 12 : this.hours;
|
|
var ampm = (this.hours > 11) ? 'PM' : 'AM'
|
|
}
|
|
else
|
|
{
|
|
var hours = this.hours;
|
|
var ampm = '';
|
|
}
|
|
|
|
if (time == 'y')
|
|
{
|
|
return this.year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ' ' + ampm;
|
|
}
|
|
else
|
|
{
|
|
return this.year + '-' + month + '-' + day;
|
|
}
|
|
}
|
|
|
|
//-->
|
|
</script>
|
|
<?php
|
|
|
|
$r = ob_get_contents();
|
|
ob_end_clean();
|
|
return $r;
|
|
}
|
|
|
|
|
|
function js_calendar_write($field_id, $time = '', $highlight = TRUE)
|
|
{
|
|
if ($time == '')
|
|
$time = time();
|
|
|
|
return
|
|
'<script type="text/javascript">
|
|
var '.$field_id.' = new calendar("'.$field_id.'", '.$time.', '.(($highlight == TRUE) ? 'true' : 'false').');
|
|
document.write('.$field_id.'.write());
|
|
</script>';
|
|
}
|
|
|
|
|
|
/* End of file js_calendar_pi.php */
|
|
/* Location: ./system/plugins/js_calendar_pi.php */
|