New version 2.0.2

Fixed some bugs
Added example runtime set options
Code become cleaner
This commit is contained in:
Valeriy 2013-12-05 20:42:51 +06:00
parent 7ac1a799e8
commit b551dad1e2
4 changed files with 830 additions and 688 deletions

View File

@ -19,12 +19,17 @@
"input",
"touch"
],
"version": "2.0.1",
"version": "2.0.2",
"author": {
"name": "Chupurnov Valeriy",
"email": "chupurnov@gmail.com",
"url": "http://xdsoft.net/contacts.html"
},
"maintainers": [{
"name": "Chupurnov Valeriy",
"email": "chupurnov@gmail.com",
"url": "http://xdsoft.net"
}],
"licenses": [
{
"type": "MIT",

120
doc.tpl
View File

@ -4,7 +4,6 @@
<p>
Use this plugin to unobtrusively add a datetimepicker, datepicker or timepicker dropdown to your forms. It's easy to customize options. <a href="https://github.com/xdan/datetimepicker">Source code on GitHub</a> or <a href="https://github.com/xdan/datetimepicker/archive/master.zip">download (zip)</a>.
</p>
<?php echo $this->parse('adsense5')?>
<h3>DateTimepicker</h3>
<input type="text" value="2014/03/15 05:06" id="datetimepicker"/><br/>
<h3>Use mask DateTimepicker</h3>
@ -39,7 +38,7 @@ $('#datetimepicker3').datetimepicker({
</p>
<p>
<a class="btn btn-large btn-primary" href="https://github.com/xdan/datetimepicker/archive/master.zip">Download (zip)</a>
</p>
</p><?php echo $this->parse('adsense5')?>
<h2>How do I use it?</h2>
<p>
First include to page css and js files
@ -49,18 +48,22 @@ First include to page css and js files
&lt;script src=&quot;jquery.datetimepicker.js&quot;&gt;&lt;/script&gt;</code></pre>
</p>
<h2>Examples</h2>
<h4>Simple init DateTimePicker Example</h4>
<hr id="Simple"/>
<h4>Simple init DateTimePicker Example <a href="#Simple">#</a></h4>
<p>HTML</p>
<pre><code data-language="html">&lt;input id=&quot;datetimepicker&quot; type=&quot;text&quot; &gt;</code></pre>
<p>JavaScript</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$('#datetimepicker').datetimepicker();</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker" type="text" value="2014/03/15 05:06" /></p>
<script>
$(function(){$('#_datetimepicker').datetimepicker();});
</script>
<h4>i18n DatePicker Example</h4>
<p>JavaScript</p>
<hr id="i18n"/>
<h4>i18n DatePicker Example <a href="#i18n">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker1&#39;).datetimepicker({
lang:&#39;de&#39;,
i18n:{
@ -79,7 +82,7 @@ $(function(){$('#_datetimepicker').datetimepicker();});
timepicker:false,
format:&#39;d.m.Y&#39;
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker1" type="text" value="15.08.2013" /></p>
<script>$(function(){
$('#_datetimepicker1').datetimepicker({
@ -95,13 +98,15 @@ format:'d.m.Y'
});
});
</script>
<h4>Only TimePicker Example</h4>
<p>JavaScript</p>
<hr id="TimePicker"/>
<h4>Only TimePicker Example <a href="#TimePicker">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker2&#39;).datetimepicker({
datepicker:false,
format:&#39;H:i&#39;
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker2" type="text" value="23:16" /></p>
<script>$(function(){
$('#_datetimepicker2').datetimepicker({
@ -110,14 +115,16 @@ $('#_datetimepicker2').datetimepicker({
});
});
</script>
<h4>Inline DateTimePicker Example</h4>
<p>JavaScript</p>
<hr id="Inline"/>
<h4>Inline DateTimePicker Example <a href="#Inline">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker3&#39;).datetimepicker({
format:&#39;d.m.Y H:i&#39;,
inline:true,
lang:&#39;ru&#39;
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker3" type="text" value="10.12.2013 23:45" /></p>
<script>$(function(){
$('#_datetimepicker3').datetimepicker({
@ -127,9 +134,11 @@ $('#_datetimepicker3').datetimepicker({
});
});
</script>
<h4>Icon trigger</h4>
<hr id="trigger"/>
<h4>Icon trigger <a href="#trigger">#</a></h4>
<p>Click the icon next to the input field to show the datetimepicker</p>
<p>JavaScript</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker4&#39;).datetimepicker({
format:&#39;d.m.Y H:i&#39;,
lang:&#39;ru&#39;
@ -138,7 +147,7 @@ and handler onclick event
<pre><code data-language="javascript">$(&#39;#image_button&#39;).click(function(){
$(&#39;#datetimepicker4&#39;).datetimepicker(&#39;show&#39;); //support hide,show and destroy command
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<div class="row">
<div class="col-lg-6">
<div class="input-group">
@ -160,8 +169,10 @@ $('#image_button').click(function(){
});
</script>
<h4>allowTimes options TimePicker Example</h4>
<p>JavaScript</p>
<hr id="allowTimes"/>
<h4>allowTimes options TimePicker Example <a href="#allowTimes">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker5&#39;).datetimepicker({
datepicker:false,
allowTimes:[
@ -169,7 +180,7 @@ $('#image_button').click(function(){
&#39;17:00&#39;, &#39;17:05&#39;, &#39;17:20&#39;, &#39;19:00&#39;, &#39;20:00&#39;
]
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker5" type="text" value="23:45" /></p>
<script>$(function(){
$('#_datetimepicker5').datetimepicker({
@ -178,15 +189,17 @@ $('#_datetimepicker5').datetimepicker({
});
});
</script>
<h4>handler changeDateTime Example</h4>
<p>JavaScript</p>
<hr id="onChangeDateTime"/>
<h4>handler onChangeDateTime Example <a href="#onChangeDateTime">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker6&#39;).datetimepicker({
timepicker:false,
onChangeDateTime:function(dp,$input){
alert($input.val())
}
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker6" type="text" value="" /></p>
<script>$(function(){
$('#_datetimepicker6').datetimepicker({
@ -198,15 +211,16 @@ $('#_datetimepicker6').datetimepicker({
});
</script>
<h4>minDate and maxDate Example</h4>
<p>JavaScript</p>
<hr id="mindate"/>
<h4>minDate and maxDate Example <a href="#mindate">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker7&#39;).datetimepicker({
timepicker:false,
formatDate:&#39;Y/m/d&#39;,
minDate:&#39;-1970/01/02&#39;,//yesterday is minimum date(for today use 0 or -1970/01/01)
maxDate:&#39;+1970/01/02&#39;//tommorow is maximum date calendar
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker7" type="text" value="" /></p>
<script>$(function(){
$('#_datetimepicker7').datetimepicker({
@ -217,13 +231,15 @@ $('#_datetimepicker7').datetimepicker({
});
});
</script>
<h4>Use mask input Example</h4>
<p>JavaScript</p>
<hr id="mask"/>
<h4>Use mask input Example <a href="#mask">#</a></h4>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">$(&#39;#datetimepicker_mask&#39;).datetimepicker({
timepicker:false,
mask:true, // &#39;9999/19/39 29:59&#39; - digit is the maximum possible for a cell
});</code></pre>
<p>Result</p>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker_mask" type="text" value="" /></p>
<script>$(function(){
$('#_datetimepicker_mask').datetimepicker({
@ -233,6 +249,45 @@ $('#_datetimepicker_mask').datetimepicker({
});
});
</script>
<hr id="runtime_options"/>
<h4>Set options runtime DateTimePicker <a href="#runtime_options">#</a></h4>
<p>If select day is Saturday, the minimum set 11:00, otherwise 8:00</p>
<p><strong>javaScript</strong></p>
<pre><code data-language="javascript">var logic = function( currentDateTime ){
// &#39;this&#39; is jquery object datetimepicker
if( currentDateTime.getDay()==6 ){
this.setOptions({
minTime:&#39;11:00&#39;
});
}else
this.setOptions({
minTime:&#39;8:00&#39;
});
};
$(&#39;#datetimepicker_rantime&#39;).datetimepicker({
onChangeDateTime:logic,
onShow:logic
});</code></pre>
<p><strong>Result</strong></p>
<p><input id="_datetimepicker_runtime" type="text" value="" /></p>
<script>$(function(){
var logic = function( currentDateTime ){
if( currentDateTime.getDay()==6 ){
this.setOptions({
minTime:'11:00'
});
}else
this.setOptions({
minTime:'8:00'
});
};
$('#_datetimepicker_runtime').datetimepicker({
onChangeDateTime:logic,
onShow:logic
});
});
</script>
<h2>Full options list</h2>
<table class="table table-condensed table-bordered table-striped">
<thead>
@ -451,13 +506,13 @@ $('#_datetimepicker_mask').datetimepicker({
<td>&nbsp;</td>
</tr>
<tr>
<td>yearStart/td>
<td>yearStart</td>
<td>1950</td>
<td>Start value for fast Year selector</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>yearEnd/td>
<td>yearEnd</td>
<td>2050</td>
<td>End value for fast Year selector</td>
<td>&nbsp;</td>
@ -472,5 +527,8 @@ $('#_datetimepicker_mask').datetimepicker({
</td>
<td>&nbsp;</td>
</tr>
<tr><td>className</td><td></td><td></td><td></td></tr>
<tr><td>id</td><td></td><td></td><td></td></tr>
<tr><td>style</td><td></td><td></td><td></td></tr>
</tbody>
</table>

View File

@ -22,6 +22,9 @@
<input type="text" id="datetimepicker5"/><br><br>
<h3>Destroy DateTimePicker</h3>
<input type="text" id="datetimepicker6"/><input id="destroy" type="button" value="destroy"/>
<h3>Set options runtime DateTimePicker</h3>
<input type="text" id="datetimepicker7"/>
<p>If select day is Saturday, the minimum set 11:00, otherwise 8:00</p>
</body>
<script src="./jquery.js"></script>
<script src="./jquery.datetimepicker.js"></script>
@ -67,5 +70,19 @@ $('#destroy').click(function(){
this.value = 'destroy';
}
});
var logic = function( currentDateTime ){
if( currentDateTime.getDay()==6 ){
this.setOptions({
minTime:'11:00'
});
}else
this.setOptions({
minTime:'8:00'
});
};
$('#datetimepicker7').datetimepicker({
onChangeDateTime:logic,
onShow:logic
});
</script>
</html>

View File

@ -1,5 +1,5 @@
/**
* @preserve jQuery DateTimePicker plugin v2.0.1
* @preserve jQuery DateTimePicker plugin v2.0.2
* @homepage http://xdsoft.net/jqplugins/datetimepicker/
* (c) 2013, Chupurnov Valeriy.
*/
@ -94,8 +94,7 @@
});
};
$.fn.datetimepicker = function( opt ){
var
CTRLKEY = 17,
var CTRLKEY = 17,
DEL = 46,
ENTER = 13,
ESC = 27,
@ -110,8 +109,9 @@
CKEY = 67,
VKEY = 86,
ZKEY = 90,
YKEY = 89;
var default_options = {
YKEY = 89,
ctrlDown = false,
default_options = {
i18n:{
ru:{
months:[
@ -183,11 +183,14 @@
mask:false,
validateOnBlur:true,
yearStart:1950,
yearEnd:2050
};
var options = ($.isPlainObject(opt)||!opt)?$.extend({},default_options,opt):$.extend({},default_options);
var createDateTimePicker = function( input ){
var datetimepicker = $('<div class="xdsoft_datetimepicker"></div>'),
yearEnd:2050,
style:'',
id:'',
className:''
},
options = ($.isPlainObject(opt)||!opt)?$.extend({},default_options,opt):$.extend({},default_options),
createDateTimePicker = function( input ){
var datetimepicker = $('<div '+(options.id?'id="'+options.id+'"':'')+' '+(options.style?'style="'+options.style+'"':'')+' class="xdsoft_datetimepicker '+options.className+'"></div>'),
xdsoft_copyright = $('<div class="xdsoft_copyright"><a target="_blank" href="http://xdsoft.net/jqplugins/datetimepicker/">xdsoft.net</a></div>'),
datepicker = $('<div class="xdsoft_datepicker active"></div>'),
mounth_picker = $('<div class="xdsoft_mounthpicker"><button type="button" class="xdsoft_prev"></button><div class="xdsoft_label xdsoft_month"><span></span></div><div class="xdsoft_label xdsoft_year"><span></span></div><button type="button" class="xdsoft_next"></button></div>'),
@ -200,30 +203,42 @@
monthselect =$('<div class="xdsoft_select xdsoft_monthselect"><div></div></div>'),
yearselect =$('<div class="xdsoft_select xdsoft_yearselect"><div></div></div>');
mounth_picker.find('.xdsoft_month span').after(monthselect);
mounth_picker.find('.xdsoft_year span').after(yearselect);
//constructor lego
mounth_picker
.find('.xdsoft_month span')
.after(monthselect);
mounth_picker
.find('.xdsoft_year span')
.after(yearselect);
mounth_picker.find('.xdsoft_month,.xdsoft_year').on('mousedown.xdsoft',function(event){
mounth_picker.find('.xdsoft_select').hide();
var select = $(this).find('.xdsoft_select').eq(0),xd = datetimepicker.data('xdsoft_datetime'),val = 0,top = 0;
mounth_picker
.find('.xdsoft_month,.xdsoft_year')
.on('mousedown.xdsoft',function(event) {
mounth_picker
.find('.xdsoft_select')
.hide();
var select = $(this).find('.xdsoft_select').eq(0),
xd = datetimepicker.data('xdsoft_datetime'),
val = 0,
top = 0;
if( xd&&xd.currentTime )
val = xd.currentTime[$(this).hasClass('xdsoft_month')?'getMonth':'getFullYear']();
select.show();
for(var items = select.find('div.xdsoft_option'),i = 0;i<items.length;i++)
if( items.eq(i).data('value')==val )
for(var items = select.find('div.xdsoft_option'),i = 0;i<items.length;i++){
if( items.eq(i).data('value')==val ){
break;
else top+=items[0].offsetHeight;
select.xdsoftScroller(top/(select.children()[0].offsetHeight-(select[0].offsetHeight-2)));
}else top+=items[0].offsetHeight;
}
//select.val(val);
select.xdsoftScroller(top/(select.children()[0].offsetHeight-(select[0].offsetHeight-2)));
event.stopPropagation();
return false;
});
var selects = mounth_picker.find('.xdsoft_select');
selects
mounth_picker
.find('.xdsoft_select')
.xdsoftScroller()
.on('mousedown.xdsoft',function( event ) {
event.stopPropagation();
@ -238,31 +253,38 @@
});
// set options
datetimepicker.setOptions = function( _options ){
options = $.extend({},options,_options);
if( (options.open||options.opened)&&(!options.inline) ){
input.trigger('open.xdsoft');
}
if( options.inline ){
datetimepicker.addClass('xdsoft_inline');
input.after(datetimepicker).hide();
datetimepicker.trigger('afterOpen.xdsoft');
}
if( options.inverseButton ){
options.next = 'xdsoft_prev';
options.prev = 'xdsoft_next';
}
if( !options.datepicker && options.timepicker )
datepicker.removeClass('active');
if( options.datepicker && !options.timepicker )
timepicker.removeClass('active');
if( options.value )
input&&input.val&&input.val(options.value);
if( isNaN(options.dayOfWeekStart)||parseInt(options.dayOfWeekStart)<0||parseInt(options.dayOfWeekStart)>6 )
options.dayOfWeekStart = 0;
else
options.dayOfWeekStart = parseInt(options.dayOfWeekStart);
if( !options.timepickerScrollbar )
scrollbar.hide();
var tmpDate = [];
@ -273,7 +295,7 @@
options.maxDate = new Date((new Date).getTime()+tmpDate.getTime()).dateFormat( options.formatDate );
}
if( options.mask ){
var ctrlDown=false,e,
var e,
getCaretPos = function( input ) {
try{
if ( document.selection && document.selection.createRange ) {
@ -312,13 +334,6 @@
.replace(/\{digit[\+]\}/g,'[0-9_]{1}');
return RegExp(reg).test(value);
};
$(document).on('keydown.xdsoft',function(e){
if ( e.keyCode == CTRLKEY )
ctrlDown = true;
}).on('keyup.xdsoft',function(e){
if ( e.keyCode == CTRLKEY )
ctrlDown = false;
});
input.off('keydown.xdsoft');
switch(true){
case ( options.mask===true ):
@ -326,9 +341,11 @@
options.mask = options.mask.replace(/[0-9]/g,'_');
case ( $.type(options.mask) == 'string' ):
if( !isValidValue( options.mask,input.val() ) )
input.val(options.mask.replace(/[0-9]/g,'_'))
input.val(options.mask.replace(/[0-9]/g,'_'));
input.on('keydown.xdsoft',function( event ){
var val = this.value , key = event.which;
var val = this.value,
key = event.which;
switch(true){
case ((key>=48&&key<=57)||(key>=96&&key<=105))||(key==BACKSPACE||key==DEL):
var pos = getCaretPos(this),
@ -346,6 +363,7 @@
else
if( pos==options.mask.length )
break;
pos+=(key==BACKSPACE||key==DEL)?0:1;
while( /[^0-9_]/.test(options.mask.substr(pos,1))&&pos<options.mask.length&&pos>0 )
pos+=(key==BACKSPACE||key==DEL)?-1:1;
@ -358,14 +376,14 @@
input.trigger('error_input.xdsoft');
}
break;
case (([AKEY,CKEY,VKEY,ZKEY,YKEY].indexOf(key)!==-1)&&(ctrlDown)):
case [ESC,ARROWUP,ARROWDOWN,ARROWLEFT,ARROWRIGHT,F5,CTRLKEY].indexOf(key)!==-1:
case ( ~[AKEY,CKEY,VKEY,ZKEY,YKEY].indexOf(key)&&ctrlDown ):
case ~[ESC,ARROWUP,ARROWDOWN,ARROWLEFT,ARROWRIGHT,F5,CTRLKEY].indexOf(key):
return true;
case [ENTER].indexOf(key)!==-1:
case ~[ENTER].indexOf(key):
var elementSelector = "input:visible,textarea:visible";
$(elementSelector ).eq($(elementSelector ).index(this) + 1).focus();
return false;
case [TAB].indexOf(key)!==-1:return true;
case ~[TAB].indexOf(key):return true;
}
event.preventDefault();
return false;
@ -374,82 +392,27 @@
}
}
if( options.validateOnBlur ){
input.off('blur.xdsoft')
input
.off('blur.xdsoft')
.on('blur.xdsoft', function(){
if( !Date.parseDate( $(this).val(), options.format ) )
$(this).val((new Date()).dateFormat( options.format ));
});
}
options.dayOfWeekStartPrev = (options.dayOfWeekStart==0)?6:options.dayOfWeekStart-1;
datetimepicker
.trigger('xchange.xdsoft');
};
datetimepicker.data('options',options);
datetimepicker.on('mousedown.xdsoft',function( event ){
datetimepicker
.data('options',options)
.on('mousedown.xdsoft',function( event ){
event.stopPropagation();
event.preventDefault();
yearselect.hide();
monthselect.hide();
return false;
});
// scrollbar for timepicker
/*scrollbar.append(scroller);
timepicker.find('.xdsoft_time_box').append(scrollbar);
(function(){
var move = 0;
scroller.on('mousedown.xdsoft',function( event ){
var pageY = event.pageY,
top = parseInt(scroller.css('margin-top')),
h1 = scrollbar[0].offsetHeight;
$('body').addClass('xdsoft_noselect');
$([document.body,window]).on('mouseup.xdsoft',function(){
$([document.body,window]).off('mouseup.xdsoft',arguments.callee)
.off('mousemove.xdsoft',move)
.removeClass('xdsoft_noselect');
});
$('body').on('mousemove.xdsoft',move = function(event){
var offset = event.pageY-pageY+top;
if( offset<0 )
offset = 0;
if( offset+scroller[0].offsetHeight>h1 )
offset = h1-scroller[0].offsetHeight;
scroller.css('margin-top',offset);
datetimepicker.trigger('scroll.scrollbar',[offset]);
});
});
datetimepicker.on('scroll.timebox',function( event,offset ){
if( !options.timepickerScrollbar )
return;
var sbh = scrollbar.height()-scroller[0].offsetHeight,
pheight = timeboxparent[0].offsetHeight-2,
height = timebox[0].offsetHeight,
percent = offset/(height-pheight);
scroller.css('margin-top',sbh*percent);
})
.on('afterOpen.xdsoft',function( event ){
if( !options.timepickerScrollbar )
return;
var pheight = timeboxparent[0].offsetHeight-2;
height = timebox[0].offsetHeight,
percent = pheight/height,
sh = percent*scrollbar[0].offsetHeight;
if( percent>1 )
scroller.hide();
else{
scroller.show();
scroller.css('height',parseInt(sh>10?sh:10));
}
});
})();
datetimepicker.on('scroll.scrollbar',function(event,offset){
var sbh = scrollbar[0].offsetHeight-scroller[0].offsetHeight,
percent = offset/sbh;
pheight = timeboxparent[0].offsetHeight-2,
height = timebox[0].offsetHeight;
timebox.css('marginTop',-parseInt((height-pheight)*percent))
});
*/
var scroll_element = timepicker.find('.xdsoft_time_box');
scroll_element.append(timebox);
@ -457,78 +420,103 @@
datetimepicker.on('afterOpen.xdsoft',function(){
scroll_element.xdsoftScroller();
});
datetimepicker.append(datepicker).append(timepicker);
datetimepicker
.append(datepicker)
.append(timepicker);
if( options.withoutCopyright!==true )
datetimepicker.append(xdsoft_copyright);
datepicker.append(mounth_picker).append(calendar);
datetimepicker
.append(xdsoft_copyright);
datepicker
.append(mounth_picker)
.append(calendar);
$('body').append(datetimepicker);
var xdsoft_datetime = function(){
var self = this;
self.now = function(){
var XDSoftDateTime = function(){
var _this = this;
_this.now = function(){
return new Date();
};
self.currentTime = this.now();
self.isValidDate = function (d) {
_this.currentTime = this.now();
_this.isValidDate = function (d) {
if ( Object.prototype.toString.call(d) !== "[object Date]" )
return false;
return !isNaN(d.getTime());
};
self.setCurrentTime = function( dTime){
self.currentTime = (typeof dTime == 'string')? self.strtodatetime(dTime) : self.isValidDate(dTime) ? dTime: self.now();
_this.setCurrentTime = function( dTime){
_this.currentTime = (typeof dTime == 'string')? _this.strtodatetime(dTime) : _this.isValidDate(dTime) ? dTime: _this.now();
datetimepicker.trigger('xchange.xdsoft');
};
self.getCurrentTime = function( dTime){
return self.currentTime;
_this.getCurrentTime = function( dTime){
return _this.currentTime;
};
self.nextMonth = function(){
var month = self.currentTime.getMonth()+1;
_this.nextMonth = function(){
var month = _this.currentTime.getMonth()+1;
if( month==12 ){
self.currentTime.setFullYear(self.currentTime.getFullYear()+1);
_this.currentTime.setFullYear(_this.currentTime.getFullYear()+1);
month = 0;
}
self.currentTime.setMonth(month);
options.onChangeMonth&&options.onChangeMonth.call&&options.onChangeMonth.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
datetimepicker.trigger('xchange.xdsoft');
return month;
};
self.prevMonth = function(){
var month = self.currentTime.getMonth()-1;
if( month==-1 ){
self.currentTime.setFullYear(self.currentTime.getFullYear()-1);
month = 11;
}
self.currentTime.setMonth(month);
_this.currentTime.setMonth(month);
options.onChangeMonth&&options.onChangeMonth.call&&options.onChangeMonth.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
datetimepicker.trigger('xchange.xdsoft');
return month;
};
this.strtodatetime = function( sDateTime ){
_this.prevMonth = function(){
var month = _this.currentTime.getMonth()-1;
if( month==-1 ){
_this.currentTime.setFullYear(_this.currentTime.getFullYear()-1);
month = 11;
}
_this.currentTime.setMonth(month);
options.onChangeMonth&&options.onChangeMonth.call&&options.onChangeMonth.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
datetimepicker.trigger('xchange.xdsoft');
return month;
};
_this.strtodatetime = function( sDateTime ){
var currentTime = sDateTime?Date.parseDate(sDateTime, options.format):new Date;
if( ! self.isValidDate(currentTime) )
if( !_this.isValidDate(currentTime) )
currentTime = new Date;
return currentTime;
};
this.strtodate = function( sDate ){
_this.strtodate = function( sDate ){
var currentTime = sDate?Date.parseDate(sDate, options.formatDate):new Date;
if( !self.isValidDate(currentTime) )
if( !_this.isValidDate(currentTime) )
currentTime = new Date;
return currentTime;
};
this.strtotime = function( sTime ){
_this.strtotime = function( sTime ){
var currentTime = sTime?Date.parseDate(sTime, options.formatTime):new Date;
if( ! self.isValidDate(currentTime) )
if( !_this.isValidDate(currentTime) )
currentTime = new Date;
return currentTime;
};
this.str = function(){
return this.currentTime.dateFormat(options.format);
_this.str = function(){
return _this.currentTime.dateFormat(options.format);
};
};
mounth_picker.find('.xdsoft_prev,.xdsoft_next').on('mousedown.xdsoft',function(){
var $this = $(this), timer = 0, stop = false;
mounth_picker
.find('.xdsoft_prev,.xdsoft_next')
.on('mousedown.xdsoft',function(){
var $this = $(this),
timer = 0,
stop = false;
(function(v){
var month = datetimepicker.data('xdsoft_datetime').currentTime.getMonth();
var month = datetimepicker.data('xdsoft_datetime')
.currentTime.getMonth();
if( $this.hasClass( options.next ) ){
datetimepicker.data('xdsoft_datetime').nextMonth();
}else if( $this.hasClass( options.prev ) ){
@ -536,14 +524,21 @@
}
!stop&&(timer = setTimeout(arguments.callee,v?v:100));
})(500);
$([document.body,window]).on('mouseup.xdsoft',function(){
clearTimeout(timer);
stop = true;
$([document.body,window]).off('mouseup.xdsoft',arguments.callee);
});
});
timepicker.find('.xdsoft_prev,.xdsoft_next').on('mousedown.xdsoft',function(){
var $this = $(this), timer = 0, stop = false, period = 110;
timepicker
.find('.xdsoft_prev,.xdsoft_next')
.on('mousedown.xdsoft',function(){
var $this = $(this),
timer = 0,
stop = false,
period = 110;
(function(v){
var pheight = timeboxparent[0].offsetHeight-2,
height = timebox[0].offsetHeight,
@ -560,20 +555,31 @@
$([document.body,window]).on('mouseup.xdsoft',function(){
clearTimeout(timer);
stop = true;
$([document.body,window]).off('mouseup.xdsoft',arguments.callee);
$([document.body,window])
.off('mouseup.xdsoft',arguments.callee);
});
});
// base handler - generating a calendar and timepicker
datetimepicker.on('xchange.xdsoft',function(event){
datetimepicker
.on('xchange.xdsoft',function(event){
var xd = $(this).data('xdsoft_datetime'),
table = '';
var start = new Date(xd.currentTime.getFullYear(),xd.currentTime.getMonth(),1);
table = '',
start = new Date(xd.currentTime.getFullYear(),xd.currentTime.getMonth(),1),
i = 0,
today = new Date;
while( start.getDay()!=options.dayOfWeekStart )
start.setDate(start.getDate()-1);
var i = 0, today = new Date;
//generate calendar
table+='<table><thead><tr>';
for(var j = 0; j<7; j++)
// days
for(var j = 0; j<7; j++){
table+='<th>'+options.i18n[options.lang].dayOfWeek[(j+options.dayOfWeekStart)>6?0:j+options.dayOfWeekStart]+'</th>';
}
table+='</tr></thead>';
table+='<tbody><tr>';
while( i<xd.currentTime.getDaysInMonth()||start.getDay()!=options.dayOfWeekStart||xd.currentTime.getMonth()==start.getMonth() ){
@ -593,11 +599,17 @@
start.setDate(start.getDate()+1);
}
table+='</tbody></table>';
calendar.html(table);
mounth_picker.find('.xdsoft_label span').eq(0).text(options.i18n[options.lang].months[xd.currentTime.getMonth()]);
mounth_picker.find('.xdsoft_label span').eq(1).text(xd.currentTime.getFullYear());
var time = '',h = '',m ='';
var line_time = function (h,m){
// generate timebox
var time = '',
h = '',
m ='',
line_time = function line_time( h,m ){
var now = new Date();
now.setHours(h);
h = parseInt(now.getHours());
@ -617,8 +629,8 @@
'" data-hour="'+h+'" data-minute="'+m+'">'+now.dateFormat(options.formatTime)+'</div>';
};
if( !options.allowTimes || !$.isArray(options.allowTimes) || !options.allowTimes.length ){
for(var i=0;i<(options.hours12?12:24);i++){
for(var j=0;j<60;j+=options.step){
for(var i=0,j=0;i<(options.hours12?12:24);i++){
for(j=0;j<60;j+=options.step){
h = (i<10?'0':'')+i;
m = (j<10?'0':'')+j;
line_time( h,m );
@ -632,19 +644,23 @@
}
}
timebox.html(time);
var opt = '',i = 0;
for( i = parseInt(options.yearStart);i<= parseInt(options.yearEnd);i++ ){
var opt = '',
i = 0;
for( i = parseInt(options.yearStart,10);i<= parseInt(options.yearEnd,10);i++ ){
opt+='<div class="xdsoft_option '+(xd.currentTime.getFullYear()==i?'xdsoft_current':'')+'" data-value="'+i+'">'+i+'</div>';
}
yearselect.children().eq(0).html(opt);
yearselect.children().eq(0)
.html(opt);
for( i = 0,opt = '';i<= 11;i++ ){
opt+='<div class="xdsoft_option '+(xd.currentTime.getMonth()==i?'xdsoft_current':'')+'" data-value="'+i+'">'+options.i18n[options.lang].months[i]+'</div>';
}
monthselect.children().eq(0).html(opt);
event.stopPropagation();
//timebox.find('.xdsoft_current').length&&timebox.css('marginTop','-'+parseInt(timebox.find('.xdsoft_current').index()*options.timeHeightInTimePicker)+'px');
});
datetimepicker.on('afterOpen.xdsoft',function(){
})
.on('afterOpen.xdsoft',function(){
if( options.timepicker && timebox.find('.xdsoft_current').length ){
var pheight = timeboxparent[0].offsetHeight-2,
height = timebox[0].offsetHeight,
@ -655,34 +671,52 @@
timeboxparent.trigger('scroll_element.xdsoft_scroller',[parseInt(top)/(height-pheight)]);
}
});
calendar.on('mousedown.xdsoft','td',function(){
if($(this).hasClass('xdsoft_disabled'))
calendar
.on('mousedown.xdsoft','td',function(){
var $this = $(this),
currentTime = datetimepicker.data('xdsoft_datetime').currentTime;
if( $this.hasClass('xdsoft_disabled') )
return false;
var ct = datetimepicker.data('xdsoft_datetime').currentTime;
ct.setFullYear($(this).data('year'));
ct.setMonth($(this).data('month'));
ct.setDate($(this).data('date'));
datetimepicker.trigger('select.xdsoft',[ct]);
currentTime.setFullYear( $this.data('year') );
currentTime.setMonth( $this.data('month') );
currentTime.setDate( $this.data('date') );
datetimepicker.trigger('select.xdsoft',[currentTime]);
input.val( datetimepicker.data('xdsoft_datetime').str() );
if( (options.closeOnDateSelect===true||( options.closeOnDateSelect===0&&!options.timepicker ))&&!options.inline )
if( (options.closeOnDateSelect===true||( options.closeOnDateSelect===0&&!options.timepicker ))&&!options.inline ){
datetimepicker.trigger('close.xdsoft');
options.onSelectDate&&options.onSelectDate.call&&options.onSelectDate.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
}
if( options.onSelectDate && options.onSelectDate.call ){
options.onSelectDate.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
}
datetimepicker.trigger('xchange.xdsoft');
datetimepicker.trigger('changedatetime.xdsoft');
});
timebox.on('mousedown.xdsoft','div',function(){
if($(this).hasClass('xdsoft_disabled'))
timebox
.on('mousedown.xdsoft','div',function(){
var $this = $(this),
currentTime = datetimepicker.data('xdsoft_datetime').currentTime;
if( $this.hasClass('xdsoft_disabled') )
return false;
var ct = datetimepicker.data('xdsoft_datetime').currentTime;
ct.setHours($(this).data('hour'));
ct.setMinutes($(this).data('minute'));
datetimepicker.trigger('select.xdsoft',[ct]);
currentTime.setHours($this.data('hour'));
currentTime.setMinutes($this.data('minute'));
datetimepicker.trigger('select.xdsoft',[currentTime]);
datetimepicker.data('input').val( datetimepicker.data('xdsoft_datetime').str() );
!options.inline&&datetimepicker.trigger('close.xdsoft');
options.onSelectTime&&options.onSelectTime.call&&options.onSelectTime.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
if( options.onSelectTime&&options.onSelectTime.call ){
options.onSelectTime.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
}
datetimepicker.trigger('xchange.xdsoft');
datetimepicker.trigger('changedatetime.xdsoft');
});
datetimepicker.mousewheel&&datepicker.mousewheel(function(event, delta, deltaX, deltaY) {
if( !options.scrollMonth )
return true;
@ -692,6 +726,7 @@
datetimepicker.data('xdsoft_datetime').prevMonth();
return false;
});
datetimepicker.mousewheel&&timeboxparent.unmousewheel().mousewheel(function(event, delta, deltaX, deltaY) {
if( !options.scrollTime )
return true;
@ -710,9 +745,13 @@
event.stopPropagation();
return fl;
});
datetimepicker.on('changedatetime.xdsoft',function(){
options.onChangeDateTime&&options.onChangeDateTime.call&&options.onChangeDateTime.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
datetimepicker
.on('changedatetime.xdsoft',function(){
if( options.onChangeDateTime&&options.onChangeDateTime.call )
options.onChangeDateTime.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
});
var current_time_index = 0;
input.mousewheel&&input.mousewheel(function( event, delta, deltaX, deltaY ){
if( !options.scrollInput )
@ -730,9 +769,13 @@
return false;
}
});
datetimepicker.on('open.xdsoft',function(){
datetimepicker
.on('open.xdsoft', function(){
var onShow = true;
options.onShow&&options.onShow.call&&(onShow=options.onShow.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input')));
if( options.onShow&&options.onShow.call){
onShow = options.onShow.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
}
if( onShow!==false ){
var setPos = function(){
var offset = datetimepicker.data('input').offset(), top = offset.top+datetimepicker.data('input')[0].offsetHeight-1, left = offset.left;
@ -740,12 +783,12 @@
top = offset.top-datetimepicker[0].offsetHeight+1;
if( left+datetimepicker[0].offsetWidth>$('body').width() )
left = offset.left-datetimepicker[0].offsetWidth+datetimepicker.data('input')[0].offsetWidth;
datetimepicker.css({
left:offset.left,
top:top
});
};
datetimepicker.show();
datetimepicker.trigger('afterOpen.xdsoft');
setPos();
@ -758,23 +801,31 @@
});
}
}
});
datetimepicker.on( 'close.xdsoft',function( event ){
})
.on('close.xdsoft', function( event ){
var onClose = true;
options.onClose&&options.onClose.call&&(onClose=options.onClose.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input')));
if( options.onClose&&options.onClose.call ){
onClose=options.onClose.call(datetimepicker,datetimepicker.data('xdsoft_datetime').currentTime,datetimepicker.data('input'));
}
if( onClose!==false&&!options.opened&&!options.inline ){
datetimepicker.hide();
}
event.stopPropagation();
} );
datetimepicker.data('input',input);
})
.data('input',input);
var _xdsoft_datetime = new XDSoftDateTime,
timer = 0,
timer1 = 0;
var _xdsoft_datetime = new xdsoft_datetime,timer = 0,timer1 = 0;
datetimepicker.data('xdsoft_datetime',_xdsoft_datetime);
datetimepicker.setOptions(options);
_xdsoft_datetime.setCurrentTime( options.value?options.value:(input&&input.val&&input.val())?input.val():new Date );
datetimepicker.trigger('afterOpen.xdsoft');
input.data( 'xdsoft_datetimepicker',datetimepicker )
input
.data( 'xdsoft_datetimepicker',datetimepicker )
.on('open.xdsoft focusin.xdsoft mousedown.xdsoft',function(event){
if( input.is(':disabled')||input.is(':hidden')||!input.is(':visible') )
return;
@ -792,22 +843,32 @@
datetimepicker.trigger('close.xdsoft');
},100);
});
};
var destroyDateTimePicker = function(input){
},
destroyDateTimePicker = function( input ){
var datetimepicker = input.data('xdsoft_datetimepicker');
if( datetimepicker ){
var _xdsoft_datetime = datetimepicker.data('xdsoft_datetime');
delete _xdsoft_datetime;
datetimepicker.remove();
delete datetimepicker;
input.data( 'xdsoft_datetimepicker',null );
input.off( 'open.xdsoft focusin.xdsoft focusout.xdsoft mousedown.xdsoft blur.xdsoft' );
input
.data( 'xdsoft_datetimepicker',null )
.off( 'open.xdsoft focusin.xdsoft focusout.xdsoft mousedown.xdsoft blur.xdsoft' );
$(window).off('resize.xdsoft');
$([window,document.body]).off('mousedown.xdsoft');
input.unmousewheel&&input.unmousewheel();
delete options;
}
};
$(document)
.off('keydown.xdsoft keyup.xdsoft')
.on('keydown.xdsoft',function(e){
if ( e.keyCode == CTRLKEY )
ctrlDown = true;
}).on('keyup.xdsoft',function(e){
if ( e.keyCode == CTRLKEY )
ctrlDown = false;
});
return this.each(function(){
var datetimepicker;
if( datetimepicker = $(this).data('xdsoft_datetimepicker') ){
@ -825,7 +886,8 @@
break;
}
}else{
$(this).data('xdsoft_datetimepicker').setOptions(options);
datetimepicker
.setOptions(options);
}
return 0;
}else