/***********************************************************************
 * FILE: jquery.ptTimeSelect.js
 * 
 * 		jQuery plug in for displaying a popup that allows a user
 * 		to define a time and set that time back to a form's input
 * 		field.
 * 
 * 
 * AUTHOR:
 * 
 * 		*Paul T.*
 * 
 * 		- <http://www.purtuga.com>
 * 		- <http://pttimeselect.sourceforge.net>
 * 
 * 
 * DEPENDECIES:
 * 
 * 		-	jQuery.js
 * 			<http://docs.jquery.com/Downloading_jQuery>
 * 
 * 		- 	dimensions.js
 * 			<http://docs.jquery.com/Plugins>
 * 
 * 
 * LICENSE:
 * 
 * 		Copyright (c) 2007 Paul T. (purtuga.com)
 *		Dual licensed under the:
 *
 * 		-	MIT
 * 			<http://www.opensource.org/licenses/mit-license.php>
 * 
 * 		-	GPL
 * 			<http://www.opensource.org/licenses/gpl-license.php>
 * 
 * INSTALLATION:
 * 
 * 		This file <jquery.ptTimeSelect.js> is the only one required.
 * 		To install, simply copy it to the same directory as jquery.js
 * 		and include it in the html pages requiring it's functionality.
 * 
 * 
 * USAGE:
 * 
 * 		Usage of this plugin is via the <$(ele).ptTimeSelect()> method.
 * 		all others are internal to this plugin.
 * 
 * 		The default apperance can be controled by changing the value
 * 		in <jQuery.ptTimeSelect.html>
 * 
 * 
 * 
 * LAST UPDATED:
 * 
 * 		- $Date: 2007/05/16 20:50:57 $
 * 		- $Author: paulinho4u $
 * 		- $Revision: 1.1 $
 * 
 * 
 **********************************************************************/

/***********************************************************************
 * METHOD: jQuery.ptTimeSelectInit()
 * 		Internal method. Called when page is initalized to add the time
 * 		selection area to the DOM.
 * 
 * PARAMS:
 * 
 * 		none.
 * 
 * RETURNS:
 * 
 * 		nothing.
 * 
 * 
 */
jQuery.ptTimeSelectInit = function () {
	jQuery(document).ready(
		function () {
			//if the html is not yet created in the document, then do it now
			if (!jQuery('#ptTimeSelectCntr').length) {
				
				jQuery("body").append(
					  ' <div id="ptTimeSelectCntr" class="ui-timepicker-standalone" style="display: none; z-index: 9999; left: 10px; top: 10px; position: absolute;">'
					+ '<div class="ui-timepicker-header">'
					+ '<div id="ptTimeSelectUserTime" class="ui-timepicker-selecteddate"> <span id="ptTimeSelectUserSelHr">1</span>:<span id="ptTimeSelectUserSelMin">00</span> <span id="ptTimeSelectUserSelAmPm">AM</span> </div>'
					+ '<div id="ptTimeSelectSetButton" class="ui-timepicker-set"> <a onclick="jQuery.ptTimeSelect.setTime()" href="javascript:void(0);">Select</a> </div>'
					+ '</div>'
					+ '<div class="ui-timepicker-table">'
					+ '<table id="ptTimeSelectTbl" class="ui-timepicker" width="100%" border="0" cellpadding="0" cellspacing="0">'
					+ '<thead>'
					+ '<tr align="center" valign="top" >'
					+ '<th id="ptTimeSelectHrLabel" colspan="3" class="ui-timepicker-hour">Hour</th>'
					+ '<th id="ptTimeSelectMinLabel" colspan="3" class="ui-timepicker-minute">Minutes</th>'
					+ '<th colspan="3">&nbsp;</th>'
					+ '</tr>'
					+ '<thead>'
					+ '<tbody>'
					+ '<tr align="center" valign="top">'
					+ '<td width="14%"><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">1</a></td>'
					+ '<td width="14%"><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">5</a></td>'
					+ '<td width="14%"><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">9</a></td>'
					+ '<td width="14%"><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">00</a></td>'
					+ '<td width="14%"><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">20</a></td>'
					+ '<td width="14%"><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">40</a></td>'
					+ '<td width="16%" valign="middle" class="ui-timepicker-timeofday" align="center" rowspan="2"><a href="javascript:void(0);" class="ptTimeSelectTd ui-timepicker-timeofday" style="display: block;">AM</a></td>'
					+ '</tr>'
					+ '<tr align="center" valign="top">'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">2</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">6</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">10</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">05</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">25</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">45</a></td>'
					+ '</tr>'
					+ '<tr align="center" valign="top">'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">3</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">7</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">11</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">10</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">30</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">50</a></td>'
					+ '<td valign="middle" class="ui-timepicker-timeofday" align="center" rowspan="2"><a href="javascript:void(0);" class="ptTimeSelectTd ui-timepicker-timeofday" style="display: block;">PM</a></td>'
					+ '</tr>'
					+ '<tr align="center" valign="top">'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour " href="javascript: void(0);">4</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">8</a></td>'
					+ '<td><a class="ptTimeSelectHr ui-timepicker-hour" href="javascript: void(0);">12</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">15</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">35</a></td>'
					+ '<td><a class="ptTimeSelectMin ui-timepicker-minute" href="javascript: void(0);">55</a></td>'
					+ '</tr>'
					+ '</tbody>'
					+ '</table>'
					+ '</div>'
					+ '<div class="ui-timepicker-control">'
					+ '<div class="ui-timepicker-clear"><a onClick="jQuery.ptTimeSelect.clearTime();" href="javascript:void(0);">Clear</a></div>'
					+ '<div class="ui-timepicker-close"><a onClick="jQuery.ptTimeSelect.closeCntr();" href="javascript:void(0);">Close</a></div>'
					+ '<!--[if lte IE 6.5]>'
					+ '	<iframe style="display:block; position:absolute;top: 0;left:0;z-index:-1;'
					+ '			filter:Alpha(Opacity=\'0\');width:3000px;height:3000px"></iframe>'
					+ '<![endif]-->'
					+ '</div>'
				);
				
				
				// Set the default width

				
				// Add the events to the functions
				jQuery('.ptTimeSelectMin', jQuery('#ptTimeSelectCntr')).bind("click", function(){ jQuery.ptTimeSelect.setMin($j(this).text()); }).css({display: 'block'});
				jQuery('.ptTimeSelectHr', jQuery('#ptTimeSelectCntr')).bind("click", function(){ jQuery.ptTimeSelect.setHr( $j(this).text() ); }).css({display: 'block'});
				jQuery('.ptTimeSelectTd', jQuery('#ptTimeSelectCntr')).bind("click", function(){ jQuery.ptTimeSelect.setHr( $j(this).text() ); }).css({display: 'block'});
	

				
			}//end if
		}
	);
}(); /* jQuery.ptTimeSelectInit() */

