oxjs/source/Ox.UI/js/Form/Ox.DateTimeInput.js
2012-05-21 12:38:18 +02:00

73 lines
2 KiB
JavaScript

'use strict';
/*@
Ox.DateTimeInput <f:Ox.Element> DateTimeInput Element
() -> <f> DateTimeInput Element
(options) -> <f> DateTimeInput Element
(options, self) -> <f> DateTimeInput Element
options <o> Options object
ampm <b|false> false is 24h true is am/pm
format <s|short> options are short, medium, long
seconds <b|false> show seconds
value <d> defautls to now
weekday <b|false> weekday
self <o> Shared private variable
change <!> triggered on change of value
@*/
Ox.DateTimeInput = function(options, self) {
var that;
self = Ox.extend(self || {}, {
options: Ox.extend({
ampm: false,
format: 'short',
milliseconds: false,
seconds: false,
value: (function() {
var date = new Date();
return Ox.formatDate(
date,
'%F ' + (options.seconds || options.milliseconds ? '%T' : '%H:%M')
) + (options.milliseconds ? '.' + Ox.pad(date % 1000, 3) : '');
}()),
weekday: false
}, options || {})
});
self.options.seconds = self.options.seconds || self.options.milliseconds;
that = Ox.InputGroup({
inputs: [
Ox.DateInput({
format: self.options.format,
id: 'date',
weekday: self.options.weekday
}),
Ox.TimeInput({
ampm: self.options.ampm,
id: 'time',
seconds: self.options.seconds
})
],
join: join,
separators: [
{title: '', width: 8}
],
split: split,
value: self.options.value
}, self);
function join() {
return that.options('inputs').map(function($input) {
return $input.value();
}).join(' ');
}
function split() {
return self.options.value.split(' ');
}
return that;
};