jQuery.ptTimeSelect = {
	_counter: 1,
	_eleOpt: {},
	_curEle:	"",

	html:	{
		bgcolor:		'#EBEAE3',
		border_color:	'#DDDBCB',
		labels: {
				x:			'[Close]',
				popup_link:	'[T]',
				set_time:	'Set Time'
		},
		'cntr_width':	'200px',
		'cntr_class':	''
	},
	
	getLabel: function (lbl, uId) {
		if (!lbl) {return;};
		var self = jQuery.ptTimeSelect;
		if (	self._eleOpt[uId]
			&&	self._eleOpt[uId].labels
			&&	self._eleOpt[uId].labels[lbl]
		) {
			return self._eleOpt[uId].labels[lbl];
		} else {
			return self.html.labels[lbl];
		};
	},
	
	getOpt: function (oName, uId) {
			if (!oName) {return;};
			if (	uId
				&&	this._eleOpt[uId]
				&&	this._eleOpt[uId][oName]
			) {
				return this._eleOpt[uId][oName];
			} else {
				return this.html[oName];
			};
	}, 
	
	setHr:	function(h) {
		if ( h.toLowerCase() == "am" ||	h.toLowerCase() == "pm" ) {
			jQuery('#ptTimeSelectUserSelAmPm').empty().append(h);
		} else {
			jQuery('#ptTimeSelectUserSelHr').empty().append(h);
		}
	},
	
	setMin:	function(m) {
		jQuery('#ptTimeSelectUserSelMin').empty().append(m);	
	},
	
	setTime: function() {
		var tSel = jQuery('#ptTimeSelectUserSelHr').text() + ":" + jQuery('#ptTimeSelectUserSelMin').text() + " " + jQuery('#ptTimeSelectUserSelAmPm').text()
			jQuery(this._curEle).val(tSel);
			this.closeCntr();
	},
	
	clearTime: function() {
		jQuery(this._curEle).val('');
		this.closeCntr();
	},
	
	openCntr:	function (uId) {
		uId = uId;
		uId2= '#' + uId;
		var cntr = jQuery('#ptTimeSelectCntr').hide(0);
		var offset	= jQuery(uId2).offset();
		offset.top	+= jQuery(uId2).height();
		
		if ( jQuery.browser.msie == true ) {
			if ( jQuery.browser.version.substr(0,3) <= "6.0" ) {
				$j('select').css("visibility", "hidden");
			}
		}
		
		if ( jQuery.browser.mozilla == true ) {
			offset.top = offset.top + 22;	
		} else if ( jQuery.browser.webkit == true ) {
			offset.top = offset.top + 20;	
		} else if ( jQuery.browser.msie == true ) {
			offset.top = offset.top + 7;	
		}
		
		// Insure pixels are used
		offset.top	+= "px"
		offset.left	+= "px"
				
		// set the default time.
		jQuery.ptTimeSelect.setHr('12');
		jQuery.ptTimeSelect.setMin('00');
		jQuery.ptTimeSelect.setHr('PM');
				
		// Set the labels
		jQuery('#ptTimeSelectCloseCntr>a', cntr).empty().append(this.getLabel('x', uId));
		jQuery('#ptTimeSelectSetButton>a').empty().append(this.getLabel('set_time' , uId));
		
		// display the popup and store the current element
		cntr.css(offset).slideDown(30);
		jQuery.ptTimeSelect._curEle = jQuery(uId2 + '>input');
		
	},
	
	closeCntr:	function() {
		if ( jQuery.browser.msie == true ) {
			if ( jQuery.browser.version.substr(0,3) <= "6.0" ) {
				$j('select').css("visibility", "visible");
			}
		}
		jQuery('#ptTimeSelectCntr').slideUp(30);
		this._curEle = "";
		return;		
	} 
}

jQuery.fn.ptTimeSelect = function(opt) {
	this.each(function(){
		if(this.nodeName.toLowerCase() != 'input') return;
		
		var uId = 'ptTimeSelect_'  + jQuery.ptTimeSelect._counter;
			jQuery.ptTimeSelect._counter += 1;
		
			if (opt) { jQuery.ptTimeSelect._eleOpt[uId] = opt; }

			jQuery(this).wrap('<div style="display: inline;" id="' + uId + '"></div>' );
			jQuery(this).click( function() { jQuery.ptTimeSelect.openCntr(uId); }); 
			/* */
		
		return this;
	});
};

$j(document).ready(function () {
    $j('input.time').ptTimeSelect();
});